页面最小化 | 云防线技术博客

页面最小化

来源:本站原创 网站优化 超过围观 0条评论

页面最小化(Minify)可以用来来提高网站的性能。它会合并多个CSS或者JavaScript 文件或者HTML文件,移除一些不必要的空格和注释,进行gzip压缩。Minify 在设计上和Yahoo的 Combo Handler Service非常像,不过Minify可以合并任何你想要合并的JavaScript和CSS文件。

一般情况下,网站速度的瓶颈都在前端,而最关键的就是资源的加载速度,但是大多数浏览器都有单个域名并发请求数限制,所以如果一个页面中存在很多的资源,比如CSS和JavaScript文件,那么明显会降低网站的加载速度,比较好处理方式就是把多个文件通过一个请求来访问,这样既不会影响之前的文件维护,又会减少资源的清楚数量,Minify就是为之而生。下面是一些被Minify采用的 Yahoo! 优化准则:

1.Make fewer HTTP requests——减少HTTP请求数量

2.Add Expires headers——添加缓存头

3.Compress components——压缩组件

4.Put CSS at top——将css放在头部

5.Put JavaScript at bottom——将javascript放在底部

6.Avoid CSS expressions——避免css表达式

7.Make JavaScript and CSS external——javascript与css使用外链的方式

8.Minify JavaScript and CSS——javascript与css最小化

9.Remove duplicate JavaScript and CSS——移除重复的javascript与css

10.Configure entity tags (ETags)——配置ETags

11.Make AJAX cacheable——使AJAX可缓存

12、Keep Components under 25K——将组件大小保持在25K以下

下面两幅图分别是启用Minify之前和启用Minify之后网站请求时间的一个对比,可以看出启用Minify之后,资源的加载时间从250ms减少到了125ms,总共节省了50%的时间。

使用Minify之前:

使用Minify之后:

特性:

● 合并多个CSS或JavaScript文件为一个文件,减少请求数量,并且进行minify处理

● 使用了多个Minify库,包括 Minify JavaScript ,Minify CSS,Minify HTML

● 服务端缓存,可以避免不必要的重复处理

版权信息:原创文章:云防线
本文标题:页面最小化
本文链接:http://blog.cloudfence.cn/?p=35转载请注明转自云防线
如果喜欢:点此订阅本站
上篇文章:
下篇文章: