1 / 2
文档名称:

web前端优化.doc

格式:doc   大小:20KB   页数:2页
下载后只包含 1 个 DOC 格式的文档,没有任何的图纸或源代码,查看文件列表

如果您已付费下载过本站文档,您可以点这里二次下载

分享

预览

web前端优化.doc

上传人:drp539605 2019/6/27 文件大小:20 KB

下载得到文件列表

web前端优化.doc

文档介绍

文档介绍:根据yahoo的经验,web前端性能的优化,应该有下面几条:1、减少http请求(1)尽量将图片放在一个大图片里面。(2)使用3-4个js脚本和1-2个样式表,全部集合在一个文件的话,不方便管理。2、使用内容发布网络(CDN)CDN是指一组分布在多个不同地理位置的web服务器,用于更加快速有效的向用户发布内容。3、添加expires头(1)expires的局限因为他使用了一个特定的时间,它要求服务器和客户端的时间严格同步,过期时间也需要经常检查,-control头来克服以上问题,(也许没有),所以推荐两个都设置,好像apache的ExpiresDefault支持这个功能(2)缓存时间Html文档不应该使用长久的缓存时间,因为它包括动态内容,推荐一个星期以内的时间;图片,css,脚本推荐缓存30天以上(3)缓存后的更新问题假设您已经设置了缓存,你很快会发觉,你假设上传了一个css样式,刷新后没有变化……高手也许会ctrl+F5,像我这样的菜鸟也许狂按F5都没有用……这个时候,您应该在您的css文件后面加上一段版本号,?,也能实现版本控制(建议css,js路径用php变量保存)。(4)如果没有缓存如果您没有一个长久的expires头,浏览器仍然会存储在它的缓存里面,只是在后续的请求中,它会发送一个get请求,如果没有变化,服务器会发送一个很小的头(304NotModified),告诉浏览器仍然可以使用它自己缓存的文件,这些请求加起来,其实也是蛮可观的,我们还是能省就省4、压缩(1)开启地球人都知道的gzip,我个人不是很推荐压缩图片,因为图片基本上都是已经压缩过的,尤其是jpg格式,这种已经是严重损失压缩方式保存。(2)考虑使用一个打包工具发布js和css,输出的css和js是删除换行,注释后的,本地代码是未格式化的(我有个java版,代码还未研究,有待跟进)。5、样式表放在页面顶部使用css时,页面逐步呈现会被阻止,直到css下载完毕,所以推荐把css放在页面顶部,这样能够使浏览器的内容逐步显示,而不是白屏,然后突然全部都显示出来了。6、js脚本推荐放在页面底部    js跟css刚好相反,使用js时,对于js以下的内容,逐步呈现都会被阻止,js越靠下,意味着越多的内容能够逐步显示。7、并行下载    对响应时间影响比较大的是页面中请求的数量,浏览器不能一次将所有的请求都下载下来,……这个规范建议浏览器从每个主机名并行地下载两个请求。不过并不是过多的命名域名就能加快速度,过多的域名会增加dns查找的负担。一般推荐2个不同的域名即可。8、不要使用css的expression这个东西看起来好像能在css里面写js,实质是当鼠标移动的时候都要求值,这个求值的频率太高,浏览器很容易死掉。9、减少DNS查找    浏览器查找一个给定主机名的ip地址大概要花费20-120毫秒(web资料),响应时间依赖DNS解析器所承担的请求压力。10、