Skip to content

chore: preload fonts - #1018

Open
avivkeller wants to merge 2 commits into
mainfrom
preload-fonts
Open

chore: preload fonts#1018
avivkeller wants to merge 2 commits into
mainfrom
preload-fonts

Conversation

@avivkeller

Copy link
Copy Markdown
Member

@avivkeller
avivkeller requested a review from a team as a code owner August 9, 2026 21:45
@vercel

vercel Bot commented Aug 9, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
api-docs-tooling Ready Ready Preview Aug 9, 2026 9:47pm

Request Review

Comment thread packages/react/src/html/bundlers/vite.mjs Outdated
Co-authored-by: Aviv Keller <me@aviv.sh>
@codecov

codecov Bot commented Aug 9, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 89.42%. Comparing base (cffd211) to head (7dace16).
⚠️ Report is 2 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff             @@
##             main    #1018      +/-   ##
==========================================
+ Coverage   89.38%   89.42%   +0.04%     
==========================================
  Files         203      203              
  Lines       18763    18844      +81     
  Branches     1749     1759      +10     
==========================================
+ Hits        16771    16851      +80     
- Misses       1985     1986       +1     
  Partials        7        7              

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@github-actions

github-actions Bot commented Aug 9, 2026

Copy link
Copy Markdown
Contributor

api-links Generator

Output: 1 file differs

apilinks.json
Expected values to be strictly deep-equal:
+ actual - expected
... Skipped lines

  {
    'Agent.defaultMaxSockets': 'https://github.com/{repository}/blob/HEAD/lib/_http_agent.js#L293',
    'Buffer.alloc': 'https://github.com/{repository}/blob/HEAD/lib/buffer.js#L450',
    'Buffer.allocUnsafe': 'https://github.com/{repository}/blob/HEAD/lib/buffer.js#L469',
    'Buffer.allocUnsafeSlow': 'https://github.com/{repository}/blob/HEAD/lib/buffer.js#L492',
...
    'agent.addRequest': 'https://github.com/{repository}/blob/HEAD/lib/_http_agent.js#L358',
+   'agent.createConnection': 'https://github.com/{repository}/blob/HEAD/lib/https.js#L332',
-   'agent.createConnection': 'https://github.com/{repository}/blob/HEAD/lib/_http_agent.js#L297',
    'agent.createSocket': 'https://github.com/{repository}/blob/HEAD/lib/_http_agent.js#L439',
    'agent.destroy': 'https://github.com/{repository}/blob/HEAD/lib/_http_agent.js#L672',
+   'agent.getName': 'https://github.com/{repository}/blob/HEAD/lib/https.js#L515',
+   'agent.keepSocketAlive': 'https://github.com/{repository}/blob/HEAD/lib/https.js#L484',
-   'agent.getName': 'https://github.com/{repository}/blob/HEAD/lib/_http_agent.js#L327',
-   'agent.keepSocketAlive': 'https://github.com/{repository}/blob/HEAD/lib/_http_agent.js#L628',
    'agent.removeSocket': 'https://github.com/{repository}/blob/HEAD/lib/_http_agent.js#L567',
    'agent.reuseSocket': 'https://github.com/{repository}/blob/HEAD/lib/_http_agent.js#L664',
    'assert.assert': 'https://github.com/{repository}/blob/HEAD/lib/assert.js#L185',
    'asyncResource.asyncId': 'https://github.com/{repository}/blob/HEAD/lib/async_hooks.js#L243',
    'asyncResource.bind': 'https://github.com/{repository}/blob/HEAD/lib/async_hooks.js#L275',
...
    'server.address': 'https://github.com/{repository}/blob/HEAD/lib/net.js#L2699',
+   'server.close': 'https://github.com/{repository}/blob/HEAD/lib/net.js#L2832',
+   'server.closeAllConnections': 'https://github.com/{repository}/blob/HEAD/lib/https.js#L124',
+   'server.closeIdleConnections': 'https://github.com/{repository}/blob/HEAD/lib/https.js#L126',
-   'server.close': 'https://github.com/{repository}/blob/HEAD/lib/_http_server.js#L681',
-   'server.closeAllConnections': 'https://github.com/{repository}/blob/HEAD/lib/_http_server.js#L691',
-   'server.closeIdleConnections': 'https://github.com/{repository}/blob/HEAD/lib/_http_server.js#L703',
    'server.getConnections': 'https://github.com/{repository}/blob/HEAD/lib/net.js#L2794',
    'server.listen': 'https://github.com/{repository}/blob/HEAD/lib/net.js#L2496',
    'server.ref': 'https://github.com/{repository}/blob/HEAD/lib/net.js#L2945',
+   'server.setTimeout': 'https://github.com/{repository}/blob/HEAD/lib/https.js#L128',
-   'server.setTimeout': 'https://github.com/{repository}/blob/HEAD/lib/_http_server.js#L719',
    'server.unref': 'https://github.com/{repository}/blob/HEAD/lib/net.js#L2954',
+   'server[SymbolAsyncDispose]': 'https://github.com/{repository}/blob/HEAD/lib/net.js#L2872',
-   'server[SymbolAsyncDispose]': 'https://github.com/{repository}/blob/HEAD/lib/_http_server.js#L687',
    'server[SymbolAsyncIterator]': 'https://github.com/{repository}/blob/HEAD/lib/net.js#L2879',
    'server[kDeserialize]': 'https://github.com/{repository}/blob/HEAD/lib/net.js#L2419',
    'server[kTransferList]': 'https://github.com/{repository}/blob/HEAD/lib/net.js#L2392',
    'server[kTransfer]': 'https://github.com/{repository}/blob/HEAD/lib/net.js#L2397',
+   'server[undefined]': 'https://github.com/{repository}/blob/HEAD/lib/net.js#L2909',
-   'server[undefined]': 'https://github.com/{repository}/blob/HEAD/lib/_http_server.js#L726',
    'serverresponse._finish': 'https://github.com/{repository}/blob/HEAD/lib/_http_server.js#L254',
    'serverresponse._implicitHeader': 'https://github.com/{repository}/blob/HEAD/lib/_http_server.js#L411',
    'serverresponse.assignSocket': 'https://github.com/{repository}/blob/HEAD/lib/_http_server.js#L304',
    'serverresponse.detachSocket': 'https://github.com/{repository}/blob/HEAD/lib/_http_server.js#L315',
    'serverresponse.statusCode': 'https://github.com/{repository}/blob/HEAD/lib/_http_server.js#L277',

Performance estimate (single CI run)

  • Generation time: 7.8% slower (1.28 s → 1.38 s)
  • Peak memory: 0.7% lower (356.21 MB → 353.72 MB)

legacy-html Generator

Performance estimate (single CI run)

  • Generation time: 34.2% slower (15.16 s → 20.34 s)
  • Peak memory: 0.7% higher (2.10 GB → 2.12 GB)

legacy-json Generator

Performance estimate (single CI run)

  • Generation time: 29.3% faster (7.51 s → 5.31 s)
  • Peak memory: 6.7% higher (1.63 GB → 1.74 GB)

orama-db Generator

Output size: 1 file changed · net -1.10 KB

File size details
File Main PR Change
orama-db.json 9.07 MB 9.07 MB -1.10 KB (-0.0%)

Performance estimate (single CI run)

  • Generation time: 16.0% faster (8.54 s → 7.17 s)
  • Peak memory: 8.0% higher (1.63 GB → 1.76 GB)

web Generator

Output size: 107 files changed · net -570.72 KB

File size details
File Main PR Change
assets/style-BnDdbq9g.css 147.50 KB -147.50 KB (-100.0%)
assets/style-dXlSM6ts.css 137.08 KB +137.08 KB
assets/open-sans-math-wght-italic-fnaShVx0.woff2 55.20 KB -55.20 KB (-100.0%)
assets/open-sans-cyrillic-ext-wght-italic-C5caDWkv.woff2 53.66 KB -53.66 KB (-100.0%)
assets/open-sans-math-wght-normal-C1FvUlkR.woff2 50.70 KB -50.70 KB (-100.0%)
assets/open-sans-latin-wght-italic-Bf1Hxpwk.woff2 49.04 KB -49.04 KB (-100.0%)
assets/fonts/open-sans-latin-wght-italic.woff2 49.04 KB +49.04 KB
assets/open-sans-cyrillic-ext-wght-normal-D8xHCTEw.woff2 48.11 KB -48.11 KB (-100.0%)
assets/open-sans-latin-wght-normal-CWNzRldh.woff2 47.19 KB -47.19 KB (-100.0%)
assets/fonts/open-sans-latin-wght-normal.woff2 47.19 KB +47.19 KB
assets/open-sans-latin-ext-wght-italic-CT8UZlj2.woff2 36.87 KB -36.87 KB (-100.0%)
assets/open-sans-latin-ext-wght-normal-DPNHYqvY.woff2 34.33 KB -34.33 KB (-100.0%)
assets/open-sans-cyrillic-wght-italic-BHGTCMtU.woff2 31.27 KB -31.27 KB (-100.0%)
assets/open-sans-symbols-wght-normal-BAf6-sld.woff2 25.97 KB -25.97 KB (-100.0%)
assets/open-sans-cyrillic-wght-normal-bOs07Rf4.woff2 25.96 KB -25.96 KB (-100.0%)
assets/open-sans-symbols-wght-italic-BIea8-3l.woff2 25.75 KB -25.75 KB (-100.0%)
assets/open-sans-greek-wght-italic-Dymqxqgx.woff2 22.38 KB -22.38 KB (-100.0%)
assets/open-sans-greek-wght-normal-8neIfJ3r.woff2 20.83 KB -20.83 KB (-100.0%)
assets/open-sans-hebrew-wght-italic-CN0_AmM6.woff2 17.46 KB -17.46 KB (-100.0%)
assets/open-sans-vietnamese-wght-italic-CLM9MVT0.woff2 16.81 KB -16.81 KB (-100.0%)
assets/open-sans-hebrew-wght-normal-BjjtG49P.woff2 16.52 KB -16.52 KB (-100.0%)
assets/open-sans-vietnamese-wght-normal-UygKeDyW.woff2 16.11 KB -16.11 KB (-100.0%)
assets/ibm-plex-mono-latin-400-normal-DMJ8VG8y.woff2 14.36 KB -14.36 KB (-100.0%)
assets/fonts/ibm-plex-mono-latin-400-normal.woff2 14.36 KB +14.36 KB
assets/ibm-plex-mono-latin-ext-400-normal-BmRBH3aV.woff2 13.04 KB -13.04 KB (-100.0%)
assets/ibm-plex-mono-latin-400-normal-CvHOgSBP.woff 12.84 KB -12.84 KB (-100.0%)
assets/ibm-plex-mono-latin-ext-400-normal-D3D2R8hC.woff 11.49 KB -11.49 KB (-100.0%)
assets/ibm-plex-mono-cyrillic-400-normal-BSMlKf0J.woff2 8.16 KB -8.16 KB (-100.0%)
assets/ibm-plex-mono-cyrillic-400-normal-CEL4l2ZJ.woff 7.04 KB -7.04 KB (-100.0%)
assets/ibm-plex-mono-cyrillic-ext-400-normal-xuaO2J-f.woff2 6.75 KB -6.75 KB (-100.0%)
assets/ibm-plex-mono-vietnamese-400-normal-BulugwFq.woff2 5.73 KB -5.73 KB (-100.0%)
assets/ibm-plex-mono-cyrillic-ext-400-normal-DMdlQ8Kv.woff 5.68 KB -5.68 KB (-100.0%)
assets/ibm-plex-mono-vietnamese-400-normal-DDuiU_S-.woff 5.49 KB -5.49 KB (-100.0%)
assets/open-sans-greek-ext-wght-italic-ZJN3QSAr.woff2 4.73 KB -4.73 KB (-100.0%)
assets/open-sans-greek-ext-wght-normal-Bm9CHu9r.woff2 4.40 KB -4.40 KB (-100.0%)
addons.html 379.09 KB 379.41 KB +327.00 B (+0.1%)
assert.html 646.89 KB 647.21 KB +327.00 B (+0.0%)
async_context.html 317.11 KB 317.43 KB +327.00 B (+0.1%)
async_hooks.html 283.18 KB 283.50 KB +327.00 B (+0.1%)
buffer.html 1.71 MB 1.71 MB +327.00 B (+0.0%)
child_process.html 665.40 KB 665.72 KB +327.00 B (+0.0%)
cli.html 575.64 KB 575.96 KB +327.00 B (+0.1%)
cluster.html 301.12 KB 301.44 KB +327.00 B (+0.1%)
console.html 183.88 KB 184.20 KB +327.00 B (+0.2%)
crypto.html 1.86 MB 1.86 MB +327.00 B (+0.0%)
debugger.html 142.74 KB 143.06 KB +327.00 B (+0.2%)
deprecations.html 533.61 KB 533.93 KB +327.00 B (+0.1%)
dgram.html 297.66 KB 297.98 KB +327.00 B (+0.1%)
diagnostics_channel.html 512.11 KB 512.43 KB +327.00 B (+0.1%)
dns.html 417.50 KB 417.82 KB +327.00 B (+0.1%)
documentation.html 28.50 KB 28.82 KB +327.00 B (+1.1%)
domain.html 125.99 KB 126.30 KB +327.00 B (+0.3%)
dtls.html 175.12 KB 175.44 KB +327.00 B (+0.2%)
embedding.html 59.66 KB 59.97 KB +327.00 B (+0.5%)
environment_variables.html 37.64 KB 37.96 KB +327.00 B (+0.8%)
errors.html 516.83 KB 517.15 KB +327.00 B (+0.1%)
esm.html 185.84 KB 186.16 KB +327.00 B (+0.2%)
events.html 830.20 KB 830.52 KB +327.00 B (+0.0%)
ffi.html 177.67 KB 177.99 KB +327.00 B (+0.2%)
fs.html 2.13 MB 2.13 MB +327.00 B (+0.0%)
globals.html 261.35 KB 261.67 KB +327.00 B (+0.1%)
http.html 1.09 MB 1.09 MB +327.00 B (+0.0%)
http2.html 1.23 MB 1.23 MB +327.00 B (+0.0%)
https.html 239.20 KB 239.52 KB +327.00 B (+0.1%)
inspector.html 212.45 KB 212.77 KB +327.00 B (+0.2%)
intl.html 56.36 KB 56.68 KB +327.00 B (+0.6%)
module.html 505.10 KB 505.42 KB +327.00 B (+0.1%)
modules.html 226.61 KB 226.93 KB +327.00 B (+0.1%)
n-api.html 1023.76 KB 1.00 MB +327.00 B (+0.0%)
net.html 623.23 KB 623.55 KB +327.00 B (+0.1%)
os.html 163.86 KB 164.18 KB +327.00 B (+0.2%)
packages.html 217.64 KB 217.96 KB +327.00 B (+0.1%)
path.html 176.15 KB 176.47 KB +327.00 B (+0.2%)
perf_hooks.html 587.45 KB 587.77 KB +327.00 B (+0.1%)
permissions.html 75.05 KB 75.37 KB +327.00 B (+0.4%)
process.html 1.14 MB 1.14 MB +327.00 B (+0.0%)
punycode.html 64.65 KB 64.97 KB +327.00 B (+0.5%)
querystring.html 66.59 KB 66.91 KB +327.00 B (+0.5%)
quic.html 903.96 KB 904.28 KB +327.00 B (+0.0%)
readline.html 360.94 KB 361.26 KB +327.00 B (+0.1%)
repl.html 300.49 KB 300.81 KB +327.00 B (+0.1%)
report.html 230.81 KB 231.13 KB +327.00 B (+0.1%)
single-executable-applications.html 132.43 KB 132.75 KB +327.00 B (+0.2%)
sqlite.html 457.43 KB 457.75 KB +327.00 B (+0.1%)
stream.html 1.21 MB 1.21 MB +327.00 B (+0.0%)
stream_iter.html 722.50 KB 722.82 KB +327.00 B (+0.0%)
string_decoder.html 65.98 KB 66.30 KB +327.00 B (+0.5%)
synopsis.html 38.47 KB 38.79 KB +327.00 B (+0.8%)
test.html 1.34 MB 1.34 MB +327.00 B (+0.0%)
timers.html 181.74 KB 182.06 KB +327.00 B (+0.2%)
tls.html 510.31 KB 510.63 KB +327.00 B (+0.1%)
tracing.html 125.90 KB 126.22 KB +327.00 B (+0.3%)
tty.html 102.62 KB 102.94 KB +327.00 B (+0.3%)
typescript.html 50.06 KB 50.38 KB +327.00 B (+0.6%)
url.html 509.18 KB 509.50 KB +327.00 B (+0.1%)
util.html 1.15 MB 1.15 MB +327.00 B (+0.0%)
v8.html 543.46 KB 543.78 KB +327.00 B (+0.1%)
vfs.html 89.93 KB 90.25 KB +327.00 B (+0.4%)
vm.html 629.24 KB 629.56 KB +327.00 B (+0.1%)
wasi.html 79.97 KB 80.29 KB +327.00 B (+0.4%)
webcrypto.html 623.96 KB 624.28 KB +327.00 B (+0.1%)
webstreams.html 531.62 KB 531.94 KB +327.00 B (+0.1%)
worker_threads.html 630.22 KB 630.54 KB +327.00 B (+0.1%)
zlib.html 939.27 KB 939.59 KB +327.00 B (+0.0%)
404.html 21.85 KB 22.16 KB +324.00 B (+1.4%)
all.html 31.54 MB 31.54 MB +324.00 B (+0.0%)
index.html 32.43 KB 32.75 KB +324.00 B (+1.0%)

Performance estimate (single CI run)

  • Generation time: 0.6% faster (86.78 s → 86.25 s)
  • Peak memory: 1.3% lower (4.74 GB → 4.68 GB)

/**
* Determine the asset names for different files
*/
assetFileNames: asset =>

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

just ooc: how Next.js preloads fonts?

/**
* Fonts to preload
*/
export const FONTS = [

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Can we avoid doing static lists? Maybe a function that we define per font we need that creates the css block and the import and the loading like Next.ja?

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

If we do it that way, it's slower, since we need to minify the dynamically created HTML. This way we can do one minification pass

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Why it would be slower? 🤔

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

I mean, maybe you're not visualizing the idea:

const [codeToAddToHead, fontFamilySnippet] = generateFontSnippet('open-sans-latin-wght-italic', ['woff']);

fgirst argument being the font name, 2nd being the supported formats.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

I mean, maybe you're not visualizing the idea:

const [codeToAddToHead, fontFamilySnippet] = generateFontSnippet('open-sans-latin-wght-italic', ['woff']);

fgirst argument being the font name, 2nd being the supported formats.

Each font has a different snippet, so that's not an option

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Yes, each font has a different snippet. So you append instead of https://github.com/nodejs/doc-kit/pull/1018/changes#diff-71b846ed4741eff9604ce9e99abc324eb6dafbb8724dc337f6eefde00dae282aR10

Youll have

${fontOnePreload}
${fontTwoPreload}

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

This is genuinely what Next.js does, annd makes maintainability much easier/reduces hard-coded pieces.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

I don't want to do it like that. I'd prefer a preloads section with a hardcoded font list so that the bundler can decide how it does prelaods.

Doing ${preloadA} ${preloadB} makes the template not very overrideable, should we add or remove fonts

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

I feel we're at an impass 😅 -- I feel we should avoid hard-coded list of fonts and allow this to be customizable/used by the end-user rather than the way it is lied out currently.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

btw we need to reach consensus before RenderATL 🙈

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