Web前端优化(已读)

Web前端优化(已读)

ID:45591159

大小:5.66 MB

页数:27页

时间:2019-11-15

Web前端优化(已读)_第1页
Web前端优化(已读)_第2页
Web前端优化(已读)_第3页
Web前端优化(已读)_第4页
Web前端优化(已读)_第5页
资源描述:

《Web前端优化(已读)》由会员上传分享,免费在线阅读,更多相关内容在行业资料-天天文库

1、WEB前端优化2010-12-25目录关于Web01优化对比分析03怎么优化04为什么需要优化02目录关于Web01优化对比分析03怎么优化04为什么需要优化02关于WebWeb是新媒体,它来自印刷,印刷的技巧,设计及惯例对Web影响巨大。那些“杀手级网站”常常是那些对Web的野性加以驯服,让页面中规中矩就象它们也是纸张一样的网站,也就是桌面印刷版的Web。这种风尚很自然,但我们需要前进,让Web成为它自己的媒体,拥有自己的天性。关于Web—核心价值互联网用户及市场信息服务商InternetUser

2、&MarketingInformationProvider市场信息互联网用户监测分析发现监测终端用户访问体验分析运维及服务的表现发现运营者的优化策略监测截获的访问流量分析市场表现及发展动态发现市场商机目录关于Web01优化分析03怎么优化04为什么需要优化02为什么需要优化决策层市场部门客户服务技术部门:我在外地出差,为什么无法访问网站?技术部门:为什么我们网站速度比竞争对手差?技术部门:用户投诉网站页面打开太慢所有问题归结于技术部门为什么需要优化时间花哪里去了?13.7/729.4=1.88%为什

3、么需要优化时间花哪里去了?26.5/543.1=4.88%为什么需要优化时间花哪里去了?大量的HTTP请求只有10%-20%的最终用户响应时间花在了下载html文档上,其余80%-90%时间花在了下载页面的相关组件上。如:图片、Flash为什么需要优化时间花哪里去了?为什么需要优化时间花哪里去了?在请求脚本时不发生并行请求脚本的加载是按顺序串行加载的浏览器在下载脚本时会阻塞额外的http请求目录关于Web01优化对比分析03怎么优化04为什么需要优化02优化对比分析可以提高用户体验:5%——10%增

4、加投入,建设CDN,提高不同区域访问静态内容的加速效果救火角色,针对不同部门反应的问题临时解决网络问题增加投入,提高网络层指标(DNS,建立连接时间,首包时间等)设备优化优化对比分析内容优化在不减少内容的情况下,优化结构代码优化首屏时间内的对象数控制页面每个元素(图片,Javascript,CSS等)其他内容优化手段可以提高用户体验:40%——50%目录关于Web01优化对比分析03怎么优化04为什么需要优化02怎么优化只有10%-20%的最终用户响应时间花在了下载html文档上,其余80%-90%

5、时间花在了下载页面的相关组件上。1减少http请求2缓存3减少文件大小怎么优化(1)减少HTTP请求合并文件将多个CSS文件或Javascript文件合并成一个图片地图在一个图像上划分不同区域映射不同的链接内联图像让图像与文本一起下载和显示CSSSprites利用CSSbackground相关元素进行背景图绝对定位怎么优化(2)缓存怎么优化(3)减少文件大小压缩Javascript和CSS文件1优化代码2怎么优化(3)减少文件大小—优化代码去除不必要的html标签:a.

6、table>

b. margin或者padding、letter-spacing避免内联式样式:
cssstyleCSS代码优化:a..color1{color:Red;} .color2{color:Red;}.color1,.color2{color:Red;} b..style1{border-left:solid1px#112233;border-right:solid1p

7、x#112233;border-top:solid1px#112233;border-bottom:solid1px#112233;}.style1{border:solid1px#112233;}c.#ffffff#fff;#66aa00#6a0d.0px;0pt0怎么优化(4)将样式表放在顶部css,全称CascadingStyleSheets (层叠样式表单)。层叠即意味这后面的css可以覆盖前面的css,级别高的css可以覆盖级别低的css。既然前面的可以被覆盖,浏览器在他完全加载完

8、毕之后再去渲染无疑也是合情合理的很多浏览器下,所以我们应该尽快让css加载完毕.把样式表放在页面的底部的问题在于它禁止了网页内容的顺序显示。浏览器阻止显示以免重画页面元素,那用户只能看到空白页了。不会阻止显示,但这意味着当样式表下载后,有些页面元素可能需要重画,这导致闪烁问题怎么优化(4)将script放在底部1、因为防止script脚本的执行阻塞页面的下载。2、脚本引起的第二个问题是它阻塞并行下载数量。怎么优化(5)减少DNS查询在Internet上域名与IP地址之

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。