Skip to content

fix: include deployment id in the webpack cache key - #1980

Draft
marcleblanc2 wants to merge 1 commit into
mainfrom
marc/fix/webpack-cache-deployment-id
Draft

marcleblanc2 wants to merge 1 commit into
mainfrom
marc/fix/webpack-cache-deployment-id

Conversation

@marcleblanc2

Copy link
Copy Markdown
Contributor

Problem

Every font downloads twice in production. The HTML preloads fonts with ?dpl=<current deploy>, but the CSS url()s carry the previous deployment's dpl, so the browser sees two URLs per font (verified live with curl on the CSS chunk vs the HTML).

Cause: next/font bakes Vercel's skew-protection ?dpl= into the CSS at build time via the deploymentId loader option, but Next's webpack filesystem cache key (webpack-config.js, the configVars blob) does not include deploymentId. Vercel restores .next/cache, so the cached CSS module is re-emitted with the old id.

Fix

A webpack() hook in next.config.js appends NEXT_DEPLOYMENT_ID to config.cache.version, so each deployment gets a fresh webpack cache.

Tradeoffs

  • The whole webpack cache is invalidated every deploy, so builds are cold each time (a few minutes on Vercel instead of ~2). Content changes dominate this repo, so it is probably fine, but it is a real cost.
  • Alternative with no code: turn off Vercel Skew Protection for this project. Then there is no dpl query at all. Worth considering since this is a static docs site.
  • The upstream fix is for Next to add deploymentId to configVars; happy to file that if wanted.

Verification

Reproduced and fixed locally with back-to-back builds on a warm .next/cache:

config build 1 build 2 CSS dpl after build 2 HTML dpl
this PR dpl_test123 dpl_test456 dpl_test456 dpl_test456
main dpl_test789 dpl_testABC dpl_test789 dpl_testABC

After the production deploy: curl -s https://sourcegraph.com/docs/_next/static/css/<hash>.css | grep -o 'dpl_\w*' | sort -u should match the dpl in the page HTML.

@vercel

vercel Bot commented Sep 17, 2026

Copy link
Copy Markdown

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

Project Deployment Actions Updated
sourcegraph-docs Ready Ready Preview Sep 17, 2026 2:34am UTC

Request Review

@github-actions

Copy link
Copy Markdown
Contributor

next/font bakes Vercel's ?dpl= skew-protection query into the CSS url()s
at build time, but Next's webpack cache key does not include the
deployment id. With the restored .next/cache the CSS keeps the previous
deployment's id while the HTML preloads use the new one, so every font
downloads twice.
@marcleblanc2

Copy link
Copy Markdown
Contributor Author

From the docs site audit (crawl of all 502 pages).

Crawl evidence for the double font download: on 403 of 502 pages every font was fetched twice (~110 KB wasted, preloads unused), because the CSS was served under one ?dpl= deployment id but referenced font files under an older one. The pattern disappeared for pages crawled after a mid-crawl deploy, which fits the stale-webpack-cache diagnosis here.

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