- 相关推荐
浅谈前端性能优化
1、前端性能优化的一点：
对js、css、图片等进行压缩，尽可能减小文件的大小，减少文件下载的时间，从而减少网页响应的时间。
2、前端性能优化的另一点：
对HTTP传输进行压缩，即在js，css、图片等资源已经压缩的基础上（其实，文件的压缩与否均可，文件的压缩跟HTTP传输过程的压缩没关系），在HTTP传输过程中的再次压缩。
3、HTTP1.1的Accept-Encoding和content-Encoding：
从HTTP1.1开始，客户端可以通过Accept-Encoding头来声明浏览器支持的压缩方式，服务端通过content-Encoding来启用压缩，配置压缩的文件类型，压缩方式。当客户端的请求到达服务器，服务器对资源进行压缩后，返回给客户端，客户端按照相应的方式进行解析。
eg：
客户端（HTTP请求头）——accept-encoding: gzip, deflate, sdch, br
服务器（HTTP响应头）——content-encoding:gzip
压缩验证查看效果：
文件传输前的大小——通过属性查看
文件传输过程中的大小——通过Network中的Size查看
4、压缩方式选择：
gzip是GUNzip的缩写，使用无损压缩，压缩效果最佳，已经成为使用最为普遍、支持的浏览器最多的数据压缩格式。
天猫、淘宝、京东、苏宁、腾讯、百度等大型网站都使用gzip压缩方式。
5、如何使用gzip压缩
客户端不用做任何配置，在服务端配置即可，不同服务器的配置方法也不尽相同。
以tomcat服务器的配置为例：
找到tomcat安装目录下的conf文件夹下的server.xml文件，进行如下配置，重启tomcat即可：
① compress="on" ：表示开启压缩。
② compressionMinSize="2048"：表示对大于2KB的文件进行压缩
③ compressableMimeType="text/html,text/xml,application/javascript,text/css,text/plain,image/png,image/jpeg,image/gif"：表示将进行压缩的文件类型，对js，css，图片压缩可以大大提升压缩效果。
注意：不应该对图片进行再压缩，因为图片本身已经被压缩过，如果再进行gzip压缩，可能得到的结果是和图片本身大小相差不大，纯粹是浪费服务器的CPU资源来做无用功。
6、对HTTP传输内容进行压缩的优、缺点：
① 优点：减少HTTP响应时间，提升传输效率。
② 缺点：压缩过程占用服务器额外的CPU周期，客户端也要对压缩文件进行解压缩，这也需要占用部分时间。
随着硬件性能不断提高，上述问题正在不断弱化，国内外大型网站都对HTTP传输进行压缩。
【浅谈前端性能优化】相关文章：
浅谈的作文11-30
浅谈教学体会02-28
浅谈穿越作文12-25
浅谈共享作文09-02
浅谈游客作文08-08
浅谈分享阅读的体会02-29
[通用]浅谈教学体会02-29
浅谈文学与创作作文07-18
浅谈穿越作文(精华)12-26
浅谈包装作文12-19