feat(website): split benchmark charts into public/benchmark/{svg,png} with PNG export#307
Merged
Merged
Conversation
… with PNG export Benchmark charts previously landed flat in public/benchmark as SVGs only. Now build/graph-benchmark-svg.cjs writes SVGs to public/benchmark/svg and, with --png, exports a 2x PNG sibling per chart to public/benchmark/png via headless Chrome/Edge (svg-to-png.cjs is now reusable as a module). PNG export needs a browser and launches one per chart, so it runs at `pnpm build` (new build:benchmark:png step in prebuild), not `pnpm prepare`; prepare stays SVG-only and fast. Both steps re-render only charts whose SVG content changed or whose PNG is missing, and create the output folders when absent. findBrowser honors CHROME_BIN/EDGE_BIN and knows the Linux/macOS binary paths so website.yml (ubuntu-latest) keeps working. Chart references in the launch post and @ttsc/graph README follow the new /benchmark/svg/ URLs. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
The codegraph and codebase-memory-mcp working clones were checked in as gitlinks for comparator research; that research is done and the clones no longer belong in the website tree. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
…ss Chrome Chrome launched one process per chart (3-5 min for a full 90-chart render) and made PNG export depend on a browser binary being installed. resvg (@resvg/resvg-js, prebuilt native bindings) rasterizes in-process: the same full render now takes ~37s and works on any machine or runner without a browser. The dev.to re-export CLI keeps its interface; findBrowser and the HTML-wrapper screenshot path are gone. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Owner
Author
|
Two follow-up commits:
|
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub.
|
Contributor
There was a problem hiding this comment.
Pull request overview
This PR restructures the website’s generated benchmark chart assets by separating SVG and PNG outputs into dedicated subfolders and adding an automated PNG export path so charts can be embedded in places that don’t accept SVG.
Changes:
- Update benchmark chart generation to write SVGs to
public/benchmark/svg/and (optionally) export 2x PNG siblings topublic/benchmark/png/. - Refactor
svg-to-png.cjsinto a reusable module (renderPng,findBrowser) while keeping CLI behavior. - Update documentation/content links and gitignore rules to match the new chart URLs and generated folders.
Reviewed changes
Copilot reviewed 8 out of 9 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| website/src/content/blog/i-made-ts-compiler-graph-mcp.mdx | Updates embedded chart URLs to the new /benchmark/svg/ path. |
| website/package.json | Adds a build:benchmark:png step and runs it during prebuild. |
| website/build/svg-to-png.cjs | Refactors PNG rendering into reusable exports and expands browser discovery for CI/local. |
| website/build/graph-benchmark-svg.cjs | Writes charts into public/benchmark/svg/ and optionally exports PNGs to public/benchmark/png/ with incremental skipping. |
| website/.gitignore | Ignores the generated public/benchmark/svg/ and public/benchmark/png/ folders. |
| packages/graph/README.md | Updates benchmark chart URL to the new /benchmark/svg/ location. |
Files not reviewed (1)
- pnpm-lock.yaml: Generated file
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| if (changed) fs.writeFileSync(file, content); | ||
| const pngFile = path.join(PNG_DIR, name.replace(/\.svg$/, ".png")); | ||
| if (changed || !fs.existsSync(pngFile)) pngQueue.push(file); | ||
| written += 1; |
Comment on lines
+149
to
+151
| throw new Error( | ||
| "[build:graph-svg] --png needs a headless Chrome or Edge, and none was found", | ||
| ); |
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.
Intent
Move the generated benchmark charts out of the flat
website/public/benchmark/root into dedicatedpublic/benchmark/svg/andpublic/benchmark/png/folders, and publish a PNG sibling for every SVG chart so embeds that reject SVG (dev.to, social cards) can point at ttsc.dev directly.Scope
website/build/graph-benchmark-svg.cjswrites SVGs topublic/benchmark/svg/and, with--png, exports a 2x PNG per chart topublic/benchmark/png/. Both folders are created when absent, and only charts whose SVG content changed (or whose PNG is missing) re-render.pnpm build(newbuild:benchmark:pngstep inprebuild), notpnpm prepare;preparestays SVG-only (~1.4s when nothing changed).website/build/svg-to-png.cjsbecomes a reusable module (renderPng,findBrowser) while keeping its dev.to re-export CLI.findBrowserhonorsCHROME_BIN/EDGE_BINand knows the Linux/macOS binary paths, so thewebsite.ymlbuild on ubuntu-latest keeps working with the runner's preinstalled Chrome. With--pnga missing browser fails the build instead of silently shipping without PNGs.packages/graph/README.md.website/.gitignoreswaps the oldpublic/benchmark/graph-*.svgpattern for the two generated folders.Deferred
Test plan
pnpm run build:benchmark:graph: folders auto-created, 90 SVGs written, no PNG work.pnpm run build:benchmark:pngafter deleting 2 PNGs: only those 2 re-rendered (dimension-verified 2x via the script's IHDR check), 90/90 pairs present.prepare-mode run on unchangedgraph.json: 1.4s, zero re-renders.website.ymlPR build below exercises the--pngpath on ubuntu-latest.🤖 Generated with Claude Code