Skip to content

Fix Safari next/image error by excluding ?ts= cache-busting from script tags#92484

Open
lukesandberg wants to merge 2 commits intocanaryfrom
safari_next_image_hmr
Open

Fix Safari next/image error by excluding ?ts= cache-busting from script tags#92484
lukesandberg wants to merge 2 commits intocanaryfrom
safari_next_image_hmr

Conversation

@lukesandberg
Copy link
Copy Markdown
Contributor

What?

In Safari dev mode (Pages Router + Turbopack), statically imported images fail with:

Image with src "/_next/static/media/image.hash.png?ts=..." is using a query string which is not configured in images.localPatterns.

This introduces separate query string handling for script tags vs CSS/font tags in the Pages Router HTML rendering, so that the ?ts= Safari cache-busting parameter only appears on CSS and font resources — not on script tags.

Why?

The Pages Router adds ?ts=<timestamp> to all asset URLs in dev mode for Safari as a workaround for WebKit bug #187726 (Safari caches <link rel="preload"> resources forever, ignoring "Disable Cache" in DevTools).

The Turbopack browser runtime function getAssetSuffixFromScriptSrc() reads the query string from the currently-executing <script> tag and stores it as ASSET_SUFFIX. This suffix is then appended to all exported static asset URLs, including images. When next/image receives a src like /_next/static/media/image.hash.png?ts=12345, it fails validation against the default localPatterns config ({ pathname: '**', search: '' }).

The ?ts= param is only needed for CSS resources:

  • WebKit #187726 affects <link rel="preload"> caching, not script loading itself
  • Mozilla #1037506 (Firefox CSS forever-cache) is CSS-only
  • Turbopack's CSS HMR in dev-backend-dom.ts already adds its own per-HMR-event ?ts= for both Safari and Firefox independently

The original reason ?ts= was on <script> tags was to keep <link rel="preload" as="script"> URLs in sync with <script src> URLs (avoiding double downloads). By removing ?ts= from both the preload hints and the script tags, they still match.

How?

  • Added scriptAssetQueryString and scriptMutableAssetQueryString fields to HtmlProps (only contain ?dpl=<id> when applicable, never ?ts=)
  • Computed these in render.tsx alongside the existing assetQueryString / mutableAssetQueryString
  • Updated 6 locations in _document.tsx where script-related tags (<script>, <link rel="preload" as="script">) use the new scriptAssetQueryString
  • CSS (<link rel="stylesheet">, <link rel="preload" as="style">) and font (<link rel="preload" as="font">) tags continue using the original assetQueryString with ?ts=

Fixes #92118

…pt tags

In Safari dev mode, the Pages Router adds ?ts=<timestamp> to all asset URLs
as a workaround for WebKit preload caching (bugs.webkit.org/show_bug.cgi?id=187726).
The Turbopack runtime reads this query string from the script's src attribute
into ASSET_SUFFIX, which then leaks onto static asset URLs (images, fonts),
causing next/image localPatterns validation to reject them.

The ?ts= param is only needed for CSS resources (to bust Safari's preload cache
and Firefox's stylesheet cache). Script tags don't need it — the WebKit bug
affects <link rel="preload"> caching, not scripts themselves, and removing ?ts=
from both the preload hint and the script tag keeps their URLs in sync.

Introduce scriptAssetQueryString (containing only ?dpl= when applicable) and
use it for all script-related tags, while CSS and font tags continue using the
original assetQueryString with ?ts=.

Fixes #92118

Co-Authored-By: Claude <noreply@anthropic.com>
@nextjs-bot nextjs-bot added created-by: Turbopack team PRs by the Turbopack team. type: next labels Apr 7, 2026
@nextjs-bot
Copy link
Copy Markdown
Collaborator

nextjs-bot commented Apr 7, 2026

Failing test suites

Commit: 5f5623a | About building and testing Next.js

pnpm test-dev-turbo test/development/app-dir/instant-navs-devtools/instant-navs-devtools.test.ts (turbopack) (job)

  • instant-nav-panel > should show loading skeleton during SPA navigation after clicking Start (DD)
Expand output

● instant-nav-panel › should show loading skeleton during SPA navigation after clicking Start

expect(received).toBe(expected) // Object.is equality

Expected: true
Received: false

  164 |           '[data-testid="dynamic-skeleton"]'
  165 |         )
> 166 |         expect(skeleton).toBe(true)
      |                          ^
  167 |       },
  168 |       30000,
  169 |       500

  at toBe (development/app-dir/instant-navs-devtools/instant-navs-devtools.test.ts:166:26)
  at retry (lib/next-test-utils.ts:861:14)
  at Object.<anonymous> (development/app-dir/instant-navs-devtools/instant-navs-devtools.test.ts:161:5)

@nextjs-bot
Copy link
Copy Markdown
Collaborator

nextjs-bot commented Apr 7, 2026

Stats from current PR

✅ No significant changes detected

📊 All Metrics
📖 Metrics Glossary

Dev Server Metrics:

  • Listen = TCP port starts accepting connections
  • First Request = HTTP server returns successful response
  • Cold = Fresh build (no cache)
  • Warm = With cached build artifacts

Build Metrics:

  • Fresh = Clean build (no .next directory)
  • Cached = With existing .next directory

Change Thresholds:

  • Time: Changes < 50ms AND < 10%, OR < 2% are insignificant
  • Size: Changes < 1KB AND < 1% are insignificant
  • All other changes are flagged to catch regressions

⚡ Dev Server

Metric Canary PR Change Trend
Cold (Listen) 456ms 455ms ▁█▅▅▅
Cold (Ready in log) 442ms 440ms ▁▂▅▇▄
Cold (First Request) 1.122s 1.104s ▆▁▁▂▂
Warm (Listen) 456ms 456ms █▁██▁
Warm (Ready in log) 449ms 442ms ▂▂▇█▁
Warm (First Request) 347ms 338ms ▃▄▇█▄
📦 Dev Server (Webpack) (Legacy)

📦 Dev Server (Webpack)

Metric Canary PR Change Trend
Cold (Listen) 456ms 455ms ▁▁▅▁▅
Cold (Ready in log) 437ms 436ms ▁▃▆▂▂
Cold (First Request) 1.927s 1.929s ▇▇▇▆▁
Warm (Listen) 456ms 456ms ▁▁▁▁▁
Warm (Ready in log) 437ms 437ms ▁▂▅▁▂
Warm (First Request) 1.944s 1.945s ▆▇█▆▁

⚡ Production Builds

Metric Canary PR Change Trend
Fresh Build 3.820s 3.908s ▇▆██▁
Cached Build 3.839s 3.845s ▄███▄
📦 Production Builds (Webpack) (Legacy)

📦 Production Builds (Webpack)

Metric Canary PR Change Trend
Fresh Build 14.348s 14.329s ▁▂▅▂▂
Cached Build 14.477s 14.508s ▁▂▇▃▄
node_modules Size 488 MB 488 MB █████
📦 Bundle Sizes

Bundle Sizes

⚡ Turbopack

Client

Main Bundles
Canary PR Change
01zz1z_sccief.js gzip 155 B N/A -
02fkg8wfh0iju.js gzip 9.19 kB N/A -
030plil3tn3n7.js gzip 70.8 kB N/A -
050zwt5xh_0tx.js gzip 10.4 kB N/A -
087fzjd-gvlzv.js gzip 450 B N/A -
0cz1d0mv5g_q7.js gzip 39.4 kB 39.4 kB
0dsty6kq2hert.js gzip 155 B N/A -
0l26a3spazyyn.js gzip 151 B N/A -
0ppxcl_z43mad.js gzip 8.52 kB N/A -
0yzgvfimihkd2.js gzip 157 B N/A -
0ziljd71kuixt.js gzip 157 B N/A -
19oha6-znmkcv.js gzip 8.55 kB N/A -
1elt1qium-r2m.css gzip 115 B 115 B
1pciyc-0_znyg.js gzip 155 B N/A -
2_5rjb7lqxntf.js gzip 221 B 221 B
2035t1-zcnaw3.js gzip 65.7 kB N/A -
219prxwxgaalc.js gzip 7.61 kB N/A -
26elcgxnn9zjd.js gzip 8.52 kB N/A -
2900hudr6gvm0.js gzip 2.28 kB N/A -
29sfmxk0tawpd.js gzip 156 B N/A -
2lv2js3kmdeho.js gzip 8.48 kB N/A -
2myt_shpnyhzu.js gzip 156 B N/A -
2rehygrd36hqv.js gzip 8.58 kB N/A -
2s6nyomvmvh9r.js gzip 155 B N/A -
2srwswih0m9_h.js gzip 13.3 kB N/A -
2w-zjp8tyfrur.js gzip 159 B N/A -
3-jz00s4w-r6h.js gzip 13 kB N/A -
3-p9p9mheqhzx.js gzip 8.55 kB N/A -
31030bryqpolg.js gzip 8.53 kB N/A -
31dx5nmrzzuy7.js gzip 225 B N/A -
33sgz0bml7vgv.js gzip 155 B N/A -
3925v09gtu-5k.js gzip 49 kB N/A -
39x4zj5mjb4d_.js gzip 9.77 kB N/A -
3ii1q6weo9fxz.js gzip 162 B N/A -
3k-48b78ys_vy.js gzip 10.1 kB N/A -
3m7-5rfj0avoz.js gzip 12.9 kB N/A -
3uqce_6sa526g.js gzip 8.47 kB N/A -
3yurjqk-sjs3y.js gzip 1.46 kB N/A -
3z62yfdtiw-rc.js gzip 168 B N/A -
40ybjx9c192n0.js gzip 13.8 kB N/A -
421vzwdt9j1b_.js gzip 5.62 kB N/A -
turbopack-0a..gg-u.js gzip 4.19 kB N/A -
turbopack-0j..4h2c.js gzip 4.18 kB N/A -
turbopack-1b..7qjv.js gzip 4.18 kB N/A -
turbopack-1c..yhu3.js gzip 4.18 kB N/A -
turbopack-1d..d769.js gzip 4.18 kB N/A -
turbopack-1u..hrqd.js gzip 4.18 kB N/A -
turbopack-20..21vq.js gzip 4.17 kB N/A -
turbopack-21..e4ra.js gzip 4.18 kB N/A -
turbopack-2p..t2ge.js gzip 4.18 kB N/A -
turbopack-2s..og4f.js gzip 4.18 kB N/A -
turbopack-2t..h5wq.js gzip 4.18 kB N/A -
turbopack-2u..rcf4.js gzip 4.18 kB N/A -
turbopack-3e..1qn1.js gzip 4.18 kB N/A -
turbopack-3k..lhww.js gzip 4.16 kB N/A -
03dgzoo-qf3sm.js gzip N/A 9.19 kB -
05tx5f25dlivn.js gzip N/A 8.53 kB -
0c7ez6p2qc57f.js gzip N/A 5.62 kB -
0duvj3qk5pvgn.js gzip N/A 13.8 kB -
0h6hofq3h6-42.js gzip N/A 158 B -
0ir6-1duadm2z.js gzip N/A 158 B -
0lm29e2y9kx_b.js gzip N/A 153 B -
0m-34rm9w_wpm.js gzip N/A 7.6 kB -
0m21op30uewwb.js gzip N/A 156 B -
0qnwuk92m8i7o.js gzip N/A 10.4 kB -
0r4wrn6n0ue2m.js gzip N/A 8.55 kB -
0rp0fodtbt_6m.js gzip N/A 8.52 kB -
0sfck-km4dl1k.js gzip N/A 8.47 kB -
0x0xuhmxzwkp8.js gzip N/A 8.47 kB -
1_ziiz--jvfsp.js gzip N/A 158 B -
1-wdvgxnzicj7.js gzip N/A 1.46 kB -
11u6nxujb2eg4.js gzip N/A 450 B -
1dyfoo24ajqxm.js gzip N/A 162 B -
1jv-o1_s-zmua.js gzip N/A 49 kB -
1me96x5vwv1sy.js gzip N/A 65.7 kB -
1zc-k7aaakb6o.js gzip N/A 159 B -
29dt6m7d89-j7.js gzip N/A 157 B -
2d6k-a9uznmvb.js gzip N/A 156 B -
2e2z-03lx4fjc.js gzip N/A 13 kB -
2h70zbiqaf4bf.js gzip N/A 158 B -
2k9ax08cjl2id.js gzip N/A 12.9 kB -
2lms6k76q5-6m.js gzip N/A 13.3 kB -
2qx4twi9i3xus.js gzip N/A 2.28 kB -
2srnqic6tvxxd.js gzip N/A 8.52 kB -
2wrq5zps69nfq.js gzip N/A 70.8 kB -
3-34t1k915rbt.js gzip N/A 170 B -
30l7m4nayp73a.js gzip N/A 8.55 kB -
3h_ecpiaatwgc.js gzip N/A 10.1 kB -
3ity0aahajapd.js gzip N/A 225 B -
3nm_i02apa655.js gzip N/A 160 B -
3oa4b8uiuh01x.js gzip N/A 157 B -
3wrhpuc-j1aw9.js gzip N/A 9.77 kB -
43mlw9dy_8f02.js gzip N/A 8.58 kB -
turbopack-02..fq93.js gzip N/A 4.19 kB -
turbopack-0c.._bts.js gzip N/A 4.18 kB -
turbopack-0f..3b6y.js gzip N/A 4.16 kB -
turbopack-0k..1pc7.js gzip N/A 4.18 kB -
turbopack-13..a-km.js gzip N/A 4.18 kB -
turbopack-2_..2dke.js gzip N/A 4.18 kB -
turbopack-23..lkou.js gzip N/A 4.18 kB -
turbopack-24..jdhb.js gzip N/A 4.18 kB -
turbopack-2a..y2ca.js gzip N/A 4.18 kB -
turbopack-2q..7av9.js gzip N/A 4.18 kB -
turbopack-2w..zlx4.js gzip N/A 4.18 kB -
turbopack-37..786c.js gzip N/A 4.18 kB -
turbopack-3f..ivxr.js gzip N/A 4.18 kB -
turbopack-3g..kcks.js gzip N/A 4.18 kB -
Total 464 kB 464 kB ⚠️ +25 B

Server

Middleware
Canary PR Change
middleware-b..fest.js gzip 718 B 716 B
Total 718 B 716 B ✅ -2 B
Build Details
Build Manifests
Canary PR Change
_buildManifest.js gzip 430 B 435 B 🔴 +5 B (+1%)
Total 430 B 435 B ⚠️ +5 B

📦 Webpack

Client

Main Bundles
Canary PR Change
5528-HASH.js gzip 5.54 kB N/A -
6280-HASH.js gzip 60.7 kB N/A -
6335.HASH.js gzip 169 B N/A -
912-HASH.js gzip 4.59 kB N/A -
e8aec2e4-HASH.js gzip 62.8 kB N/A -
framework-HASH.js gzip 59.7 kB 59.7 kB
main-app-HASH.js gzip 255 B 254 B
main-HASH.js gzip 39.4 kB 39.3 kB
webpack-HASH.js gzip 1.68 kB 1.68 kB
262-HASH.js gzip N/A 4.59 kB -
2889.HASH.js gzip N/A 169 B -
5602-HASH.js gzip N/A 5.55 kB -
6948ada0-HASH.js gzip N/A 62.8 kB -
9544-HASH.js gzip N/A 61.4 kB -
Total 235 kB 235 kB ⚠️ +580 B
Polyfills
Canary PR Change
polyfills-HASH.js gzip 39.4 kB 39.4 kB
Total 39.4 kB 39.4 kB
Pages
Canary PR Change
_app-HASH.js gzip 194 B 194 B
_error-HASH.js gzip 183 B 180 B 🟢 3 B (-2%)
css-HASH.js gzip 331 B 330 B
dynamic-HASH.js gzip 1.81 kB 1.81 kB
edge-ssr-HASH.js gzip 256 B 256 B
head-HASH.js gzip 351 B 352 B
hooks-HASH.js gzip 384 B 383 B
image-HASH.js gzip 580 B 581 B
index-HASH.js gzip 260 B 260 B
link-HASH.js gzip 2.51 kB 2.51 kB
routerDirect..HASH.js gzip 320 B 319 B
script-HASH.js gzip 386 B 386 B
withRouter-HASH.js gzip 315 B 315 B
1afbb74e6ecf..834.css gzip 106 B 106 B
Total 7.98 kB 7.98 kB ✅ -1 B

Server

Edge SSR
Canary PR Change
edge-ssr.js gzip 125 kB 126 kB
page.js gzip 273 kB 273 kB
Total 398 kB 399 kB ⚠️ +186 B
Middleware
Canary PR Change
middleware-b..fest.js gzip 618 B 616 B
middleware-r..fest.js gzip 156 B 155 B
middleware.js gzip 44.2 kB 44.3 kB
edge-runtime..pack.js gzip 842 B 842 B
Total 45.8 kB 45.9 kB ⚠️ +71 B
Build Details
Build Manifests
Canary PR Change
_buildManifest.js gzip 715 B 718 B
Total 715 B 718 B ⚠️ +3 B
Build Cache
Canary PR Change
0.pack gzip 4.37 MB 4.36 MB 🟢 10.5 kB (0%)
index.pack gzip 114 kB 115 kB
index.pack.old gzip 115 kB 114 kB
Total 4.6 MB 4.59 MB ✅ -9.64 kB

🔄 Shared (bundler-independent)

Runtimes
Canary PR Change
app-page-exp...dev.js gzip 342 kB 342 kB
app-page-exp..prod.js gzip 189 kB 189 kB
app-page-tur...dev.js gzip 341 kB 341 kB
app-page-tur..prod.js gzip 189 kB 189 kB
app-page-tur...dev.js gzip 338 kB 338 kB
app-page-tur..prod.js gzip 187 kB 187 kB
app-page.run...dev.js gzip 338 kB 338 kB
app-page.run..prod.js gzip 187 kB 187 kB
app-route-ex...dev.js gzip 76.9 kB 76.9 kB
app-route-ex..prod.js gzip 52.5 kB 52.5 kB
app-route-tu...dev.js gzip 76.9 kB 76.9 kB
app-route-tu..prod.js gzip 52.5 kB 52.5 kB
app-route-tu...dev.js gzip 76.5 kB 76.5 kB
app-route-tu..prod.js gzip 52.2 kB 52.2 kB
app-route.ru...dev.js gzip 76.5 kB 76.5 kB
app-route.ru..prod.js gzip 52.2 kB 52.2 kB
dist_client_...dev.js gzip 324 B 324 B
dist_client_...dev.js gzip 326 B 326 B
dist_client_...dev.js gzip 318 B 318 B
dist_client_...dev.js gzip 317 B 317 B
pages-api-tu...dev.js gzip 43.9 kB 43.9 kB
pages-api-tu..prod.js gzip 33.4 kB 33.4 kB
pages-api.ru...dev.js gzip 43.8 kB 43.8 kB
pages-api.ru..prod.js gzip 33.4 kB 33.4 kB
pages-turbo....dev.js gzip 53.2 kB 53.3 kB
pages-turbo...prod.js gzip 39 kB 39.1 kB
pages.runtim...dev.js gzip 53.2 kB 53.2 kB
pages.runtim..prod.js gzip 39 kB 39 kB
server.runti..prod.js gzip 62.8 kB 62.8 kB
Total 3.03 MB 3.03 MB ⚠️ +101 B
📝 Changed Files (4 files)

Files with changes:

  • pages-turbo...ntime.dev.js
  • pages-turbo...time.prod.js
  • pages.runtime.dev.js
  • pages.runtime.prod.js
View diffs
pages-turbo...ntime.dev.js

Diff too large to display

pages-turbo...time.prod.js

Diff too large to display

pages.runtime.dev.js

Diff too large to display

pages.runtime.prod.js

Diff too large to display

📎 Tarball URL
https://vercel-packages.vercel.app/next/commits/5f5623aef6a31269e13180ed7eb936bc0a5d837f/next

@lukesandberg lukesandberg marked this pull request as ready for review April 8, 2026 00:02
…outer

Previously a separate scriptAssetQueryString was introduced to strip ?ts=
from script tags. This refactors the approach more cleanly: assetQueryString
(used by scripts) never includes ?ts=, while a new cssAssetQueryString
(only used by CSS <link> and font <link> tags) carries the timestamp.

This makes the invariant explicit at the source rather than maintaining
two parallel query string paths.

Co-Authored-By: Claude <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Statically imported image in Next 16.2 (Pages Router) breaks ‎next dev in Safari 26.4

2 participants