【转载】高性能网站建设

第一章 减少HTTP请求

  • 使用图片地图:当导航栏包含多张图片时,可以将其合并成一张图片,再通过计算位置触发不同的链接
  • CSS sprites:将图标合并,引入一张背景图,通过CSS控制其位置
  • 内联图片:将图片编码后再放到data后面。可用PHP的base64_encode对图片文件进行编码。
  • 合并脚本和样式文件:理想情况下一个页面一个CSS文件

第二章 使用CDN(Content Delivery Networks)

CDN是指内容分发网络 CDN的做法是指将组建分布到其他服务器上 缺点:

  • 响应时间可能会受到其他网站的影响
  • 无法直接控制组件服务器所带来的特殊麻烦
  • 工作度量会随CDN性能下降所影响

第三章 为组件添加长的Expires头

Expires 属性设置页面在失效前被缓存的时间。如果用户在页面失效前返回同一页面,缓存的版本将显示出来。

第四章 压缩脚本和样式表

通过压缩文件从而减少HTTP响应大小来减少响应时间

第五章 将样式表放在顶部

将样式表放在页面顶部加载可以保证页面基本内容的呈现

第六章 将脚本文件放在底部

将脚本放在底部加载可以实现页面的逐步呈现和提高下载的并行度。

如果脚本使用document.write向页面中插入内容,就不能将其移动到页面中靠后的位置。但是如果一个脚本可以延迟加载,那么它一定可以移到页面底部加载。

第七章 避免CSS表达式

CSS表达式是动态设置CSS属性的强大(但危险)方法。 如使用CSS表达式可以实现隔一个小时切换一次背景颜色:

background-color: expression((new Date()).getHours()%2?"#FFFFFF": "#000000" );

表达式的问题在于对其进行的求值频率比人们期望的高。它们不只在页面呈现和大小改变时求值,当页面滚动、甚至用户鼠标在页面上移过时都要求值。 如果一定要使用CSS表达式,有两种技术可以避免CSS表达式产生这一问题: > * 创建一次性表达式 > * 使用事件处理器取代CSS表达式

第八章 使用外部的Javascript和CSS

如果你的网站的本质上能够为用户带来高完整缓存率,使用外部文件的收益就更大。如果不大可能产生完整缓存,则内联是更好的选择。 如果你的网站中的每个/很多页面都使用了相同的Javascript和CSS,使用外部文件可以提高这些组件的重用率。

第九章 减少DNS查找

Internet是通过IP地址来查找服务器的。由于IP地址很难记忆,通常使用包含主机名的URL来取代它,但当浏览器发送其请求时,IP地址仍然是必需的。这就是DNS(Domain Name System)所处的角色。DNS将主机名映射到IP地址上,就像电话本将人名映射到他们的电话号码一样。当你在浏览器中键入github.com时,连接到浏览器的DNS解析器就会返回服务器的IP地址。

DNS查找可以被缓存起来以提高性能

第十章 精简JavaScript

精简是从代码中移除不必要的字符以减小文件大小,进而改善加载时间的实践。在代码被精简后,所有的注释以及不必要的空白字符(空格、换行和制表符)都将被移除。对于JavaScript而言,这可以改善响应时间效率,因为下载的文件大小减小了。

第十一章 避免重定向

重定向用于将用户从一个URL重新路由到另一个URL。 在重定向完毕并且HTML文档下载完毕之前,没有任何东西显示给用户。 重定向会使你的页面变慢

给URL的结尾添加斜线”/”

第十二章 移除重复脚本

  • 在页面中多次包含相同的脚本会使页面变慢
  • 在IE中,如果脚本没有被缓存,或在重新加载页面时,会产生额外的HTTP请求
  • 在Firefox和IE中,脚本会被多次求值

第十三章 配置或移除ETag

实体标签(Entity Tag,ETag),是Web服务器和浏览器用于确认缓存组件的有效性的一种机制。

第十四章 使Ajax可缓存

确保Ajax请求遵守性能指导,尤其应具有长久的Expires头。

 

转:http://www.cnblogs.com/h-hq/p/4756865.html

posted @ 2016-06-14 19:57  panie2015  阅读(137)  评论(0编辑  收藏  举报