前端性能优化(五)传输加载优化

    科技2024-07-26  11

    前端性能优化(五)传输加载优化

    一.启动压缩Gzip1.在传输阶段进行体积压缩,可高达百分之90%2.如何配置Nginx启用Gzip 二.使用keep-alive三.http缓存四.使用http2

    一.启动压缩Gzip

    1.在传输阶段进行体积压缩,可高达百分之90%

    2.如何配置Nginx启用Gzip

    如何配置Nginx启用Gzip

    首先 下载homebrew 然后 安装nginx brew install nginx 然后 sudo brew services start nginx 开启服务 然后 vim /usr/local/etc/nginx/nginx.conf 查看配置文件

    会查看到默认端口8080

    然后把打包完之后的文件复制到用户名下一级的一个文件夹中 然后修改location 的root定位到打包后的文件夹中

    然后把 有关gzip前面的#号去掉

    第一个 on 代表打开gzip压缩 第二个 min -length 至少多大的文件蔡启动压缩 第三个 comp level 压缩等级 6即可 不要太干 要不然gpu负担太大 第四个 types 要压缩的文件类型

    二.使用keep-alive

    http 1.1 新增 长连接

    请求头:Connection:keep-alive

    举个例子: 在network中第一个请求的时间有一个initial connection的时间消耗即TCP连接消耗的时间: 而在接下来同一台服务器的请求中,就没有initial connection的时间消耗 就是因为我们请求头设置了长连接 也可以用nginx配置

    timeout 超时时间,超过这个时间没有使用,就会关闭tcp连接 request 建立TCP连接后,可以发送多少个请求

    三.http缓存

    cache-control/expires last-modified+if-modified-since etag+if-none-match http缓存机制

    四.使用http2

    HTTP2优势 1》多路复用 2》服务器推送: nginx用http2_push命令,把服务器的资源提前放到浏览器中,避免请求资源的耗时 3》二进制解析 4》header头部压缩

    Processed: 0.012, SQL: 8