v144 · web-app · demo
Icon Hash Strategy
Content-addressed (hashed) icon URLs paired with Cache-Control: immutable let Chrome cache icons forever and only re-fetch when the URL changes — the correct update strategy for Web App Manifest icons in Chrome 144.
Generator — build your hashed icon URL
Manifest JSON fragment
Required HTTP response headers
Change simulation — how a new icon triggers a re-fetch
Click "Change icon" to simulate updating the icon asset. Because the content hash changes, the URL changes, and Chrome knows to fetch the new URL rather than use the cached one.
Mutable vs immutable URL comparison
mutable URL — always re-checked
/icons/app-icon.png
Chrome must re-validate with the server on each update check. Even with Cache-Control: max-age=86400, Chrome may decide the manifest update eligibility is uncertain and skip the update.
immutable URL — cached forever, hash triggers update
/icons/app-icon-a1b2c3d4.png
Chrome caches forever — no re-validation needed. When the icon changes you change the hash, so the URL changes, so Chrome fetches fresh. Update eligibility is unambiguous.
full example
// manifest.webmanifest
{
"name": "My App",
"icons": [
{
"src": "/icons/app-icon-a1b2c3d4.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/icons/app-icon-a1b2c3d4.png",
"sizes": "512x512",
"type": "image/png"
}
]
}
// HTTP response headers for /icons/app-icon-a1b2c3d4.png
Cache-Control: immutable, max-age=31536000
Content-Type: image/png
// When the icon changes:
// 1. Hash the new file → e.g. "e5f6a7b8"
// 2. Upload as /icons/app-icon-e5f6a7b8.png
// 3. Update manifest.webmanifest to reference the new URL
// 4. Chrome detects the manifest changed, sees new icon URL,
// fetches fresh — guaranteed, no cache confusion.