优秀是一种习惯,不求进步很大,但求天天进步。

像蜗牛一样爬行,坚信总有一天我有属于我的一片天。
  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

《高性能网站建设指南》读书笔记

Posted on 2011-11-27 19:46  StartFromZero  阅读(255)  评论(0编辑  收藏  举报

前些天我们经理拿给我一本书,让我看看,《高性能网站建设指南》,前端工程师技能精髓,两个晚上,翻完啦。周末,写一下读书笔记,便于以后用到的时候查阅。

总共讲了14个规则,最后一张简要分析十大网站。

作为一个web开发人员,我觉得了解常用的几个规则就可以了:

规则1减少http请求。

1.1csssprite

使用情况:页面中导航中多个图标,可以把图标集中到一个图片上,这样就又原来的多个图片的http请求,变成一个。当然多个图片合成为一个图片,在第一次加载的时候,可能没有多个小图快,但是整体来看,这样合成后的,效果大于分开的小图。(很实用)

2.合并脚本和样式表

理想情况下,一个页面上,脚本和样式表都是一个。所以,脚本的合并,样式表的合并同样能够减少http请求。

规则2使用cdn

(和我们相关性不大),这是网管的问题和公司的问题,而且成本是很大的。貌似博客园,最近也在用cdn来提高网站的访问速度。

规则3添加expires

把页面哪些图片,cssjs等设置expire,当页面再次发送请求,直接从缓存中取出来。

规则4压缩组件

浏览器通过Content-Encoding头来通知web客户端,gzip是目前流行和有效的压缩方法。但是,会导致服务器花费额外的cpu周期。

规则5将样式表放在页面顶部

这个不用多说啦,基本上都是这样做的。

规则6将脚本放在底部

我们一般也是习惯于放在页面的顶部,但是为了避免脚本阻塞下载,还是改变一下传统的那种方式,放到页面底部

规则7避免css表达式

我用到的css表达式,就是png图片透明的时候,虽然可以通过js解决,但是还是习惯于用css表达式,但这里是不合适的。因为所谓的求值和判断,当页面滚动,鼠标移动的时候都要求值。

规则8

使用外部jscss

习惯于这样用,相比于内联来说,外部的jscss可能被缓存,所以,相对快点。

加载后下载:

动态内联:利用cookie是否存在来判断。不存在,表示是第一次加载。

规则9

减少dns查找

通过使用keepalive和较少的域名较少dns查找。

规则10

精简js

推荐JSmin工具

YUI
Compressor

DojocompressorShrinkSafe,

精简css,利用css压缩工具处理空格,前提是先把自己的css相同的类合并,同时移除不必要的类。

规则11

避免重定向

缺少结尾的斜线,导致重定向是很多web服务器默认的行为,所以,所以要谨慎。

规则12

移除重复的脚本

同样可以功能可能采用不同的js,但是尽量是想js的公用,对页面中用到的js进行检查和合并,对于团队开发特别重要。确保脚本只是被包含一次。

规则13

配置Etag(不太理解)

定义:实体标签,是web服务器和浏览器用于确认缓存组件的有效性的一种机制。

规则14

使ajax缓存

推荐几个常用的页面优化工具:

httpwatcher:具体用法总结的很全面。

Yslow

总结完啦,没看到多少自己的东西,呵呵,惭愧啊,看来还是没有读透这本书啊!有时间再次拜读,写点实战心得。

更多网站优化的内容参考:

http://www.cnblogs.com/yslow/archive/2009/04/24/1442722.html