著名的“雅虎”34条优化网页#军规 |【毋庸置疑的巨人】
本帖最后由 不二如是 于 2017-7-24 19:30 编辑曾经的一家独大的王者,而今日暮西山~
互联网的世界就是如此残酷真实!
百足之虫死而不僵,雅虎为后人留下了很多宝贵的财富。
感叹两句
站在巨人的肩膀上,迭代优化自己!
1.Minimize HTTP Requests
减少HTTP请求
图片、css、script、flash等等这些都会增加http请求数,减少这些元素的数量就能减少响应时间。
把多个JS、CSS在可能的情况下写进一个文件。
页面里直接写入图片也是不好的做法,应该写进CSS里。
利用 CSS sprites 将小图拼合后利用background来定位。
2.Use a Content Delivery Network
利用CDN技术
CDN的全称是Content Delivery Network,即内容分发网络。
其基本思路是尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节,使内容传输的更快、更稳定。
通过在网络各处放置节点服务器所构成的在现有的互联网基础之上的一层智能虚拟网络。
CDN系统能够实时地根据网络流量和各节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上。
其目的是使用户可就近取得所需内容。
解决 Internet网络拥挤的状况,提高用户访问网站的响应速度。
3.Add an Expires or a Cache-Control Header
设置头文件过期或者静态缓存
查询浏览器缓存的原理
浏览器会用缓存来减少http请求数来加快页面加载的时间,如果页面头部加一个很长的过期时间。
浏览器就会一直缓存页面里的元素。
不过这样如果 页面里的东西变动的话就要改名字了,否则用户端不会主动刷新,看自己衡量了~
这项可以通过修改.htaccess文件来实现。
4.Gzip Components
Gzip压缩Apache
Gzip格式是一种很普遍的压缩技术,几乎所有的浏览器都有解压Gzip格式的能力。
而且它可以压缩的比例非常大,一般压缩率为85%。
压缩没压缩,可以到 这里 做下测试。
5.Put Stylesheets at the Top
把CSS放顶部
让浏览者能尽早的看到网站的完整样式。
6.Put Scripts at the Bottom
把JS放底部
网站呈现完毕后再进行功能设置,当然这些JS要在你的加载过程中不影响内容表现。
7.Avoid CSS Expressions
避免CSS Expressions
CSS表达式很可怕,这个只被IE支持的东西执行时候的运算量非常大。
你移动一下鼠标它都要进行重计算的,但有时候为了做浏览器的兼容必须要用到这:
IE6去死去死!~
8.Make JavaScript and CSS External
将JS和CSS外链
前面讲到了缓存这个事情,一些较为公用的JS和CSS,我们可以使用外链的形式。
譬如我就是从Google外链来的Jquery文件,如果我的浏览者在浏览别的使用了这个外链文件的网站时已经下载并缓存了这个文件,那么他在浏览我的网站的时候就不需要再进行下载了!
9.Reduce DNS Lookups
减少DNS查找
貌似是要减少网站从外部调用资源,我的Google分析和picasa的外链图片都算在里面了。
10.Minify JavaScript and CSS
减小JS和CSS的体积
写JS和CSS都是有技巧的,用最少的代码实现同样的功能。
减少空白,增强逻辑性,用缩写方式等等,当然也有不少工具也能够帮你实现这一点。
11. Avoid Redirects
避免重定向
再写入链接时,虽然”http://www. today-s-ooxx. com”和”http://www. today-s-ooxx. com/” 仅有一个最后的”/”只差。
但是结果是不同的,服务器需要花时间把前者重定向为后者然后进行跳转。
这个要自己注意,也可以在Apache里用Alias 或者mod_rewrite或者DirectorySlash解决。
12. Remove Duplicate Scripts
删除重复代码
重复调用的代码浏览器并不会识别忽略,而是会再次运算一遍,这当然是大大的浪费。
13. Configure ETags
配置ETags
搞不清楚咋回事,总之是在. htaccess里把它删除了。
14. Make Ajax Cacheable
缓存Ajax 几种缓存方式
Ajax是实时响应的,在浏览器接收到新的数据前。
旧的数据被缓存,这样能够更好的提高效率。
15. Flush the Buffer Early
尽早的释放缓冲
当用户进行页面请求时,服务器端需要花费200到500毫秒时间来拼合HTML。
将写在head与body之间,释放缓冲。
这样可以将文件头先发送出去,然后再发送文件内容,提高效率。
16. Use GET for AJAX Requests
用GET方式进行AJAX请求
Get 方法和服务器只有一次交互(发送数据)。
而 Post 要两次(发送头部再发送数据)。
17. Post-load Components
延迟加载组件
最先加载必须的组件进行页面初始化,然后再加载其他。
YUI Image Loader 是很好的例子。
**** Hidden Message *****
页:
[1]