Disabling Chrome cache for website development

Question

I am modifying a site\'s appearance (CSS modifications) but can\'t see the result on Chrome because of annoying persistent cache. I tried Shift+refresh but it doe

Answer 1

How can I disable the cache temporarily or refresh the page in some way that I could see the changes?

It's unclear which "cache" you're referring to. There are several different methods a browser can cache content persistently. Web Storage being one of them, Cache-Control being another.

Some browsers also have a Cache, used in conjunction with Service Workers, to create Progressive Web Apps (PWAs) providing offline support.

To clear the cache for a PWA

self.caches.keys().then(keys => { keys.forEach(key => console.log(key)) })

to list the names of the cache keys, then run:

self.caches.delete('my-site-cache')

to delete a cache key by name (i.e., my-site-cache). Then refresh the page.

If you see any worker-related errors in the console after refreshing, you may also need to unregister the registered workers:

navigator.serviceWorker.getRegistrations()
  .then(registrations => {
    registrations.forEach(registration => {
      registration.unregister()
    }) 
  })