web网页性能优化参考

《web网页性能优化参考》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、WEB网页性能优化参考v1.02011年12月WEB网页性能优化参考V2.0北京八度互联科技有限公司Copyright©2005-2011http://www.17guagua.com北京八度互联科技有限公司第10页WEB网页性能优化参考v1.02011年12月目录第1章修改记录2第2章文档说明3§2.1阐述3§2.2说明3第3章GooglePageSppeed分析4§3.1分析4§3.2优化图片5§3.3使用浏览器缓存5§3.4将图片组合为css贴图定位6§3.5内嵌小型javascript和css7§3.6压缩javascript、css7§3.7暂缓javascript解析7

2、§3.8将查询字符串从静态资源中删除8§3.9Favicon.ico要小而且尽量可缓存8§3.10禁用CSS滤镜、iefilter、iframe8第4章总结9第5章规范建议9北京八度互联科技有限公司第10页WEB网页性能优化参考v1.02011年12月第1章修改记录A－增加*M－修改*D－删除版本日期作者说明1.02011-12-22李博A12.02012-04-26李博M1A1：初稿M1：1-4章为1.0版本输出，2.0结合对官网优化经验，进行详细阐述，最终形成可执行操作手册。北京八度互联科技有限公司第10页WEB网页性能优化参考v1.02011年12月第1章文档说明§1.1阐述

3、Google过去数年的测试表明，即使网页性能只有小幅度的改进，也会拉动用户大幅度增加，好的网页体验可以留住用户，同样好的网页性能可以给我们的产品锦上添花，本文档通过GooglePageSpeed对官网http://www.17guagua.com。进行分析举例、阐述目前业界对网页性能优化的关注点。§1.2说明lGooglePageSpeed：一款在线应用可以分析网页的缺陷，并提出建议lcss贴图定位：专业名称CSSSprites，在国内很多人叫css精灵。是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去，这样一来，当访问该页面时，载入的图片就不

4、会像以前那样一幅一幅地慢慢显示出来了北京八度互联科技有限公司第10页WEB网页性能优化参考v1.02011年12月第1章GooglePageSppeed分析§1.1分析通过对GooglePageSpeed分析，共得出7个建议，分别为优化图片、使用浏览器缓存,、将图片组合为CSS贴图定位、内嵌小型JavaScrip和css、压缩JavaScript，css、暂缓JavaScript解析、将查询字符串从静态资源中删除、favicon.ico要小而且可缓存、禁用css滤镜，IEfilter，iframe。图-1北京八度互联科技有限公司第10页WEB网页性能优化参考v1.02011年12月

5、§1.1优化图片将图片进行无损压缩既能不损失图片的美感而且又能压缩图片的大小。我们首页的焦点图一般比较大，可以进行图片的专业处理。减小图片体积大小。优化以下图片可腾出的空间大小为1,013.3KiB（即缩减50%）。§1.2使用浏览器缓存一些图片没有使用缓存，导致每次都要重新请求服务器。如iguagua.net。我们可以将一些改变频率很小的资源进行长时间的缓存。北京八度互联科技有限公司第10页WEB网页性能优化参考v1.02011年12月§1.1将图片组合为css贴图定位将多个小图片整合到一张大图上去，这样降低了请求次数，不会出现一张一张的显示的情景。当然这需要美术方面配合（会增加

6、美术方面的工作量）。北京八度互联科技有限公司第10页WEB网页性能优化参考v1.02011年12月§1.1内嵌小型javascript和css虽然js、css建议放到外部文件中，但是加载的时候会有些阻塞。一些非常短小的javascript、css其实可以内嵌在网页中。§1.2压缩javascript、css启用gzip压缩和实际压缩物理文件可以增加网络传输速度。目前CSS压缩工具有PageSpeed、YUICompressor；JS压缩工具有中JSMIn、PageSpeed、YUICompressor、JavaScriptCompressor；§1.3暂缓javascript解析载

7、入初始网页时已解析67.7KiB的JavaScript。请暂缓解析JavaScript以减小网页显示时出现堵塞的概率。北京八度互联科技有限公司第10页WEB网页性能优化参考v1.02011年12月§1.1将查询字符串从静态资源中删除§1.2Favicon.ico要小而且尽量可缓存favicon.ico是位于服务器根目录下的一个图片文件。它是必定存在的，因为即使你不关心它是否有用，浏览器也会对它发出请求，因此最好不要返回一个404NotFound的响应。文件尽量地小，最