fw-06 step 03 — JSX, and what a compiler cannot know

Goal

Build the JSX transform, then articulate precisely why it can optimise less than a template compiler.

Tasks

  1. Using an existing JS parser, transform JSX to createElement calls.
  2. Emit source maps. Chain them through at least two transforms and confirm they compose.
  3. Find the limits. Construct three JSX expressions your analysis cannot see through ({items.map(renderRow)}, an opaque factory call, a conditional returning components from a lookup table). For each, state what a template compiler would have known.
  4. Explain why the compiler must be conservative wherever it cannot prove a fact — and that conservatism costs exactly the optimisation you wanted.
  5. Write the argument for why React's compiler arrived a decade after Vue's, in terms of whole-function analysis versus template transformation.

Done when

  • JSX transform working with composed source maps
  • Three un-analysable expressions documented with what is lost
  • The template-vs-JSX asymmetry stated as an architectural claim, not a syntax preference