• 前端性能优化---减少http请求数量和减少请求资源的大小


    减少http请求数量:就是资源的合并
    减少http请求大小:就是资源的压缩
     
    一、资源合并的原理:
     
    资源不合并的缺点:
    1.文件和文件之间有插入请求----请求a.js,b.js,c.js(三行请求)合并之后只需要请求一行(请求a-b-c.js),不合并增加了N-1个网络延迟,上图而言是增加了2个网络延迟。
    2.每一个网络请求都会相应增加丢包问题的影响,所以不合并资源的时候,请求多了,所受丢包问题影响更严重。
    3.keep-alive服务器可能会被断开,不能完成整个keep-alive状态的保持
     
    资源合并的缺点:
     
    1.首屏渲染---文件样式布局主要由js文件决定,合并之后的js文件变大,会导致首屏渲染很慢
    2.缓存失效---合并之后,修改了一个js文件,导致整个合并的代码重新加载,缓存失效
    由于有这些缺点,所以要:
    如何合并:用在线网站、构建工具
    二、资源压缩
    资源压缩的优点:节省流量,加载更快,代码保护(防止被篡改)
    1.html压缩
    方法:
    ①使用在线网站进行压缩(不推荐)
    ②nodejs提供了html-minifier工具
    ③后端模板引擎渲染压缩
     
    2.css压缩
    方法:
    ①使用在线网站进行压缩(不推荐)
    ②nodejs提供的html-minifier对html中的css进行压缩
    ③使用clean-css对css进行压缩
     
    3.js压缩与混乱
    方法:
    ①在线压缩
    ②使用html-minifier对html中的js进行压缩
    ③使用uglifyjs2对js进行压缩
     
     
     
    实操:
    fis3:
  • 相关阅读:
    第三次上机
    第5次作业
    第二次上机练习
    第三次作业
    第一次作业
    第一次作业
    第二次上机练习
    第二次作业
    第一次作业
    第四周作业
  • 原文地址:https://www.cnblogs.com/echo-hui/p/9298873.html
Copyright © 2020-2023  润新知