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

click Generate

Required HTTP response headers

click Generate to see 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.

Before (cached)
After (new icon)

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.

Cache-Control: max-age=86400 ✗ Chrome may skip update — URL unchanged, eligibility unclear

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.

Cache-Control: immutable, max-age=31536000 Content-Type: image/png ✓ Chrome 144: update eligibility clear

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.

see also