-
开启GZIP
以tomcat为例 在路径\apache-tomcat-7.0.77\conf\下找到server.xml文件 找到下图位置
找到这里.png
添加如下代码
compression="on"
compressionMinSize="50"
noCompressionUserAgents="gozilla,traviata"
compressableMimeType="text/html,text/xml,text/javascript,application/x-javascript,application/javascript,text/css,text/plain"
变成这样
更改后.png
然后重启tomcat
打开项目 然后开启调试 观察
请求资源出现如下字样为GZIP开启成功
GZIP开启成功.png
开启前性能
开启前.png
开启后性能
开启后.png
compression="on" //打开压缩功能
compressionMinSize="50" //启用压缩的输出内容大小 默认为2KB
noCompressionUserAgents="gozilla, traviata" //对于以下的浏览器 不启用压缩
compressableMimeType="text/html,text/xml,text/javascript,text/css,text/plain" //哪些资源类型需要压缩
注意：如果发现内容没有被压缩 可以考虑调整compressionMinSize大小 如果请求资源小于这个数值 则不会启用压缩
注意：测试效果前需清除浏览器缓存
-
优化图像
懒加载
懒加载可以延迟加载长页面中的图片 在浏览器可视区域外的图片不会被载入 直到滚动到所在位置才请求加载 这一点和预加载刚好相反 预加载是将图片全部请求然后存在本地缓存中 这牺牲了服务器的性能 提高了用户体验
懒加载的原理是在img标签中将真正的图片地址存储在自定义属性data-ori中 进入到可视区域后将data-ori的值赋给src
这里可以使用基于jquery的插件lazyload 具体实现方法可以参考我的这篇文章
CSS SPRITE
即CSS精灵 将多个零散的小图片（多为图标）整合到一张背景图中 通过减少个数即减少请求来达到加速的目的 有很多在线生成css sprit的网站可以作为辅助
-
去掉不必要的插件
有些插件很炫酷 但是是不必要的功能
-
减少DNS查询
直接的方式是减少网站请求的域 即可减少DNS查询的次数 但同时会造成并行下载数减少 因此建议将内容发布到至少2个 至多4个不同的主机名上
-
使用CDN
CDN是高性能网络服务 国内没有特别稳定的 使用过百度的CDN 很多静态资源都没有 并且更新也不及时 目前使用的是BootCDN
-
按需加载
避免把所有js全都写在公共的模板中 有的页面并不需要它
-
压缩CSS和JavaScript
上线的CSS/JS需要压缩以减少尺寸 通常会使用YUI Compressor和UglifyJS 如果使用了webpack 那么可以直接使用集成的插件进行压缩 最后还可以使用一些在线工具
YUI Compressor 使用方法
YUI Compressor 官网
UglifyJS 使用方法
UglifyJS 官网
在线工具
在线工具
-
参考
可以参考比较古老的一本书《高性能网站建设指南》
网友评论