Solution 1 :

I think your problem is making cross domain requests. Many of those are opaque. This is where things get a little complex. As a security feature opaque requests are padded, which means a relatively small response will be cached as several MBs.

To fix some of this load things like bootstrap, etc from your site.

As far as the actual size cached in dev tools. That value is rather misleading. I have grown to not trust that value because it seems to report more than just your site. So I would not get too worried about that value.

My Dev Tools says 207MB for your site, which is no way true.

Other quick notes:

According to what I see in my dev tools you are loading 4.7MB in a mobile view. 1.2MB of JavaScript, I am sure that can get trimmed a lot. That is 2X the size of your images.

You are also using a single image size for all viewports. Look into responsive images.

Problem :

Hello I have a website up currently which you can view here and I’m unable to figure out why when I open the application tab in chrome dev tools it says:
“482 MB used out of 480 MB storage quota. “

Image of what I see in application tab in chrome dev tools

My goal is to cache the sites images, .css/.js/.html and other necessary files so the site will look the same when viewing it without an internet connection.

I don’t know a whole lot about service workers.
And, my only guess is that it is getting filed up from what I believe is called an, correct me if I’m wrong, “API request” to either Bootstrap, Font awesome, jQuery, or Google Maps API. But even if it was from an API request I still wouldn’t know how to go about fixing that without just removing the API call which I need for my site to look correct.

I suppose if it is caused by Bootstrap, Google Maps, jQuery, or Font Awesome then I could download that and store it along with my other site files…possibly? And only store the files from the API request that are needed for the site to function. Idk though I consider that a last effort solution as I’d prefer to keep the website storage size as small as possible.

Also, I figured giving the site link would be better than code cause you can immediately see the problem I’m dealing with in it’s natural environment, and since I really don’t know why it would store 482Mb I figured it might be better to not show an isolated piece of code that I’m not even sure is causing the problem.

Any help or insight is appreciated!