前端浏览器缓存及代码部署_前端发完版得需要清除缓存才可以生效,怎么使用其他方式控制资源-CSDN文库

版权申诉

前端,浏览器,缓存,及,代码,部署,

154 浏览量 2021-03-29 17:57:59 上传评论收藏 165KB PDF 举报

资源推荐

资源详情

资源评论

前端浏览器缓存及代码部署前端浏览器缓存及代码部署

前言前言

最近手上刚刚拆掉石膏，去楼下房友帮忙。楼下房友领导来自阿里，前端用的是阿里的ant-design，设计将设计图上传到蓝

湖，聊天工具也采用阿里的钉钉。有时间我也多多去楼下房友交流学习，多交流，就会有提升。最近也比较忙，好久没有更新

博客了。闲言少叙，今天主要谈谈前端性能优化之浏览器缓存。

浏览器缓存浏览器缓存

我前面写过浏览器缓存的文章，也写过html5离线缓存，关于这些缓存，我们很容易搞不清，例如：200 OK (FROM

MemoryCache、FROM DiskCache) 及 304 NOT MODIFIED 还有 application cache (离线缓存)等等。

200 from memory cache 不访问服务器，直接读缓存，从内存中读取缓存。此时的数据时缓存到内存中的，当kill进程后，也

就是浏览器关闭以后，数据将不存在。但是这种方式只能缓存派生资源

200 from disk cache 不访问服务器，直接读缓存，从磁盘中读取缓存，当kill进程时，数据还是存在。这种方式也只能缓存派

生资源

304 Not Modified 访问服务器，发现数据没有更新，服务器返回此状态码。然后从缓存中读取数据。

三级缓存原理三级缓存原理

1. 先去内存看，如果有，直接加载

2. 如果内存没有，择取硬盘获取，如果有直接加载

3. 如果硬盘也没有，那么就进行网络请求

4. 加载到的资源缓存到硬盘和内存

一般浏览图片，如下流程：

访问-> 200 -> 退出浏览器

再进来-> 200(from disk cache) -> 刷新 -> 200(from memory cache)

application cache和上面缓存有点区别，是离线缓存，就是资源可以从硬盘上读取而不用联网，即使断网，用户也可以浏览。

设置浏览器缓存设置浏览器缓存

304是协商缓存还是要和服务器通信一次，要想断绝服务器通信，就要强制浏览器使用本地缓存（cache-control/expires），

一般有如下几种方式设置浏览器缓存。

1、通过HTTP的META设置expires和cache-control

http-equiv="Cache-Control" content="max-age=7200" />

http-equiv="Expires" content="Sun Oct 15 2017 20:39:53 GMT+0800 (CST)" />

这样写的话仅对该网页有效，对网页中的图片或其他请求无效。

2、apache服务器配置图片，css，js，flash的缓存

这个主要通过服务器的配置来实现这个技术，如果使用apache服务器的话，可以使用mod_expires模块来实现：

编译mod_expires模块：

Cd /root/httpd-2.2.3/modules/metadata

/usr/local/apache/bin/apxs -i -a -c mod_expires.c //编译

先打开httpd.conf文件，然后查找expires这个模块，找到后，删除左边的#号，表示打这个模块，并重启apache服务器

编辑httpd.conf配置：添加下面内容

mod_expires.c>

ExpiresActive on

ExpiresDefault "access plus 1 month"

本内容试读结束，登录后可阅读更多

下载后可阅读完整内容，剩余3页未读，立即下载

内容反馈

版权申诉

weixin_38683562

粉丝: 6
资源: 970

最新资源

资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！点击此处反馈

feedback-tip