http://www.cnblogs.com/lei2007/archive/2013/08/16/3262897.html雅虎

除消减外部的脚本和样式表文件外，和代码块也可以并且应该进行消减。即使你用Gzip压缩过脚本

和样式表，精简这些文件仍然可以节省5%以上的空间。由于JavaScript和CSS的功能和体积的增加，消减代码将会获得益处。

24、剔除重复脚本

在同一个页面中重复引用JavaScript文件会影响页面的性能。你可能会认为这种情况并不多见。对于美国前10大网站的调查显示其中有两家存在重复引

用脚本的情况。有两种主要因素导致一个脚本被重复引用的奇怪现象发生：团队规模和脚本数量。如果真的存在这种情况，重复脚本会引起不必要的HTTP请求和

无用的JavaScript运算，这降低了网站性能。

在Internet

Explorer中会产生不必要的HTTP请求，而在Firefox却不会。在Internet

Explorer中，如果一个脚本被引用两次而且它又不可缓存，它就会在页面加载过程中产生两次HTTP请求。即时脚本可以缓存，当用户重载页面时也会产

生额外的HTTP请求。

除增加额外的HTTP请求外，多次运算脚本也会浪费时间。在Internet

Explorer和Firefox中不管脚本是否可缓存，它们都存在重复运算JavaScript的问题。

一个避免偶尔发生的两次引用同一脚本的方法是在模板中使用脚本管理模块引用脚本。在HTML页面中使用

/>标签引用脚本的最常见方法就是：

type="text/javascript"

src="menu_1.0.17.js">

在PHP中可以通过创建名为insertScript的方法来替代：

为了防止多次重复引用脚本，这个方法中还应该使用其它机制来处理脚本，如检查所属目录和为脚本文件名中增加版本号以用于Expire文件头等。

25、减少DOM访问

使用JavaScript访问DOM元素比较慢，因此为了获得更多的应该页面，应该做到：

缓存已经访问过的有关元素

线下更新完节点之后再将它们添加到文档树中

避免使用JavaScript来修改页面布局

有关此方面的更多信息请查看Julien

Lecomte在YUI专题中的文章“高性能Ajax应该程序”。

26、开发智能事件处理程序

有时候我们会感觉到页面反应迟钝，这是因为DOM树元素中附加了过多的事件句柄并且些事件句病被频繁地触发。这就是为什么说使用event

delegation（事件代理）是一种好方法了。如果你在一个div中有10个按钮，你只需要在div上附加一次事件句柄就可以了，而不用去为每一个按

钮增加一个句柄。事件冒泡时你可以捕捉到事件并判断出是哪个事件发出的。

你同样也不用为了操作DOM树而等待onload事件的发生。你需要做的就是等待树结构中你要访问的元素出现。你也不用等待所有图像都加载完毕。

你可能会希望用DOMContentLoaded事件来代替

事件应用程序中的onAvailable方法。

有关此方面的更多信息请查看Julien

Lecomte在YUI专题中的文章“高性能Ajax应该程序”。

图片和Coockie也是我们网站中几乎不可缺少组成部分，此外随着移动设备的流行，对于移动应用的优化也十分重要。这主要包括：

五、Coockie部分

减小Cookie体积

对于页面内容使用无coockie域名

27、减小Cookie体积

HTTP

coockie可以用于权限验证和个性化身份等多种用途。coockie内的有关信息是通过HTTP文件头来在web服务器和浏览器之间进行交流的。因此

保持coockie尽可能的小以减少用户的响应时间十分重要。

有关更多信息可以查看Tenni

Theurer和Patty Chi的文章“When the Cookie Crumbles”。这们研究中主要包括：

去除不必要的coockie

使coockie体积尽量小以减少对用户响应的影响

注意在适应级别的域名上设置coockie以便使子域名不受影响

设置合理的过期时间。较早地Expire时间和不要过早去清除coockie，都会改善用户的响应时间。

28、对于页面内容使用无coockie域名

当浏览器在请求中同时请求一张静态的图片和发送coockie时，服务器对于这些coockie不会做任何地使用。因此他们只是因为某些负面因素而创建的

网络传输。所有你应该确定对于静态内容的请求是无coockie的请求。创建一个子域名并用他来存放所有静态内容。

如果你的域名是http://www.example.org/，你可以在static.example.org上存在静态内容。但是，如果你不是在http://www.example.org/上而是在顶级域名example.org设置了coockie，那么所有对于static.example.org的请求都包含coockie。在这种情

况下，你可以再重新购买一个新的域名来存在静态内容，并且要保持这个域名是无coockie的。Yahoo!使用的是ymig.com，YouTube使

用的是ytimg.com，Amazon使用的是images-anazon.com等等。

使用无coockie域名存在静态内容的另外一个好处就是一些代理（服务器）可能会拒绝对coockie的内容请求进行缓存。一个相关的建议就是，如果你

想确定应该使用example.org还是http://www.example.org/作为你的一主页，你要考虑到coockie带来的影响。忽略掉www会使你除了把coockie设置到*.example.org（*是泛域名解析，代表

了所有子域名译者dudo注）外没有其它选择，因此出于性能方面的考虑最好是使用带有www的子域名并且在它上面设置coockie。

六、Image 部分

优化图像

优化CSS Spirite

不要在HTML中缩放图像

favicon.ico要小而且可缓存

29、优化图像

设计人员完成对页面的设计之后，不要急于将它们上传到web服务器，这里还需要做几件事：

你可以检查一下你的GIF图片中图像颜色的数量是否和调色板规格一致。

使用imagemagick中下面的命令行很容易检查：

identify -verbose image.gif

如果你发现图片中只用到了4种颜色，而在调色板的中显示的256色的颜色槽，那么这张图片就还有压缩的空间。

尝试把GIF格式转换成PNG格式，看看是否节省空间。大多数情况下是可以压缩的。由于浏览器支持有限，设计者们往往不太乐意使用PNG格式的图片，不过

这都是过去的事情了。现在只有一个问题就是在真彩PNG格式中的alpha通道半透明问题，不过同样的，GIF也不是真彩格式也不支持半透明。因此GIF

能做到的，PNG（PNG8）同样也能做到（除了动画）。下面这条简单的命令可以 安全地把GIF格式转换为PNG格式：

convert image.gif image.png

“我们要说的是：给PNG一个施展身手的机会吧！”

在所有的PNG图片上运行pngcrush（或者其它PNG优化工具）。例如：

pngcrush image.png -rem alla -reduce -brute result.png

在所有的JPEG图片上运行jpegtran。这个工具可以对图片中的出现的锯齿等做无损操作，同时它还可以用于优化和清除图片中的注释以及其它无用信息

（如EXIF信息）：

jpegtran -copy none -optimize -perfect src.jpg dest.jpg

30、优化CSS Spirite

在Spirite中水平排列你的图片，垂直排列会稍稍增加文件大小；

Spirite中把颜色较近的组合在一起可以降低颜色数，理想状况是低于256色以便适用PNG8格式；

便于移动，不要在Spirite的图像中间留有较大空隙。这虽然不大会增加文件大小但对于用户代理来说它需要更少的内存来把图片解压为像素地图。

100x100的图片为1万像素，而1000x1000就是100万像素。

31、不要在HTML中缩放图像

不要为了在HTML中设置长宽而使用比实际需要大的图片。如果你需要：

width="100" height="100" src="mycat.jpg"

alt="My Cat" />

那么你的图片（mycat.jpg）就应该是100x100像素而不是把一个500x500像素的图片缩小使用。

32、favicon.ico要小而且可缓存

favicon.ico是位于服务器根目录下的一个图片文件。它是必定存在的，因为即使你不关心它是否有用，浏览器也会对它发出请求，因此最好不要返回一

个404 Not Found的响应。由于是在同一台服务器上，它每被请求一次coockie就会被发送一次。这个图片文件还会影响下载顺序，例如在IE中当你在

onload中请求额外的文件时，favicon会在这些额外内容被加载前下载。

因此，为了减少favicon.ico带来的弊端，要做到：

文件尽量地小，最好小于1K

在适当的时候（也就是你不要打算再换favicon.ico的时候，因为更换新文件时不能对它进行重命名）为它设置Expires文件头。你可以很安全地

把Expires文件头设置为未来的几个月。你可以通过核对当前favicon.ico的上次编辑时间来作出判断。

Imagemagick可以帮你创建小巧的favicon。

七、 Mobile部分

保持单个内容小于25K

打包组件成复合文本

33、保持单个内容小于25K

这条限制主要是因为iPhone不能缓存大于25K的文件。注意这里指的是解压缩后的大小。由于单纯gizp压缩可能达不要求，因此精简文件就显得十分重

要。

查看更多信息，请参阅Wayne

Shea和Tenni Theurer的文件“Performance Research, Part 5: iPhone Cacheability -

Making it Stick”。

34、打包组件成复合文本

把页面内容打包成复合文本就如同带有多附件的Email，它能够使你在一个HTTP请求中取得多个组件（切记：HTTP请求是很奢侈的）。当你使用这条规

则时，首先要确定用户代理是否支持（iPhone就不支持）。

……（35、避免空的图像来源

在 二、服务器部分），

�i�F�%{