[TOC]

如何制定前端资源的最佳缓存策略？

如何制定前端资源的最佳缓存策略？什么意思？

前端有很多类型的资源比如：.js .css .png index.html

不同资源，缓存时间的策略应该有所不同

如何制定最佳缓存策略

最好的标准是资源更改的频率

	Html	Css 和 js	图片
频率	可能会频繁更改，需要每次都询问。	可能每月修改	几乎不变
Cache-Control	private, no-cache	Public, max-age=2592000 (一个月)	Public, max-age=31536000 (一年)，stale-while-revalidate=86400
使缓存失效	每次都要询问，确保最新	自动过期或改名字（hash值）	自动过期或改名字（hash值）

背景：任何一个css或js文件，只要有变更，通过webpack或其他打包工具，自动改变文件的名（hash值）

此工程下的最佳缓存策略可以设置为：

	Html	Css 和 js	图片
频率	可能会频繁更改，需要每次都询问。	可能每月修改	几乎不变
Cache-Control	private, no-cache	Public, max-age=31536000 (一年甚至永久)	Public, max-age=31536000 (一年甚至永久)，stale-while-revalidate=86400
使缓存失效	每次都要询问，确保最新	改名字（hash值）	改名字（hash值）

（原创整理，有疑问或错误可以留言。如果有用，谢谢点赞~）

性能优化合集快速入口：