Files
backnotprop__plannotator/packages/ui/utils/math-eager.ts
Michael Ramos 0b167cc478 perf(ui): lazy diagram and math renderers with eager entries for Plannotator (#1394)
Bundle-weight optimization of @plannotator/ui for multi-chunk hosts, requested by Workspaces: the Mermaid runtime and Graphviz engine load inside the render effect, the username dictionary sits behind a synchronous identity generator slot, and KaTeX sits behind a math renderer slot with a loader seam on configurePlannotatorUI. Plannotator's own apps import eager entries (math, identity, and Mermaid for the plan editor) so their behavior is unchanged: single-file builds within noise of main, math typeset on first paint, identities from the full dictionary, and the share portal keeps Mermaid in its entry chunk so its failure surface matches main. Built-HTML registration markers guard the eager imports. Hosts that omit the eager entries get the lazy paths, a one-shot automatic re-attempt, and a Retry affordance on the diagram error panel; the module-map limitation of in-page retries is documented.

AI-assisted (Claude) under maintainer direction.
2026-08-27 07:35:49 -07:00

26 lines
1.2 KiB
TypeScript

/**
* Eager math registration: fills the renderer slot in `./math` with KaTeX at
* module evaluation, before any component renders.
*
* Every Plannotator entry (`packages/editor/App.tsx`, `packages/review-editor/App.tsx`;
* the hook, review, portal, OpenCode and Pi builds all flow from those two)
* imports this module for its side effect, which is what keeps math typeset
* on the first commit exactly as it was with a static `katex` import. A host
* that wants the same synchronous behavior imports it too:
*
* import '@plannotator/ui/utils/math-eager';
*
* A host that does not import it gets lazy math: the TeX source in the same
* wrapper for one frame, then the typeset markup once the chunk lands.
*
* The source tag passed below doubles as a build marker: the literal only
* reaches a bundle when this module is evaluated in it, so a dropped or
* tree-shaken side-effect import is caught by the built-HTML check in
* tests/entry-assets.test.ts (KaTeX itself stays inlined either way through
* the loader's import(), so a KaTeX class name cannot prove registration).
*/
import katex from 'katex';
import { setMathRenderer } from './math';
setMathRenderer(katex, 'plannotator-math-eager');