35网站服务器,35网站首页全方位优化过程分享

CSS

CSS项包括：将CSS放置到顶部、避免使用CSS中的Expressions、将JS和CSS外置(关闭项)、压缩JS和CSS、删除重复脚本和样式、避免使用过滤器。

评分都是A，就不深入了，顺带说下避免使用CSS 的Expressions，主要是因为当需要渲染的元素很多的时候，会照成卡死的现象，资源消耗极大。另外如果使用透明效果，尽量避免使用过滤器，需要的话可以直接使用PNG8代替。

Images

站点图片项包括：不要直接在HTML中缩放图片、长时间缓存浏览器ICON并优化到1K以下；

以上两项没问题，另外还有两项：一个就是CSS SPRITE的使用，另一个就是PNG8格式的使用；

关于CSS SPRITE的好处，这个在网上已经有很多文章，这里就不再详细描述。

推荐一个合并png并自动生成css代码的站点：http://csssprites.com/

JS

通过上面的图片可以看到网站JS出现的问题就是，我们没有把JS放在页面的最底部，和没有压缩js的大小。在页面载入的时候遵循从上到下的载入机制，JS的放在页面的最后可以有效的减少载入页面的速度。所以我们把JS搬到页面的最后(body的前面)同时我们也对JS进行压缩，去掉不必要的注释、换行符等等。

Sever

最后这块是主要是针对服务器配置的优化。从上面的图标中可以看问题的重点出在CDN、Expires、GZIP压缩还有Etags。这几个都是涉及到服务器的配置问题，也是问题最大的一块。CDN从技术上全面解决由于网络带宽小、用户访问量大、网点分布不均等原因所造成的用户访问网站响应速度慢的问题。Expires设置过期时间，最大限度的引导浏览器使用缓存的信息。减少下载量。GZIP是对网站文件进行压缩，然后在浏览器进行解压。减少文件在网络传输的大小。

经过以上所有优化工作之后，我们再来看看站点的评分：评价从原本的D级上升到了B级，总得分为81分(我们：o~Yeah~！)，页面元素缩减后剩下12个，总大小为116.7K。

最后，我们总结下这次影响到页面性能的主要问题和优化经验：

• 页面的总元素数：我们应该尽量减少页面的元素，能公用或合并的元素，全部统一共用或合并。

• 是否利用了缓存：缓存是一个我们平时很容易忽略的东西，起用缓存能大大的提升我们页面的访问效率。

• 文本对象是否进行了压缩：文件对象的大小直接影响到文件的下载速度。不论是图片，CSS，还是JS我们都应该尽量的减小体积。

• 是否有大量的并发阻塞出现：由于IE限制了并发数的量(默认并发数为2)所以大量的并发数必然导致访问阻塞。应该尽量减少。

通过以上方法我们的网站性能已经有明显提高(有没有很快？：D)，但是仍旧有相当多的提升空间，我们将继续努力并争取达到A级评价(超过Yahoo：D)，感谢大家观看，谢幕~~~！