1. Home
  2. Getting Started
  3. What is Caching Strategies in PWA and how to use it?

What is Caching Strategies in PWA and how to use it?

Cache is a great tool you can use when building your app, as long as the cache you use is appropriate for each resource. Several caching strategies are described in the PWA Caching Strategies

First, go to WordPress Dashboard -> Navigate to PWA -> Settings -> Advanced -> “Caching Strategies” in this option we are providing four Caching Strategies and then click on the save changes button.

Scroll down little to see this option

Default caching strategy: In this default caching strategy four option will be displayed as per your requirement you can enable those options and then click on the “Save Changes” button.

  • Stale While Revalidate: The stale-while-revalidate pattern allows you to respond the request as quickly as possible with a cached response if available, falling back to the network request if it’s not cached. The network request is then used to update the cache.

Stale While Revalidate
  • Network First: By default, it will try and fetch the latest request from the network. If the request is successful, it’ll put the response in the cache. If the network fails to return a response, the cached response will be used.

Network First
  • Cache First: Cache First strategy is to check the cache before going to the network. This is great for caching on the fly and optimizing for repetitive asset requests since it only hits the network on ‘fresh’ assets.

Cache First
  • Network Only: I find this strategy to be the ‘norm’ for most applications today. This is exactly how it sounds, network requests only with no cache. This is for assets where any cached version is unacceptable or too risky.

Network Only

Caching strategy for CSS and JS Files: By using this option you can cache CSS and JS files In caching strategy for CSS and JS files four option will be displayed as per your requirement you can enable those options and then click on the “Save Changes” button.

Caching strategy for images: By using this option you can cache images
In caching strategy for images, four option will be displayed as per your requirement you can enable those options and then click on the “Save Changes” button.

Caching strategy for fonts: By using this option you can cache CSS and JS files In caching strategy for fonts four option will be displayed as per your requirement you can enable those options and then click on the “Save Changes” button.

That’s it for this tutorial!

We hope we’ve clear your doubts in case If you have any feedback or questions, Just contact us here and we are always available for you.

Updated on February 24, 2020

    Are you still looking for a solution?

    Then fill out the below form and we will reach out to you within a few hours.


    Was this article helpful?

    Related Articles

    Need Support?
    Can’t find the answer you’re looking for? Don’t worry we’re here to help!
    Contact Support