织梦CMS - 轻松建站从此开始!

天府星空

当前位置: 主页 > 网页设计 > 建站经验 >

高性能网站建设的14个原则_网站建设

时间:2012-11-06 21:55来源:未知 作者:admin 点击:
为你的站点提供多种线路(例如海内电信、联通、挪动)、多个地舆地位(北方、南方、西部)的访问,使得所有用户都可能疾速拜访。 Ajax是异步请求,异步请求不会梗阻你当初的操作,而且当请求完成时,你立刻就可以看到成果。但异步不代表可以刹时完成,也不代

为你的站点提供多种线路(例如海内电信、联通、挪动)、多个地舆地位(北方、南方、西部)的访问,使得所有用户都可能疾速拜访。

Ajax是异步请求,异步请求不会梗阻你当初的操作,而且当请求完成时,你立刻就可以看到成果。但异步不代表可以刹时完成,也不代表能够容忍它花无穷多的时间完成。因此对于Ajax请求的性能也需要器重。有许多Ajax请求访问的是一些相对稳定的资源,因此别忘了对Ajax请求应用好HTTP Cache机制,详细参见原则3、13。

1) 雷同资源在不同服务器上盘算出来的ETag不一样,而大型Web利用通常由不止一台服务器供给服务,这就导致客户端在服务器A缓存好的资源明明依然有效,而在下次请求B时因为ETag不同而被认定为生效,导致相同资源的重复传输。

1. 使用Keep-Alive坚持衔接

原则12 移除重复的脚本

本书另有对其中个别问题深刻探索的进阶篇《Even Faster Web Sites》,中译《高性能网站建设进阶指南》。

2. CSS Sprite(CSS贴图整合/贴图拼合/贴图定位)

原则3 利用HTTP Cache

2. 减少域名

一次重定向象征着在你真正访问到想要看到的页眼前参加了一轮额外的HTTP请求(客户端发起HTTP请求→HTTP服务器返回重定向响应→客户端对新URL发动请求→HTTP服务器返回内容,下划线部门为额定的请求),因此消费更多的时间(也就给人反映更慢的感觉)。因此除非必要,不要随便使用重定向。多少个“必要”的情况:

通过设置<img>标签的usemap属性与使用<map>标签可以在一幅图片上切分出多个区域,指向不同的链接。比起使用多幅图片分辨结构链接减少了请求数。

原则11 尽量避免重定向

原则4 使用Gzip压缩

每次要求新域名都须要进行通过DNS查找不同的域名,且DNS缓存无奈施展作用。因而应当尽量将站点组织在一个同一域名下,防止使用过多子域名

使用Gzip压缩HTTP报文,减小体积,减少传输时光。

在<img>的src中不指定外部图片文件的URL,而是直接将图片信息放入。例如src="data:image/gif;base64,R0lGODlhDAAMAL..."某些特别情形下有用(例如一个不大的图片仅在当前页面用到)。

原则5 将样式表置于页面前部

不要在一个页面中重复引入相同的脚本。例如脚本B和C都依附于A,那么在使用了B和C的页面中就有可能存在对A的重复引用。解决方式,对于简略的站点手动检讨依赖性,消去重复引入;对于复杂的站点则需要构建本人的依赖治理/版本把持机制。

这仿佛与原则1中的合并思维相悖,但实在不然:斟酌每个页面都引入了一个公共的JavaScript资源(例如jQuery或是ExtJS这样的JavaScript库),单就一个页面的表示来看,内联(行将JavaScript嵌入HTML)页面将比外联(使用<script>标签引入)页面加载更快(由于其较少的HTTP恳求数)。但假如有良多页面都引入了这个公共JavaScript资源,那么内联计划会造成反复传输(因为这个资源内嵌在每个页面中了,所以每次翻开一个页面都要将这局部资源传输一遍,从而造成网络传输资源的挥霍)。而将这种资源独破出来外联援用能够解决这个问题。

1. 不一致:不同Web服务器(Apache, IIS等)定义的ETag格局不同

压缩版jQuery代码(用于实际安排),89.4KB

-->

1. 避免URL失效

2) 资源不变,而由于一些其余因素的变化,例如配置文件更改,导致ETag变更。直接成果是系统更新后客户端大范围产生Cache失效,导致传输量大增,站点性能降落。

应用JS紧缩工具压缩你的JavaScript吧,很有效哦。看看jQuery的两个不同的发行版本就晓得差别了:

在可读性好的URL与实际资源URL之间转换,例如对于Google Toolbar,用户记得住

这本书中给出了14条网站性能晋升的原则,每个原则独立成章,配有示例。这些原则大多数都十分适用,合适站点架构师、前端工程师。其中对前端工程师的意思更大一些。

原则14 在Ajax中利用HTTP Cache

准则9 减少DNS查找

起因同5,先处理页面显示,页面渲染较早实现,而脚本逻辑稍后履行,这样给用户页面加载较快的感觉。

1. Image Map

原则10 压缩你的JavaScript

原则7 避免使用CSS表白式

因为JavaScript跟CSS绝对稳固,咱们可以对其对应的资源设置较长的失效期(参考原则3)。

2. ETag的计算是不稳定的(由于考虑过多因素),例如:

3. Inline Image(内联图片)

如果连接断开,那么下次连接又要执行DNS查找,即便对应的域名-IP映射已被缓存,查找也是要耗费一些时间的

原则13 警惕处理ETag

本日大抵阅读了一下《High Performance Web Sites》。本书的中文版是《高机能网站建设指南》。

原则2 利用多线路CDN

原则6 将脚本置于页面尾部

过于庞杂的JavaScript脚本逻辑、DOM查找、抉择操作将会下降页面处置效力。

作者给出的提议是:要么依据你的运用特色改良已有的ETag计算办法,要么罗唆就不必ETag,而改用最简单的Last-Modified。

2. URL丑化

通过设置元素的background-position样式做到。个别用于界面图标。典范的可以参考TinyMCE编纂器上方的那些小按钮。多个小图本质是从一个统一的大图通过不同的偏移量裁剪而来,这样加载界面上的众多按钮实际上只有请求一次(请求大图一次),从而减少HTTP请求数。

给不频繁更新的资源(例如静态图)加较长的Expires头信息,这些资源一经缓存,将来很长时间都可以不再重复传输了。

原则1 减少HTTP请求数

旧站点迁徙后,为了避免旧的URL失效,通常将对旧URL的请求重定向至新体系的对应地址。

这次看的是原版。我对于Web开发较缺少实际教训,加之看得匆仓促,因此可能存在漏掉、表述不当之处,盼望宽大网友不吝斧正。

作者给出的倡议是:

作者先容上面的豆瓣链接中有,就不再照搬过来了。

先加载款式表,这样页面渲染得以较早开端,给用户页面加载较快的感到。

原则8 将JavaScript与CSS作为外联资源

ETag是除Last-Modified之外的另一种HTTP Cache手腕。通过hash的措施辨识资源是否被修正。但ETag存在一些问题,例如:

浏览版jQuery代码,230KB

构造请求、等候响应需要时间,因此请求数目越少越好。减少请求的总体思路就是合并资源,减少显示一个页面需要的文件数。

相关的主题文章: (责任编辑:admin)
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
验证码: 点击我更换图片