Skip to content

extension: lazy-load rare content-script UI - #422

Closed
spencerc99 wants to merge 4 commits into
mainfrom
cx/lazy-content-ui
Closed

extension: lazy-load rare content-script UI#422
spencerc99 wants to merge 4 commits into
mainfrom
cx/lazy-content-ui

Conversation

@spencerc99

@spencerc99 spencerc99 commented Aug 26, 2026

Copy link
Copy Markdown
Owner

Summary

  • keep cursor, navigation, viewport, keyboard, and gated scrap collectors on their existing all-page initialization paths
  • move the historical overlay, milestone toast, toast styles, and React Shadow DOM mounting support into an on-demand WXT entrypoint
  • load that entrypoint only when a history or milestone event actually displays the rare UI, preserving replacement, teardown, error recovery, and stale-request handling
  • add a headless paired benchmark that stops only after all four normal collectors report enabled

Content-script size

Measured from same-machine production Chrome MV3 builds of current main (769bba1c) and this branch (59951aa1):

Encoding Main This PR Change
Raw 1,203,388 B 1,120,542 B -82,846 B (-6.88%)
gzip -9 516,378 B 489,429 B -26,949 B (-5.22%)
Brotli q11 303,110 B 280,653 B -22,457 B (-7.41%)

The on-demand content-page-ui.js artifact is 340,207 B raw, 107,710 B gzip, and 92,587 B Brotli. This trades total package bytes for less code parsed and initialized on every supported page. Site-specific React features still leave some React code in the eager content bundle; broader feature splitting is outside this focused change.

Collector-ready startup

I ran 15 alternating same-machine pairs in headless Chrome. Every run used a fresh profile, started and seeded the extension worker before timing, navigated to the same local no-script page, and stopped when cursor, navigation, viewport, and keyboard collectors all reported enabled. The rare UI script was not requested during startup in any run.

Metric Main median This PR median Paired median change Lower-work PR pairs
Collector-ready wall time 96.292 ms 94.430 ms -1.813 ms 11/15
TaskDuration 66.433 ms 64.506 ms -1.916 ms 14/15
ScriptDuration 32.058 ms 31.683 ms -0.389 ms 13/15
JSHeapUsedSize delta 3,124,644 B 3,016,264 B -108,380 B 15/15

The aggregate wall-time mean changed from 99.310 ms to 96.988 ms (-2.322 ms), but the run-to-run range is much wider than that difference. This PR therefore does not claim a meaningful wall-clock page-load improvement. It does show a small reduction in renderer startup work and a consistent roughly 100 KB reduction in startup heap while all collectors remain ready.

Local raw results: /private/tmp/playhtml-extension-startup-latest-main-15/startup-summary.json (not committed).

Built UI validation

The benchmark exercised the real production MV3 build after collector readiness:

  • confirmed content-page-ui.js was absent from ordinary startup requests
  • opened and closed the historical overlay
  • mounted a milestone toast
  • observed content-page-ui.js requested only when the overlay was opened

This validation runs headlessly so it does not steal focus or interrupt desktop use.

Verification

  • bun run build-packages
  • focused milestone lazy-UI test: 1 passed
  • bun run test:extension: 140 files and 896 tests passed
  • bun run check:extension
  • Chrome MV3 production build
  • bun run smoke:extension: service worker, content script, and popup passed in isolated headless Chromium
  • bun run perf:extension:startup -- --extension main:<build> --extension pr:<build> --runs 15 --validate-ui pr
  • final diff review: no high-confidence regressions or project-instruction violations found

Open-PR overlap was checked again before push. PR #400 also touches the Shadow DOM helper and historical overlay for dark mode, but it does not duplicate this loading-boundary change; no other open PR targets content-script startup.

No screenshots: visible UI behavior is unchanged. No extension/PENDING.md entry: this is internal performance work rather than a user-facing workflow change. No package docs, starter templates, or changeset are needed because published package APIs are unchanged.

@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Aug 26, 2026

Copy link
Copy Markdown

Deploying we-were-online-website with  Cloudflare Pages  Cloudflare Pages

Latest commit: 59951aa
Status: ✅  Deploy successful!
Preview URL: https://fcd71be5.we-were-online-website.pages.dev
Branch Preview URL: https://cx-lazy-content-ui.we-were-online-website.pages.dev

View logs

@pkg-pr-new

pkg-pr-new Bot commented Aug 26, 2026

Copy link
Copy Markdown

Open in StackBlitz

bun add https://pkg.pr.new/@playhtml/common@422
bun add https://pkg.pr.new/playhtml@422
bun add https://pkg.pr.new/@playhtml/react@422

commit: 59951aa

@spencerc99

Copy link
Copy Markdown
Owner Author

Code review

No issues found. Checked for bugs and project-instruction compliance.

@cloudflare-workers-and-pages

Copy link
Copy Markdown

Deploying playhtml with  Cloudflare Pages  Cloudflare Pages

Latest commit: 59951aa
Status: ✅  Deploy successful!
Preview URL: https://57d0d689.playhtml.pages.dev
Branch Preview URL: https://cx-lazy-content-ui.playhtml.pages.dev

View logs

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.

1 participant