提高Web页面的性能
| 1. 尽可能的减少 HTTP 的请求数 | [content] |
| 2. 使用 CDN(Content Delivery Network) | [server] |
| 3. 添加 Expires 头(或者 Cache-control ) | [server] |
| 4. Gzip 组件 | [server] |
| 5. 将 CSS 样式放在页面的上方 | [css] |
| 6. 将脚本移动到底部(包括内联的) | [javascript] |
| 7. 避免使用 CSS 中的 Expressions | [css] |
| 8. 将 JavaScript 和 CSS 独立成外部文件 | [javascript] [css] |
| 9. 减少 DNS 查询 | [content] |
| 10. 压缩 JavaScript 和 CSS (包括内联的) | [javascript] [css] |
| 11. 避免重定向 | [server] |
| 12. 移除重复的脚本 | [javascript] |
| 13. 配置实体标签(ETags) | [css] |
| 14. 使 AJAX 缓存 | [content] |
详细请看:Best Practices for Speeding Up Your Web Site
如果具体想看下你网站在这14条规则下的表现,可以用 Yahoo 开发的 YSlow 工具(Firefox 下 FireBug 的插件)。
-----------------
最近 Yahoo! Exceptional Performance 在 《优化网站性能的 14 条规则》的基础上又增加了 20 条新的规则。
| 1. 尽早清除缓冲区 | [server] |
| 2. AJAX 请求使用“GET”方法 | [server] |
| 3. 延迟加载组件 | [content] |
| 4. 预加载组件 | [content] |
| 5. 减少 DOM 元素的数量 | [content] |
| 6. 跨域分离组件 | [content] |
| 7. 减少 iframes 的数量 | [content] |
| 8. 不出现 404 | [content] |
| 9. 减小 cookie 的体积 | [cookie] |
| 10. 为组件使用 cookie-free 的域名 | [cookie] |
| 11.减少访问 DOM 的次数 | [javascript] |
| 12. 开发巧妙的事件处理程序 | [javascript] |
| 13. 优先选择使用 <link> 而非 @import | [css] |
| 14. 避免使用 filters | [css] |
| 15. 优化图片 | [images] |
| 16. 优化 CSS sprites | [images] |
| 17. 不要在 HTML 中缩放图片 | [images] |
| 18. 减小 favicon.ico 的体积并缓存 | [images] |
| 19. 保持组件在 25K 以下 | [mobile] |
| 20. 将组件分拆到多个文档中 | [mobile] |
更详细具体的介绍内容可看 Stoyan Stefanov 的 PPT:《High Performance Web Pages》
共1条评论
很有用的文章,收藏了