4

I was analyzing the service workers and cache storage we have implemented in our website.

Going through the process, I found out that the amount of cache storage used by the website is huge.

The cumulative size of the files that I am adding to cache storage is not more than 5-6 MB. But in the chrome dev tools, it shows approximately 131 MB storage used.

Chrome 63 on OS X.

Padded cached responses

In incognito mode it shows usage as high as 100 MB which causes Quota Exceeded error .

Even after clearing browsing data from chrome settings, and reloading the webpage (bandwidth speed - 1MBps) , just after 4-5 seconds the storage use is shown as 130 MB which is practically not possible because

1) As mentioned above my actual data size added to cache is 5-6 MB .

2) even if it was somehow getting 130 MB (I don't know how), downloading 130 MB is just not possible given my bandwidth limitations.

What might be the issue here ? Why does it show such high cache storage usage?

Dan Dascalescu
  • 143,271
  • 52
  • 317
  • 404
formatkaka
  • 1,278
  • 3
  • 13
  • 27
  • 1
    My feeling is that this is a bug in the Dev Tools. Not sure though but the problem appeared a version or so ago. – pate Dec 10 '17 at 13:42
  • Expand the **Cache Storage** section. Do you see multiple caches? Inspect each cache. Do the cached resources match what you expect? Are the sizes of each resource correct? – Kayce Basques Dec 13 '17 at 19:56
  • There is only one section of static cache in the cache storage section. Basically it contains the contents of my dist folder and some cdn's. The size of my dist folder is 11 MB along with 6-7 cdn's used. I browsed through the list of static cache contents, and the file sizes seem ok. Between, the cache storage size is now shown as 98MB. (don't know how) – formatkaka Dec 13 '17 at 20:11
  • I just checked the cache storage value in canary, it shows 175 MB. – formatkaka Dec 14 '17 at 05:28
  • 1
    A related bug: https://bugs.chromium.org/p/chromium/issues/detail?id=795134 – Jeff Posnick Dec 19 '17 at 21:42
  • Exact duplicate of [Chrome shows high cache storage use](https://stackoverflow.com/questions/49295113/chrome-shows-high-cache-storage-use) and see also [limitations of opaque responses](https://stackoverflow.com/questions/39109789/what-limitations-apply-to-opaque-responses). TL;DR - each opaque response, even a 100-byte GIF, takes on average [7MB of cache](https://bugs.chromium.org/p/chromium/issues/detail?id=796060#c17). – Dan Dascalescu Jun 12 '20 at 00:17

1 Answers1

1

This question is a duplicate of Chrome shows high cache storage use and until it gets closed, I'm going to leave an answer here for visibility. Feel free to delete after closing.

See also limitations of opaque responses.

TL;DR

Each opaque response (the result of a request made to a remote origin when CORS is not enabled), even a 100-byte GIF, takes on average 7MB of cache.

Solutions include adding crossorigin="anonymous" in script and img tags, and removing { mode: 'no-cors' }.

Dan Dascalescu
  • 143,271
  • 52
  • 317
  • 404