1. 尽量减少 HTTP
请求 (Make Fewer HTTP
Requests)
作为第一条,可能也是最重要的一条。根据 Yahoo! 研究团队的数据分析,有很大一部分用户访问会因为这一条而取得最大受益。有几种常见的方法能切实减少 HTTP
请求:
2. 减少 DNS
查找 (Reduce DNS
Lookups)
必须明确的一点,DNS 查找的开销是很大的。另外,我倒是觉得这是 Yahoo! 所有站点的通病,Yahoo!主站点可能还不够明显,一些分站点,存在明显的类似问题。对于国内站点来说,如果过多的使用了站外的 Widget ,也很容易引起过多的 DNS
查找问题。
3. 避免重定向 (Avoid Redirects)
不是绝对的避免,尽量减少。另外,应该注意一些不必要的重定向。比如对 Web 站点子目录的后面添加个 / (Slash)
,就能有效避免一次重定向。http://www.dbanotes.net/arch 与 http://www.dbanotes.net/arch/
二者之间是有差异的。如果是 Apache 服务器,通过配置 Alias 或mod_rewrite 或是 DirectorySlash 能够消除这个问题。
4. 使得 Ajax 可缓存 (Make Ajax Cacheable)
响应时间对 Ajax 来说至关重要,否则用户体验绝对好不到哪里去。提高响应时间的有效手段就是 Cache 。其它的一些优化规则对这一条也是有效的。
5. 延迟载入组件 (Post-load Components)
6. 预载入组件 (Preload Components)
上面两条严格说来,都是属于异步
这个思想灵活运用的事儿。
7. 减少 DOM
元素数量 (Reduce the Number of DOM
Elements)
8. 切分组件到多个域 (Split Components Across Domains)
主要的目的是提高页面组件并行下载能力。但不要跨太多域名,否则就和第二条有些冲突了。
9. 最小化 iframe 的数量 (Minimize the Number of iframes)
熟悉 SEO
的朋友知道 iframe 是 SEO
的大忌。针对前端优化来说 iframe 有其好处,也有其弊端,一分为二看问题吧。
10. 杜绝 http 404 错误 (No 404s)
对页面链接的充分测试加上对 Web 服务器 error 日志的不断跟踪能有效减少 404 错误,亦能提升用户体验。值得一提的是,CSS 与 Java Script 引起的 404 错误因为定位稍稍”难”一点而往往容易被忽略。
分享到:
相关推荐
Web 前端优化最佳实践.rar
Web前端优化最佳实践及工具集锦[定义].pdf
Web前端开发最佳实践.pdf 个人收集电子书,仅用学习使用,不可用于商业用途,如有版权问题,请联系删除!
web性能优化最佳实践
本书的主要内容和特色: 以W3C Web规范为基础展开讨论,介绍Web前端开发中的最佳实践方法及编码风格。为Web前端开发人员快速成长提供了一条捷径。 介绍了大量近年来涌现出来的并已经得到广泛应用的工具和技术...
本书贴近Web前端标准来介绍前端开发相关最佳实践,目的在于让前端开发工程师提高编写代码的质量,重视代码的可维护性和执行性能,让初级工程师从入门开始就养成一个良好的编码习惯。本书总共分五个部分13章,第一...
高清彩版 Web前端开发最佳实践
党建 著 ISBN:9787111488439
web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题...
Web前端设计修炼之道》以Web前端设计的流程为主线,以前端设计的方法和原则为基础,围绕原型设计、模型设计、可用性设计、一致性设计和以用户为中心的设计等关键技术探讨了前端设计的规范、技巧与最佳实践....
Web 前端性能优化思路与学习方法Web 前端性能优化思路与学习方法Web 前端性能优化思路与学习方法
一本讲述web前端性能优化以及实践经验分享的书籍,非常不错,值得学习
web前端优化的一些自己从网上参考的方法然后总结出的内容
Web前端性能优化全攻略
Web前端优化 1. 关于Web 2. 为什么需要优化 3. 优化对比分析 4. 怎么优化