Repository navigation
feat(app): experiment with Pierre Highlights for code - #57906
Closed
kitlangton wants to merge 3 commits into
Closed
kitlangton wants to merge 3 commits into
kitlangton wants to merge 3 commits into
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Experiment, not for merge as-is. Adds Knobs → Experiments → Code highlighter: Shiki / Highlights (Shiki stays the default) to try Pierre's
@pierre/highlightsWebAssembly highlighter in two places:@pierre/diffsgainspreferredHighlighter: "highlights"only in 1.6.x, so the catalog moves 1.5.1 → 1.6.1. The worker pool is keyed by highlighter, so flipping the knob moves open diffs to a new pool.OpenCodeis registered as a Zed theme too, mapping Highlights' token categories onto the same--syntax-*variables, so light and dark keep working.LiveTokenizer. Each delta is one append edit, so only the growing last line and new lines are re-lexed, and lexer state carries across chunks. Completed blocks usecodeToTokens, and full parses build Shiki-shaped HTML. Languages Highlights has no lexer for still use Shiki.markdown.tsxis untouched; the only protocol change is an optionalhighlighterfield onparseandhighlightrequests.Other changes:
@pierre/highlightsis added tominimumReleaseAgeExcludesnext to@pierre/diffs(0.2.0 is a day old). The storybook-onlymarked.tsxis updated for 1.6'sDiffsHighlighterAPI.Numbers
Headless Chromium, mock-server app, production build, through HiveMind (
e2e/performance/highlighter/). The workers were heavily loaded, so main-thread numbers vary a lot between runs. Worker numbers were consistent.Streaming a code-heavy reply (24 blocks in TS, TSX, Python, Go, CSS, JSON, shell and diff; 17.5 KB in 366 deltas; 2–3 runs each)
The main-thread cost the jank report measured (code-token rebuilds in
markdown.tsx) is DOM work, which this worker swap does not change.Opening a 481 KB, 16,960-line TypeScript diff in the review panel: Highlights painted highlighted rows 11.2 s after opening the Review tab (one 4.4 s worker task, plus a 3.8 s main-thread task to render). Shiki had painted no highlighted rows after 90 s (a longer rerun was cut off by the 30-minute HiveMind limit while the fleet was congested).
Bundle (
vite builddist, againstorigin/beta): +4.7 MB raw / +0.9 MB gzip, all in lazy chunks. The startup chunks are unchanged (markdown.worker+2 KB).@pierre/diffs1.6.1 bump (+174 lazy files).Correctness
The token text is identical. Colours differ, measured as the share of non-space characters with a different computed colour in the light theme (dark uses the same variables):
Session,Schema,RowandErrFullare purple, and method calls get the function colour. Shiki paints these as plain variables.property→--syntax-propertymakes CSS properties, Go fields,.idand#rowsorange, where Shiki uses the variable colour..and:get--syntax-punctuation(grey), where Shiki uses pink.+/-lines and the headers; Shiki colours only the markers.upsertbody teal. Highlights doesn't.Shiki (left) vs Highlights (right), light:
Dark:
Verification
bun typecheckpasses inpackages/ui,packages/session-uiandpackages/app(e2e: no new errors).markdown-highlights.test.tschecks that streamed chunks end with the same tokens as one-shot highlighting, and fails if the stable-line cursor is off by one. The markdown worker queue, transport and protocol tests and the motion-tuning tests pass.lint:changed: the changed files are clean.mobile-timeline-scroll.spec.ts:855). Build, unit and session-ui component jobs pass.Review fixes (55c7eae, 19d9744)
undefined, so no rejection stays cached, and the session deliberately does not retry, since a failed load would only fail again.onDemandAssetnow excludes thehighlights-*andmarkdown-highlights-*chunks, which carry the inlined Wasm, from the PWA precache, so they load only when Highlights is picked.oc://scheme like the app's. The desktop app sets no CSP.--syntax-punctuationinstead of the text colour.