Caching strategies for PWA

mtee

Margaret W.N

Posted on September 23, 2020

Caching strategies for PWA

I learnt the different caching strategies used in PWA today.

Caching strategies define how the services worker responds on receiving a fetch event. They include:

  • Cache only: Involves fetching from the cache without making any request to the network. Suitable for static content that changes only on update.
  • Network only: Involves fetching from the network. Suitable for content with no offline version.
  • Cache first: Involves checking the cache first and using the network as a fallback strategy.
  • Network first: Involves checking the network and using the cache as a fallback strategy. Suitable for dynamic content.
  • Cache then network: Involves fetching from the cache first then proceeding to a network request which then updates the cache. The updates are implemented on arrival.
  • Stale while revalidate: Involves making use of the cache first then fetching from the network. Updates reflect on refresh.

You might want to clear different versions of the cached data. Here is the resource with the code to perform that: Deleting Outdated cache

That's it for day 69: 100days of code.
Let's do this again tomorrow

💖 💪 🙅 🚩
mtee
Margaret W.N

Posted on September 23, 2020

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Caching strategies for PWA
100daysofcode Caching strategies for PWA

September 23, 2020

Service Worker registration
100daysofcode Service Worker registration

September 20, 2020