You just ran a performance audit on PageSpeed Insights, and Lighthouse has recommended: “Serve static assets with an efficient cache policy”.
This means you should tell your browser how long it should keep your files stored locally on your visitor’s browser.
There are two headers responsible for the browser caching: "Cache-Control” and “Expires.” If you see the Lighthouse’s warning, it means that both headers are missing or that their expiration period is too short. Google requires that your assets (images, fonts, JS, CSS) have a minimum cache expiration period of 30 days.
But what is Browser caching exactly?
To activate browser caching, you need both “Expires” and “Cache-Control” headers.
The “Expires” header is a basic way to enable caching on the browser and specify the time that the resources will be kept on your browser and then deleted. It basically tells how long the resources will live in the browser's temporary memory.
The “Cache-Control” header is more detailed and gives you more options to control the caching behavior of the browser.
How does NitroPack actually help with this?
NitroPack will set the appropriate caching headers for you automatically.
NitroPack offers a CDN, the most common approach these days for the caching headers to be set, and therefore fixing the warning by Google PageSpeed Insights.
You have NitroPack installed, but you are still seeing the warning?
This can happen if you have exclusions added through your NitroPack dashboard.
When excluding certain files, NitroPack will no longer optimize them, and they will be served directly from the origin server. This has some disadvantages:
The resources will no longer be optimized by NitroPack;
The resources will not be served by NitroPack’s CDN servers;
Any excluded files would not benefit from NitroPack’s optimization and lazy loading;
If any files are excluded, you need to add Expire headers to your website to cover these resources.