perf: cut cold-start download 58% and startup heap 22% via measured chunk-graph fixes (#2742)
* fix(ui): update session-switch-resync test to current handleEvent/setSessionTodos signatures
Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>
* perf(build): split Shiki grammars/themes, CodeMirror legacy modes, and @pierre/diffs into on-demand chunks
Merging @shikijs/langs into one manual vendor chunk made the first language
request download every grammar (7.4 MB raw / 1 MB gzip). Letting Rollup split
these packages per dynamically imported module downloads only the languages,
themes, and modes actually used — matching how the worker build already
behaves. @pierre/diffs is split the same way so its pure patch parser (used by
the eager tool renderer) no longer drags the Shiki-importing render stack into
the startup graph.
Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>
* perf(ui): restore lazy heavy views and stop eager settings-graph loading
- MainLayout: DiffView/FilesView/GitView/PlanView return to lazyWithChunkRecovery
(they were silently made static in 2031e3b4 while their Suspense wrappers
remained), keeping the CodeMirror and @pierre/diffs stacks out of startup.
- ContextPanel: same lazy treatment for its Diff/Files/Git/Plan/Walkthrough
tabs, with null Suspense fallbacks.
- CommandPalette imported getSettingsNavIcon from SettingsView, statically
pulling the entire settings surface (SkillsPage -> CodeMirrorEditor -> vim
mode, theme registry -> @pierre/diffs) into the eager graph; the helper now
lives in lib/settings/metadata.
- The windowed SettingsWindow mounts only after its first open: rendering the
lazy component closed made React fetch the SettingsView chunk graph at
startup.
Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>
* perf(ui): keep @pierre/diffs + Shiki out of the eager chat graph and defer diff worker warmup
- DiffWorkerProvider no longer statically imports @pierre/diffs/worker or the
theme registry, and no longer spawns 3 workers plus a main-thread shared
highlighter during mount. Pools are created on demand through a dynamic
module load, warmed via requestIdleCallback after startup settles, and
useWorkerPool notifies consumers when a pool becomes available.
- ToolPart's rich diff preview moves to lazily loaded ToolPartDiffPreview;
the plain-text patch (PlainDiffFallback) renders while the chunk loads,
mirroring the existing error fallback. Theme registration happens during
render inside the lazy module so PatchDiff never renders unregistered ids.
- ChatInput mounts its lazy ToolOutputDialog only after the first attachment
preview opens instead of fetching the dialog chunk on the draft screen.
- getMarkdownSyntaxVars moves to a pierre-free markdownSyntaxVars module so
eager code-rendering consumers stop importing the registration module.
Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>
* perf(web): load ghostty-web and Nerd Fonts on first terminal use
- ghostty-web (638 KB raw JS + WASM VT) is dynamically imported when a
terminal actually mounts; TerminalView stays eagerly importable for the
bottom dock.
- The ~2 MB of CDN Nerd Fonts are no longer preloaded and force-loaded on
every cold start. index.html exposes an idempotent
__openchamberEnsureNerdFonts hook; TerminalViewport requests it on mount
and waits up to 2s so a cached font is in place before the glyph atlas is
built, while a cold CDN fetch never blocks the terminal. Runtimes without
the hook (VS Code, mobile) resolve immediately, matching their existing
fallback-font behavior.
Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>
---------
Co-authored-by: Serhii Dziupin <makeittech@users.noreply.github.com>
This commit is contained in:
committed by
GitHub
co-authored by
Serhii Dziupin
parent
da3d467f82
commit
bc380e6e1b
+29
-25
@@ -15,12 +15,6 @@
|
||||
<link rel="apple-touch-icon" sizes="167x167" href="/apple-touch-icon-167x167.png" />
|
||||
<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png" />
|
||||
|
||||
<!-- Preload Nerd Fonts for terminal icon display -->
|
||||
<link rel="preload" href="https://cdn.jsdelivr.net/gh/mshaugh/nerdfont-webfonts@v3.3.0/build/fonts/JetBrainsMonoNerdFont-Regular.woff2"
|
||||
as="font" type="font/woff2" crossorigin="anonymous">
|
||||
<link rel="preload" href="https://cdn.jsdelivr.net/gh/mshaugh/nerdfont-webfonts@v3.3.0/build/fonts/FiraCodeNerdFont-Regular.woff2"
|
||||
as="font" type="font/woff2" crossorigin="anonymous">
|
||||
|
||||
<!-- Web app manifest (endpoint-first with data URL fallback) -->
|
||||
<script>
|
||||
const baseUrl = location.origin;
|
||||
@@ -599,31 +593,41 @@
|
||||
}, 10000);
|
||||
</script>
|
||||
|
||||
<!-- CSS Font Loading API for reliable Nerd Font loading -->
|
||||
<!-- CSS Font Loading API for reliable Nerd Font loading. The ~2 MB of
|
||||
Nerd Fonts are only used by the terminal viewport, so they are no
|
||||
longer downloaded on every cold start: the terminal requests them on
|
||||
first mount through this idempotent hook. -->
|
||||
<script>
|
||||
(function() {
|
||||
const fonts = [
|
||||
{
|
||||
name: 'JetBrainsMono Nerd Font',
|
||||
url: 'https://cdn.jsdelivr.net/gh/mshaugh/nerdfont-webfonts@v3.3.0/build/fonts/JetBrainsMonoNerdFont-Regular.woff2'
|
||||
},
|
||||
{
|
||||
name: 'FiraCode Nerd Font',
|
||||
url: 'https://cdn.jsdelivr.net/gh/mshaugh/nerdfont-webfonts@v3.3.0/build/fonts/FiraCodeNerdFont-Regular.woff2'
|
||||
let nerdFontsPromise = null;
|
||||
window.__openchamberEnsureNerdFonts = function() {
|
||||
if (nerdFontsPromise) {
|
||||
return nerdFontsPromise;
|
||||
}
|
||||
];
|
||||
const fonts = [
|
||||
{
|
||||
name: 'JetBrainsMono Nerd Font',
|
||||
url: 'https://cdn.jsdelivr.net/gh/mshaugh/nerdfont-webfonts@v3.3.0/build/fonts/JetBrainsMonoNerdFont-Regular.woff2'
|
||||
},
|
||||
{
|
||||
name: 'FiraCode Nerd Font',
|
||||
url: 'https://cdn.jsdelivr.net/gh/mshaugh/nerdfont-webfonts@v3.3.0/build/fonts/FiraCodeNerdFont-Regular.woff2'
|
||||
}
|
||||
];
|
||||
|
||||
const fontPromises = fonts.map(font => {
|
||||
const fontFace = new FontFace(font.name, `url(${font.url}) format('woff2')`);
|
||||
document.fonts.add(fontFace);
|
||||
return fontFace.load().catch(err => {
|
||||
console.warn(`Failed to load font: ${font.name}`, err);
|
||||
const fontPromises = fonts.map(font => {
|
||||
const fontFace = new FontFace(font.name, `url(${font.url}) format('woff2')`);
|
||||
document.fonts.add(fontFace);
|
||||
return fontFace.load().catch(err => {
|
||||
console.warn(`Failed to load font: ${font.name}`, err);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
Promise.allSettled(fontPromises).then(() => {
|
||||
document.documentElement.classList.add('fonts-loaded');
|
||||
});
|
||||
nerdFontsPromise = Promise.allSettled(fontPromises).then(() => {
|
||||
document.documentElement.classList.add('fonts-loaded');
|
||||
});
|
||||
return nerdFontsPromise;
|
||||
};
|
||||
})();
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user