How a Single Parser PR Unlocked Prerendering for the Brisa Framework

One PR to a parser unlocked prerendering in Brisa

Aral Roca built Brisa, a framework requiring deep AST analysis for server/client component detection and JSX transformation. By contributing to the Meriyah parser, he enabled microsecond-fast AST generation without the overhead of native bindings.

Why This Matters

Framework developers often choose heavy compiler APIs that introduce significant build-time latency, such as the TypeScript compiler API which requires full type-checker instantiation. Transitioning to lightweight, ESTree-compliant parsers like Meriyah allows for high-speed transformations while maintaining the ability to inject complex features like build-time prerendering macros.

Key Insights

• Meriyah provides ESTree-compliant ASTs in microseconds without WASM or native binding overhead.
• The Brisa framework uses a renderOn=“build” attribute to trigger build-time prerendering via AST transformation.
• Acorn is the industry standard parser used internally by ESLint for strict ESTree compliance.
• SWC is a Rust-based compiler used by Next.js and Turbopack that uses spans instead of start/end positions in its AST structure.
• Operator precedence in JavaScript is structurally encoded in the AST, where deeper nodes like multiplication evaluate before their parent addition nodes.

Working Examples

The import attribute injected by Brisa’s build pipeline to resolve functions at compile time via Bun.

import { __prerender__macro } from 'brisa/macros' with { type: 'macro' };

An arrow function where the AST shows expression: true, distinguishing implicit returns from block statements.

const add = (a, b) => a + b;

Deeply nested destructuring that generates AssignmentPattern and ObjectPattern nodes in the AST.

const { a = 1, b: { c = 2 } = {} } = config;

Practical Applications

• Use Case: Brisa resolves relative imports to absolute paths at build time by walking ImportDeclaration nodes and modifying the source.value property. Pitfall: Using ts.createProgram() for simple AST tasks causes slow builds due to full lib resolution.
• Use Case: next-translate-plugin uses AST analysis to detect getStaticProps and inject locale loaders into Next.js pages. Pitfall: Assuming consistent node properties across parsers, such as Meriyah using ‘value’ where astring expects ‘name’ on Literals.

References:

• https://dev.to/aralroca/one-pr-to-a-parser-unlocked-prerendering-in-brisa-ijo