HTTP缓存主要分为强缓存和协商缓存两种。
强缓存是指浏览器直接从本地缓存中获取资源,不发送请求到服务器。主要通过Cache-Control和Expires两个响应头控制。Cache-Control优先级更高,可以设置max-age来指定缓存时间,比如max-age=3600表示缓存1小时。
协商缓存是指浏览器发送请求到服务器,服务器根据请求头判断资源是否更新,如果没更新就返回304状态码,告诉浏览器使用本地缓存。主要通过Last-Modified和ETag两个机制实现。Last-Modified基于文件修改时间,ETag基于文件内容生成的唯一标识,ETag更精确。
缓存策略方面,对于静态资源如图片、CSS、JS文件,通常设置较长的缓存时间,配合文件名hash来实现版本控制。对于HTML文件,通常设置较短的缓存时间或禁用缓存,确保用户能及时获取最新内容。
在实际项目中,我们会根据资源类型设置不同的缓存策略,既保证用户体验,又减少服务器压力。现代前端构建工具也会自动处理缓存相关的配置。