好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

网站前后端性能优化(网摘)

1. 减少http请求数
合并文件,通过把所有脚本置于一个脚本文件里或者把所有样式表放于一个样式表文件中,从而减少Http请求的数量。
CSS Sprites是减少图片请求的首选方案。把所有的背景图片合并到一张图中,使用CSS的background-image 和background-position 属性去控制展现恰当的图片区域。
内联图片使用data: URL scheme 把图片数据嵌入页面,但这会增加Html文档的大小。
2. 使用内容分布式网络
内容分布式网络(CDN)是一系列分布在不同地域的服务器的集合,能够更有效的给用户发送信息。它会根据一种衡量网域距离的方法,选取为某个用户发送数据的服务器。比如,到达用户最少跳或者最快相应速度的服务器会被选中。
3. 给头部添加一个失效期或者Cache-Control
对于静态组件:把头部的缓存期设为某个遥远的未来,使其能够[永不过期]。
对于动态组件:使用适当的Cache-Control头部帮助浏览器执行特定的请求。
4. Gzip压缩组件
在HTTP请求的头部中Accept-Encoding指定的压缩格式:
ν Accept-Encoding: gzip, deflate
ν Content-Encoding: gzip
5. 把样式表放在前面
把样式表挪到文档的头部可以让页面的加载显得更快。因为把样式表放在头部可以让页面逐步呈现。
6. 把脚本放在最后
脚本可能会堵塞并发的下载。HTTP/1.1规范建议浏览器在每个域名下只进行两个并发下载。
设置延迟加载脚本,也可以放在页面底部
7. 不使用CSS表达式
CSS表达式是一种有力的(同时也很危险的)动态设置CSS属性的方法。

CSS表达式的问题是它比大多数人期望的执行次数更频繁。表达式不仅仅在页面展现和重新设置大小的时候执行,在页面滚动,甚至用户在页面上挪动鼠标时都会执行。给CSS表达式添加一个计数器可以跟踪CSS在什么时候和怎样执行。在页面上移动鼠标可以轻易的产生一万次以上的执行。
8. 使用外部的JavaScript和CSS
在实际应用中使用外部的文件往往产生更快的页面,因为浏览器会缓存JavaScript和CSS文件。如果放在外部文件里的JavaScript和CSS被浏览器缓存,则既不用增加HTTP请求的数量,HTML文档的体积也会减少。
9. 减少DNS的查询
DNS查找给定域名的IP地址一般会耗费20-120毫秒。在DNS查找结束前,浏览器不会从目标域名那里下载任何东西。

10. 缩小JavaScript和CSS

缩小是指从代码中删除不必要的字母,减少文件体积从而提高加载速度。

缩减代码时需要移除所有的注释,以及不需要的空白(空格,新行和tab)。

减小js或css文件的大小,提高响应的性能。

代码混淆是另一个可用于源代码的优化方案。

压缩内嵌在页面中的 和 代码。

11.避免重定向

301响应的HTTP头的例子:

 HTTP/1.1 301 Moved Permanently
Location: http://example.com/newuri
Content-Type: text/html  

查看更多关于网站前后端性能优化(网摘)的详细内容...

  阅读:35次