Skip to content

perf: opt homepage and navbar into React Compiler [codex] - #1369

Merged
jderochervlk merged 5 commits into
perf/route-css-boundariesfrom
perf/homepage-react-compiler
Sep 21, 2026
Merged

jderochervlk merged 5 commits into
perf/route-css-boundariesfrom
perf/homepage-react-compiler

Conversation

@jderochervlk

@jderochervlk jderochervlk commented Sep 19, 2026 •

Copy link
Copy Markdown
Collaborator

Complete the initial compiler rollout in #1354 on top of #1367. Enable React Compiler in React 19 annotation mode across generated docs application modules. The homepage composition, copy button, intro, install instructions, trusted-by section, and all three NavbarPrimary component functions opt in with ReScript directives.

The Vite plugin now uses apps/docs/app and apps/docs/src as a coarse generated-JSX boundary; "use memo" annotations remain the per-function opt-in. Vite and Vitest share the client-only preset. Contract coverage proves eligible unannotated modules remain unchanged, and server rendering remains uncompiled.

Artifact checks verify five compiled homepage functions and three compiled navbar functions in the production client while confirming that their server originals stay uncompiled. Browser coverage protects install prop updates, repeated copying and failure recovery, navbar layouts, navigation across shared routes, and lazy search inside the navbar.

Compared with the current #1367 target, initial JavaScript changes from 25 requests / 972,018 raw bytes / 146,252 gzip bytes to 26 requests / 975,598 raw bytes / 147,718 gzip bytes. That is a 3,580-byte raw and 1,466-byte gzip cost, including one shared compiler-runtime request. CSS remains 45,161 raw / 10,362 gzip bytes and the DOM remains 415 elements.

This deliberately includes the shared navbar because it receives frequent scroll and navigation renders. Components imported from dependencies, such as React Router Link, are not directly annotatable here; compiling their callers can still stabilize the elements passed to them. Lighthouse remains informational with no score threshold.

@jderochervlk
jderochervlk added this pull request to stack #1359 September 19, 2026 19:24
@jderochervlk jderochervlk changed the title perf(homepage): opt leaf components into React Compiler perf(homepage): opt leaf components into React Compiler [Codex] Sep 19, 2026
@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Sep 19, 2026 •

Copy link
Copy Markdown

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Preview URL Updated (UTC)
✅ Deployment successful!
View logs
guide 8f0f6c1 Commit Preview URL

Branch Preview URL
Sep 20 2026, 10:20 PM

@github-actions

github-actions Bot commented Sep 19, 2026 •

Copy link
Copy Markdown
Contributor

Lighthouse baseline

Compared with target branch perf/route-css-boundaries at commit 919941c. Scores are the median of 3 runs against the deployed Cloudflare preview.

Category Target Current Change
Performance 84 84 0
Accessibility 80 80 0
Best practices 100 100 0
SEO 58 58 0

Download the full Lighthouse reports and baseline

Commit 1df2b55 · Cloudflare preview

@jderochervlk
jderochervlk marked this pull request as ready for review September 19, 2026 19:35
@chatgpt-codex-connector

chatgpt-codex-connector Bot commented Sep 19, 2026 •

Copy link
Copy Markdown

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review Status Commit Review trigger
📝 Code Review ✅ Completed 2026-09-20T23:06:04.536487Z 8f0f6c1 Draft marked ready
ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 781073eb2d

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment thread apps/docs/vite-react-compiler.mjs Outdated
Comment thread apps/docs/scripts/__tests__/homepage-compiler.test.mjs Outdated
Share a client-only React 19 annotation-mode compiler configuration between Vite and Vitest. Opt in the intro, install instructions and trusted-by components while keeping other modules and SSR uncompiled.

Verify source annotations and actual production client/server output, and cover install prop changes and copy behavior. Record the 427-byte gzip JavaScript cost with unchanged requests, CSS and DOM.
Match generated homepage components in both app/routes and src/components. Update compiler fixtures to their actual locations and retain annotation-only, client-only compilation checks and exclusions.
Point the React Compiler contract tests at the homepage interaction components in src/components.
Compile the shared primary navbar and its stable left and right subtrees in client builds. Extend the compiler contract to verify the source transform, production client artifact, and unchanged server boundary.
@jderochervlk jderochervlk changed the title perf(homepage): opt leaf components into React Compiler [Codex] perf: opt homepage and navbar into React Compiler [Codex] Sep 20, 2026
Use annotation mode as the component boundary across generated app and src JSX. Compile the homepage composition and copy button while proving eligible unannotated modules remain unchanged.
@github-actions

Copy link
Copy Markdown
Contributor

Docs preview

@jderochervlk
jderochervlk marked this pull request as ready for review September 20, 2026 23:01
@jderochervlk jderochervlk changed the title perf: opt homepage and navbar into React Compiler [Codex] perf: opt homepage and navbar into React Compiler [codex] Sep 21, 2026
@jderochervlk
jderochervlk merged commit 9b534e2 into master Sep 21, 2026
12 checks passed
@jderochervlk
jderochervlk deleted the perf/homepage-react-compiler branch September 21, 2026 16:15

This branch was successfully deployed

2 active deployments
preview — 8f0f6c16 Deployed Sep 20, 2026 by github-actions[bot]
guide-preview — 8f0f6c16 Deployed Sep 20, 2026 by github-actions[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants