高性能网站建设指南
点击看大图基本信息
- 原书名： High Performance Web Sites: Essential Knowledge for Front-End Engineers
- 原出版社： O'Reilly Media, Inc.
- 作者： Steve Souders [作译者介绍]
- 译者： 刘彦博
- 丛书名： 电子工业出版社O'Reilly系列丛书
- 出版社：电子工业出版社
- ISBN：9787121066191
- 上架时间：2008-7-1
- 出版日期：2008 年6月
- 开本：16开
- 页码：146
- 版次：1-1
- 所属分类：
计算机 > 计算机网络 > Web Server > 综合
编辑推荐
想让你的网站显示得更快?本书提供了14种规则，可以使用户在请求页面时减少20％～25％的响应时间。作为Chief Performance Yahoo！，作者Steve Souders收集了在优化网络时访问最多的页面积累下来的最佳实践。即使网站已经进行了高度的优化——如Yahoo！Search和Yahoo！首页——我们也能从这些出奇简单的性能规则中获益
推荐阅读
内容简介回到顶部↑
书籍
计算机书籍
本书结合Web 2.0以来Web开发领域的最新形势和特点，介绍了网站性能问题的现状、产生的原因，以及改善或解决性能问题的原则、技术技巧和最佳实践。重点关注网页的行为特征，阐释优化Ajax、CSS、JavaScript、Flash和图片处理等要素的技术，全面涵盖浏览器端性能问题的方方面面。在《高性能网站建设指南》中，作者给出了14条具体的优化原则，每一条原则都配以范例佐证，并提供了在线支持。《高性能网站建设指南》内容丰富，主要包括减少HTTP请求、Edge Computing技术、Expires Header技术、Gzip组件、CSS和JavaScript最佳实践、主页内联、Domain最小化、JavaScript优化、避免重定向的技巧、删除重复JavaScript的技巧、关闭ETags的技巧、Ajax缓存技术和最小化技术等。《高性能网站建设指南》适合Web架构师、信息架构师、Web开发人员及产品经理阅读和参考。
计算机书籍
本书结合Web 2.0以来Web开发领域的最新形势和特点，介绍了网站性能问题的现状、产生的原因，以及改善或解决性能问题的原则、技术技巧和最佳实践。重点关注网页的行为特征，阐释优化Ajax、CSS、JavaScript、Flash和图片处理等要素的技术，全面涵盖浏览器端性能问题的方方面面。在《高性能网站建设指南》中，作者给出了14条具体的优化原则，每一条原则都配以范例佐证，并提供了在线支持。《高性能网站建设指南》内容丰富，主要包括减少HTTP请求、Edge Computing技术、Expires Header技术、Gzip组件、CSS和JavaScript最佳实践、主页内联、Domain最小化、JavaScript优化、避免重定向的技巧、删除重复JavaScript的技巧、关闭ETags的技巧、Ajax缓存技术和最小化技术等。《高性能网站建设指南》适合Web架构师、信息架构师、Web开发人员及产品经理阅读和参考。
作译者回到顶部↑
本书提供作译者介绍
Steve Souders在Yahoo!担任Chief Performance。他于2000年加盟Yahoo!，在该公司的很多平台和产品团队中工作过。在他到达今天这个位置之前，他就职于My Yahoo!开发团队。.
作为Chief Performance Yahoo!，他开发了一系列优秀软件，可以使网站访问速度变得更快。他构建了用于进行性能分析的工具，并将这些优秀软件和工具传播到Yahoo!的各个产品团队中。
在到Yahoo!之前，Steve就职于很多小型或中型公司，包括他和别人一起创办的两个公司——Helix Systems和CoolSync。他还曾就职于General Mag.. << 查看详细
作为Chief Performance Yahoo!，他开发了一系列优秀软件，可以使网站访问速度变得更快。他构建了用于进行性能分析的工具，并将这些优秀软件和工具传播到Yahoo!的各个产品团队中。
在到Yahoo!之前，Steve就职于很多小型或中型公司，包括他和别人一起创办的两个公司——Helix Systems和CoolSync。他还曾就职于General Mag.. << 查看详细
目录回到顶部↑
序
前言
绪言a：前端性能的重要性
跟踪web页面性能
时间花在哪了？
性能黄金法则
绪言b：http概述
压缩
条件get请求
expircs
kcep-alive
更多信息
第1章：规则1——减少http请求
图片地图
css sprites
内联图片
合并脚本和样式表
小结
第2章：规则2——使用内容发布网络
内容发布网络
前言
绪言a：前端性能的重要性
跟踪web页面性能
时间花在哪了？
性能黄金法则
绪言b：http概述
压缩
条件get请求
expircs
kcep-alive
更多信息
第1章：规则1——减少http请求
图片地图
css sprites
内联图片
合并脚本和样式表
小结
第2章：规则2——使用内容发布网络
内容发布网络
译者序回到顶部↑
同样的网络环境，看着别人的网站“唰”地一下就展现出来，你是否和我一样，心急如焚，盼望着早一点攒出一笔钱，给服务器加点内存？或者你已经挽起袖子，开始研究数据库优化？又或者你在暗自思量着可以把哪些设计模式或编码技巧运用在自己的后台代码里，盼望以此带来性能上的巨幅提升？.
哦，别激动，很多时候事情并没有你想象的这么严重。
我们知道，一次Web应用程序请求，就是从浏览器发出一些参数到你的服务器，然后服务器上的程序对请求进行处理，再生成浏览器可以识别的内容（HTML、脚本、CSS、图片、Flash……），最后由浏览器将这些内容展现给访问者。人们将这一过程划分为“后端”和“前端”两个部分。
“后端”用于分析用户请求、执行数据查询并对结果进行组织，形成浏览器可以呈现的内容；“前端”负责将后端生成的内容通过网络发送给客户端浏览器。人的思维往往会进入一种误区，认为“后面的”、“背后的”东西都是神秘的、伟大的，影响力非凡。所以很多书以“某某内幕”为题，很多程序员以精通“底层开发”或“后端开发”为荣；同样的，当网站出现问题时，我们第一时间想到的也是如何优化“后端”。
本书从一开始就帮我们端正了在网站性能方面的看法，带我们走出误区。然后，从各个方面通过正例和反例的对比，让我们看到“前端”对网站性能的影响是如此巨大，而从“前端”入手改善现状是那么地简单明了。在对后端大动干戈之前，您的确应该按照本书的建议，首先从前端入手，改善性能，这样必将事半功倍。..
当然，本书最大的价值在于，作者通过一系列“步骤”详细地阐明了如何通过修改前端来改善网站性能，而这些方法需要经过大量实践才能掌握并总结成文。我们应该感谢作者能够将他多年来在网站性能方面积累下来的经验总结成文，并以图书的形式分享给各位读者。而我，很荣幸能有机会将这样好的作品带给更多的中国读者。
感谢博文视点资讯有限公司的各位朋友，谢谢你们给了我这样一个机会，能把这本书带给中国读者；也感谢你们能够体谅我在翻译工作中犯下的错误和拖延的时间。感谢在网络上留下技术文章的英雄们，有了你们的文章内容作参考，我对术语的把握更加容易了。感谢和我志同道合的爱人，在本书的翻译过程中，你不仅照顾我、鼓励我，还帮我校对了大量稿件！
在翻译的过程中，我尽可能地仔细斟酌。但术语的使用、语言的风格等很难与原著保持精确一致，也很难满足所有人的口味，还望广大读者体谅。另外，任何一本书都可能出现错误，本书也不例外。如果您发现本书有让您不满意的地方，或者是出现了错误，除了联系出版社之外，还可以通过发邮件到lyb.net@gmail.com与我联系，或在我的博客http://andersliu.cnblogs.com留言，我将在其中为本书读者提供非官方的技术支持。 ...
刘彦博
2008年4月于北京
哦，别激动，很多时候事情并没有你想象的这么严重。
我们知道，一次Web应用程序请求，就是从浏览器发出一些参数到你的服务器，然后服务器上的程序对请求进行处理，再生成浏览器可以识别的内容（HTML、脚本、CSS、图片、Flash……），最后由浏览器将这些内容展现给访问者。人们将这一过程划分为“后端”和“前端”两个部分。
“后端”用于分析用户请求、执行数据查询并对结果进行组织，形成浏览器可以呈现的内容；“前端”负责将后端生成的内容通过网络发送给客户端浏览器。人的思维往往会进入一种误区，认为“后面的”、“背后的”东西都是神秘的、伟大的，影响力非凡。所以很多书以“某某内幕”为题，很多程序员以精通“底层开发”或“后端开发”为荣；同样的，当网站出现问题时，我们第一时间想到的也是如何优化“后端”。
本书从一开始就帮我们端正了在网站性能方面的看法，带我们走出误区。然后，从各个方面通过正例和反例的对比，让我们看到“前端”对网站性能的影响是如此巨大，而从“前端”入手改善现状是那么地简单明了。在对后端大动干戈之前，您的确应该按照本书的建议，首先从前端入手，改善性能，这样必将事半功倍。..
当然，本书最大的价值在于，作者通过一系列“步骤”详细地阐明了如何通过修改前端来改善网站性能，而这些方法需要经过大量实践才能掌握并总结成文。我们应该感谢作者能够将他多年来在网站性能方面积累下来的经验总结成文，并以图书的形式分享给各位读者。而我，很荣幸能有机会将这样好的作品带给更多的中国读者。
感谢博文视点资讯有限公司的各位朋友，谢谢你们给了我这样一个机会，能把这本书带给中国读者；也感谢你们能够体谅我在翻译工作中犯下的错误和拖延的时间。感谢在网络上留下技术文章的英雄们，有了你们的文章内容作参考，我对术语的把握更加容易了。感谢和我志同道合的爱人，在本书的翻译过程中，你不仅照顾我、鼓励我，还帮我校对了大量稿件！
在翻译的过程中，我尽可能地仔细斟酌。但术语的使用、语言的风格等很难与原著保持精确一致，也很难满足所有人的口味，还望广大读者体谅。另外，任何一本书都可能出现错误，本书也不例外。如果您发现本书有让您不满意的地方，或者是出现了错误，除了联系出版社之外，还可以通过发邮件到lyb.net@gmail.com与我联系，或在我的博客http://andersliu.cnblogs.com留言，我将在其中为本书读者提供非官方的技术支持。 ...
刘彦博
2008年4月于北京
前言回到顶部↑
在八年级的时候，我在历史课上感受到工业革命的巨大威力。人们用以识别和突破制造业瓶颈的技术迷住了我。在我的印象里，最好的进步是可调整的踏板工具，它使得身高不同的工人都能轻松地够到传送带——一项简单的投资提高了加工的效率。.
30年过去了，我很乐于将本书中的最佳实践比作19世纪的踏板工具。这些最佳实践加强了现有流程。它们需要前期投资，但开销很小——尤其是与收益相比。而且一旦合理地运用了这些改进，它们将在整个开发过程中持续提升性能。我希望你能发现，这些用于建设高性能网站的规则能够为你和你的用户带来利益。
本书是如何组织的
How This Book Is Organized
在两章的快速介绍之后，将进入本书的主要部分——14个性能规则。每个规则都进行了介绍，按照优先级顺序，每章一个。并非每个规则都要应用于每个网站，也不是每个网站都应该按同一种方式运用一个规则，但每个规则都值得考虑。本书的最后一章介绍了如何从性能的角度来分析Web页面，这一章还包含一些案例研究。
绪言A，前端性能的重要性解释了有至少80%的时间花在了显示Web页面上，而这是在HTML文档下载完毕后发生的；这一章还描述了本书中的技术的重要性。
绪言B，HTTP概述对HTTP进行了简要介绍，主要强调了其中与性能相关的部分。
第1章，规则1——减少HTTP请求介绍了为什么额外的HTTP请求会对性能产生巨大的影响，并介绍了减少HTTP请求的方法，包括图片地图、CSS Sprites、使用data:模式的URL内联图片，以及合并脚本和样式表。
第2章，规则2——使用内容发布网络强调了使用内容发布网络的优势。
第3章，规则3——添加Expires头研究了一个简单的HTTP头是如何通过使用浏览器缓存来戏剧性地改善Web页面性能的。
第4章，规则4——压缩组件解释了压缩是如何工作的，以及如何为Web服务器启用压缩，并讨论了现今存在的一些兼容性问题。
第5章，规则5——将样式表放在顶部展示了样式表是如何影响页面呈现的。
第6章，规则6——将脚本放在底部展示了脚本是如何影响呈现的，以及脚本是如何下载到浏览器中的。
第7章，规则7——避免CSS表达式讨论了CSS表达式的使用和度量其影响的重要性。
第8章，规则8——使用外部JavaScript和CSS介绍了如何权衡是内联JavaScript和CSS还是将它们放到外部文件中。
第9章，规则9——减少DNS查找强调了解析域名时的频繁查找所产生的影响。
第10章，规则10——精简JavaScript量化了从JavaScript中移除空白字符所带来的收益。
第11章，规则11——避免重定向对使用重定向提出了警示，并给出了可替代的方法。
第12章，规则12——移除重复脚本展示了如果一个页面中包含两处相同的脚本会发生什么情况。
30年过去了，我很乐于将本书中的最佳实践比作19世纪的踏板工具。这些最佳实践加强了现有流程。它们需要前期投资，但开销很小——尤其是与收益相比。而且一旦合理地运用了这些改进，它们将在整个开发过程中持续提升性能。我希望你能发现，这些用于建设高性能网站的规则能够为你和你的用户带来利益。
本书是如何组织的
How This Book Is Organized
在两章的快速介绍之后，将进入本书的主要部分——14个性能规则。每个规则都进行了介绍，按照优先级顺序，每章一个。并非每个规则都要应用于每个网站，也不是每个网站都应该按同一种方式运用一个规则，但每个规则都值得考虑。本书的最后一章介绍了如何从性能的角度来分析Web页面，这一章还包含一些案例研究。
绪言A，前端性能的重要性解释了有至少80%的时间花在了显示Web页面上，而这是在HTML文档下载完毕后发生的；这一章还描述了本书中的技术的重要性。
绪言B，HTTP概述对HTTP进行了简要介绍，主要强调了其中与性能相关的部分。
第1章，规则1——减少HTTP请求介绍了为什么额外的HTTP请求会对性能产生巨大的影响，并介绍了减少HTTP请求的方法，包括图片地图、CSS Sprites、使用data:模式的URL内联图片，以及合并脚本和样式表。
第2章，规则2——使用内容发布网络强调了使用内容发布网络的优势。
第3章，规则3——添加Expires头研究了一个简单的HTTP头是如何通过使用浏览器缓存来戏剧性地改善Web页面性能的。
第4章，规则4——压缩组件解释了压缩是如何工作的，以及如何为Web服务器启用压缩，并讨论了现今存在的一些兼容性问题。
第5章，规则5——将样式表放在顶部展示了样式表是如何影响页面呈现的。
第6章，规则6——将脚本放在底部展示了脚本是如何影响呈现的，以及脚本是如何下载到浏览器中的。
第7章，规则7——避免CSS表达式讨论了CSS表达式的使用和度量其影响的重要性。
第8章，规则8——使用外部JavaScript和CSS介绍了如何权衡是内联JavaScript和CSS还是将它们放到外部文件中。
第9章，规则9——减少DNS查找强调了解析域名时的频繁查找所产生的影响。
第10章，规则10——精简JavaScript量化了从JavaScript中移除空白字符所带来的收益。
第11章，规则11——避免重定向对使用重定向提出了警示，并给出了可替代的方法。
第12章，规则12——移除重复脚本展示了如果一个页面中包含两处相同的脚本会发生什么情况。
序言回到顶部↑
你很幸运能够拿到这本书。更重要的是，你的网站用户会很幸运。Steve在这本开天辟地的书中分享了14项技术，哪怕只实现了这些技术中的很少几项，你的网站也会立即变快。你的用户会感谢你。.
这是为什么呢？作为一个前端工程师，你拥有巨大的能力和责任。你是用户的最后一道防线。你做出的决定直接影响着他们的体验。我相信我们大量的工作之一就是照顾用户并给他们所需要的——快速。这本书是一个创建快乐用户（和老板）的工具箱。最好的结果是，一旦恰当地使用这些技术——很多情况下，这只是一次性投入——你将长期从中获得收益。
这本书将改变你进行性能优化的方式。在Steve开始为我们Yahoo!的Platform Engineering团队研究性能之际，我还一直认为性能主要是后端问题。但他却表明前端问题可能消耗掉整体时间的80%。我想前端性能无非就是对图片进行优化和坚持使用外部CSS和JavaScript，但您手中的这176页书和14条规则却证明实际要做的工作远不止这些。..
我将他的成果应用于很多网站。发现大量已经很快的网站还可以再快将近一倍。他的方法论是可靠的，他的数据有效而且具有扩展性，他的成果是强有力的。
前端工程学这门学科还很年轻，但您手中的这本书将是这项技术趋于成熟的过程中的重要一步。通过创建更好和更快（也更具享受性）的界面和体验，我们将共同提高对Web的期望。
为更快的上网冲浪欢呼吧！...
——Nate Koechley
高级前端工程师
Yahoo! User Interface（YUI）团队，
平台开发，Yahoo! Inc.
圣弗朗西斯科，2007年8月
这是为什么呢？作为一个前端工程师，你拥有巨大的能力和责任。你是用户的最后一道防线。你做出的决定直接影响着他们的体验。我相信我们大量的工作之一就是照顾用户并给他们所需要的——快速。这本书是一个创建快乐用户（和老板）的工具箱。最好的结果是，一旦恰当地使用这些技术——很多情况下，这只是一次性投入——你将长期从中获得收益。
这本书将改变你进行性能优化的方式。在Steve开始为我们Yahoo!的Platform Engineering团队研究性能之际，我还一直认为性能主要是后端问题。但他却表明前端问题可能消耗掉整体时间的80%。我想前端性能无非就是对图片进行优化和坚持使用外部CSS和JavaScript，但您手中的这176页书和14条规则却证明实际要做的工作远不止这些。..
我将他的成果应用于很多网站。发现大量已经很快的网站还可以再快将近一倍。他的方法论是可靠的，他的数据有效而且具有扩展性，他的成果是强有力的。
前端工程学这门学科还很年轻，但您手中的这本书将是这项技术趋于成熟的过程中的重要一步。通过创建更好和更快（也更具享受性）的界面和体验，我们将共同提高对Web的期望。
为更快的上网冲浪欢呼吧！...
——Nate Koechley
高级前端工程师
Yahoo! User Interface（YUI）团队，
平台开发，Yahoo! Inc.
圣弗朗西斯科，2007年8月
媒体评论回到顶部↑
“如果实现了Steve这些建议中的20％，你的站点就能出现戏剧性的变化。有了这本书和YSlow扩展，实在是没有理由再构建出运行速度缓慢的网站了。”
——Joe Hewitt，Firebu9调试器和Mozilla的DOM解释器的开发者
“Steve Souders完成了一项神奇的工作，他提出了一系列简明的、可操作的，并且注重实效的开发步骤，使Web性能世界发生了翻天覆地的改变。”
——Eric Lawrence，微软Fiddler Web Debugger开发者
——Joe Hewitt，Firebu9调试器和Mozilla的DOM解释器的开发者
“Steve Souders完成了一项神奇的工作，他提出了一系列简明的、可操作的，并且注重实效的开发步骤，使Web性能世界发生了翻天覆地的改变。”
——Eric Lawrence，微软Fiddler Web Debugger开发者
书摘回到顶部↑
第1章：规则1——减少HTTP请求
图片地图
在一个最简单的转简中，超链接带有一些文本，并被关联到目标URL上。一种更为美观的选择是将超链接关联到图片上，例如在导航栏或按钮中。如果是以这种形式关联多个带有超链接的图片，使用图片地图这种方式就既能减少HTTP请求，又无需必变页面外观感受。
……
图片地图
在一个最简单的转简中，超链接带有一些文本，并被关联到目标URL上。一种更为美观的选择是将超链接关联到图片上，例如在导航栏或按钮中。如果是以这种形式关联多个带有超链接的图片，使用图片地图这种方式就既能减少HTTP请求，又无需必变页面外观感受。
……
【插图】
加载中...
