JavaScript性能优化:度量、监控与可视化.pdf

JavaScript性能优化:度量、监控与可视化.pdf
 

书籍描述

内容简介
本书是首部系统化阐述JavaScript性能优化的经典著作,拥有20余年经验的Web性能调优专家经验结晶,亚马逊全五星好评。从语言特性、浏览器原理、网络传输机制、数据结构等多角度深层探讨影响JavaScript代码性能的根本原因,从性能问题的度量、监控和可视化全维度给出了提升JavaScript代码性能的实用工具、方法和最佳实践,并对各种常见的性能问题给出了完整的解决方案。
本书共分8章:第1章从Web应用运行机制和原理方面解析性能;第2章介绍测量性能的工具(Firebug、YSlow、WebPagetest、R)和实用技术;第3章基于样例工程WPTRuner来介绍如何进行自动化性能监测与可视化;第4章以创建的自制工具perfLogger来讲解JavaSript基准测试和日志记录;第5章讲解W3C制定的用于收集浏览器性能度量值的新标准化方法;第6章具体介绍如何使用JavaScript改进Web性能的各个方面;第7章探讨提升运行时性能的途径,并运用R生成量化的性能图表;第8章探讨如何在性能与代码可读性以及代码模块化之间谋求平衡。

编辑推荐
首部系统化阐述JavaScript性能优化的经典著作,拥有20余年经验的Web性能调优专家经验结晶,亚马逊全五星好评
从语言特性、浏览器原理、网络传输机制、数据结构等多角度深层探讨影响JavaScript代码性能的根本原因,并给出解决问题完整流程和解决方案

作者简介
Tom Barker
资深Web技术专家,有20余年行业经验,专注于Web开发的各个方面。现为Comcast公司的Web开发高级经理,费城大学的兼职教授。痴迷于优雅的软件解决方案,软件持续改进,数据的提炼、分析以及可视化。
译者简介
缪纶
资深软件开发工程师、安全员,负责或参与过多个国家科技支撑项目。现从事计算机网络以及Web开发相关工作,关注JavaScript网站性能多年,对Web性能提升有独到见解。

目录
目 录
译者序
致 谢
第1章 什么是性能 1
1.1 Web性能 1
1.2 解析与渲染 4
1.2.1 渲染引擎 6
1.2.2 JavaScript引擎 6
1.3 运行时性能 8
1.4 为什么性能如此重要 8
1.5 工具与可视化 9
1.6 本书的目的 10
1.7 使用的技术以及拓展阅读 11
1.8 小结 12
第2章 测量和影响性能的工具与技术 13
2.1 Firebug 13
2.1.1 安装 13
2.1.2 使用 15
2.2 YSlow 16
2.2.1 安装 16
2.2.2 使用 17
2.3 WebPagetest 19
2.4 缩减 23
2.4.1 Minify 24
2.4.2 YUI Compressor 25
2.4.3 Closure Compiler 25
2.4.4 结果比较 27
2.4.5 分析与可视化 28
2.5 R入门 29
2.5.1 安装并运行R 30
2.5.2 R基础 31
2.5.3 使用R进行简单绘图 35
2.5.4 R的一个实例 38
2.5.5 使用apply()函数 41
2.6 小结 42
第3章 WPTRunner——使用WebPagetest进行自动化性能监测与可视化 44
3.1 架构 44
3.2 创建一个共享配置文件 47
3.3 解析测试结果 50
3.4 完成实例 53
3.5 数据解析 55
3.6 绘制加载时间 56
3.7 绘制负载和HTTP请求数 58
3.8 开源 61
3.9 小结 61
附:WebPagetest的创办人Patrick Meenan访谈 62
第4章 perfLogger——JavaScript基准测试和日志记录 65
4.1 架构 65
4.2 开始编写代码 68
4.2.1 计算测试结果 68
4.2.2 设置测试结果元数据 69
4.2.3 显示测试结果 69
4.2.4 保存数据 70
4.2.5 制定公有API 70
4.3 远程日志记录 74
4.4 一个示例页 78
4.5 为测试结果绘制图表 79
4.6 开源 81
4.7 小结 81
第5章 展望未来,性能的标准化 82
5.1 W3C的Web性能工作组 82
5.2 性能对象 82
5.2.1 性能定时 83
5.2.2 用perfLogger整合性能对象 86
5.3 升级日志功能 92
5.4 性能导航 92
5.5 性能内存 93
5.6 高分辨率时间 97
5.7 新数据可视化 99
5.8 小结 106
第6章 Web性能优化 107
6.1 优化页面的渲染瓶颈 107
6.1.1 脚本加载 109
6.1.2 异步 111
6.1.3 对比结果 112
6.2 惰性加载 117
6.2.1 惰性加载的艺术 117
6.2.2 惰性加载脚本 119
6.2.3 惰性加载CSS 123
6.2.4 为什么不惰性加载图片 129
6.3 小结 130
第7章 运行时性能 131
7.1 跨作用域的缓存变量和属性 132
7.1.1 新建文件 132
7.1.2 创建测试 133
7.1.3 结果可视化 137
7.1.4 属性引用示例 139
7.2 核心JavaScript与Frameworks的比较 142
7.2.1 jQuery与JavaScript比较:循环 142
7.2.2 jQuery与JavaScript比较:DOM访问 147
7.3 Eval函数的真正价值 151
7.4 DOM访问 153
7.4.1 使用队列完成DOM元素修改 153
7.4.2 使用队列添加新节点 156
7.5 嵌套循环的代价 158
7.6 小结 162
第8章 在性能、软件工程最佳实践和软件产品运行之间谋求平衡 163
8.1 在性能与可读性、模块化和良好设计之间谋求平衡 163
8.2 焦土化性能 164
8.2.1 内联函数 164
8.2.2 Closure Compiler 169
8.3 下一步:从实践到实际应用 178
8.3.1 Web性能监测 178
8.3.2 用工具检测你的网站 178
8.3.3 在测试实验环境中进行基准测试 179
8.3.4 分享你的发现 184
8.4 小结 185

序言
译者序
JavaScript是比较完善的一种前端开发语言,在现今的Web开发(尤其是在Web 2.0)中应用非常广泛。在Web 2.0越来越流行的今天,我们会发现,许多Web应用项目都会涉及大量的JavaScript代码,并且以后会越来越多。Web开发过程中经常会遇到一些性能问题,尤其是在针对Web 2.0的应用中,应用的性能问题很大一部分都是由于程序员编写的JavaScript脚本性能不佳所造成的,其中也包括了JavaScript语言本身的性能问题,以及与DOM交互时的性能问题。
JavaScript作为一种解释执行语言,加之它的单线程机制,决定了性能问题是JavaScript的软肋,这也是Web软件工程师在编写JavaScript代码过程中需要高度重视的一个问题,尤其是针对Web 2.0的应用。绝大多数Web软件工程师都或多或少地遇到过所开发的Web 2.0应用的性能欠佳问题,其主要原因就是JavaScript性能不足,浏览器负荷过重。但是,解决这种解释执行并且单线程运作语言的性能问题并非易事。
本书从一个体系化的角度对JavaScript性能进行考量,从Web性能探测工具,到数据的收集整理,再到数据的展示与可视化,最后是性能问题的解决,深入浅出、条理清晰。本书尝试从多个方面综合分析导致JavaScript性能问题的原因,并给出适合的解决方案,帮助读者提升Web应用的品质。
本书页数了了,内容精炼,但是它承载了JavaScript性能方面最为宝贵的经验。不仅从语言特性、浏览器原理、网络传输机制、数据结构等层面分析导致JavaScript性能问题的原因,而且介绍多种工具来帮助读者提升开发过程中的工作效率。
翻译本书的过程,也是我们学习和提高的过程。虽然我们一直关注国内外Web性能领域的相关动态,但是从未像本书的作者那样,形成一套完整的实践方法体系。每当看到书中作者提供的代码样例,我们都试图在真实环境中实践,以深刻体会作者的意图和思想。但是由于时间和软硬件环境等方面的原因,无法实践书中所有的代码样例。这里也希望读者能够亲自动手实践,这样才能够更快地掌握JavaScript性能改善的方法和能力。
本书的翻译组织工作由缪纶全面负责。第1~3章由缪纶和王志璋译校,作者简介、第4章、第6章由缪纶和王冠华译校,第5章、第7章、第8章由叶茂译校。
我们在翻译本书的过程中力求行文流畅,但纰漏之处在所难免,请广大读者能够批评指正。关于本书的任何意见和建议,欢迎发送邮件至lunmiao@tom.com。
最后,希望本书能够帮助业界的同仁们打造出性能优越的Web软件产品。

缪 纶

文摘
第1章 什么是性能
所谓性能是指应用程序运行的速度,它反映了应用程序质量多个层面的问题。我们在谈论Web应用程序时,该应用程序呈现给用户所消耗的时间就是我们所说的Web性能,应用程序对用户指令的响应速度就是我们所说的运行时性能。接下来我们就看看性能的这两个方面。
在Web(特别是移动Web)开发背景下,性能是一个相对较新的主题,但是它绝对早就应该得到关注了。
本书将探讨如何量化和优化JavaScript性能,包括Web性能和运行时性能。这是至关重要的,因为当你试图解决网站的整体性能时,JavaScript可能是提升性能最大的地方。作为YSlow和PageSpeed的缔造者,以及Web性能领域的先驱者,Steve Souders已经通过实验证明了这一点。在实验中,他演示了当删除一个样本网站的JavaScript代码之后,该网站平均性能提高了31%。我们也完全可以像Steve实验中做的那样,从我们的网站中删除所有的JavaScript代码,或者精简JavaScript代码,并学习如何评估我们编写的代码的执行效率。
彻底删除JavaScript代码是不现实的,所以我们要知道如何使JavaScript更加高效。甚至更为重要的是,我们要知道如何创建自动化的工具以跟踪JavaScript的效率,并给出可视化的分析和报告。
1.1 Web性能
当你坐在笔记本前,或使用手持设备,打开Web浏览器,输入一个URL地址并按下回车键,然后等待页面内容传送过来、呈现在你的浏览器上时,此时所需要的时间取决于Web性能。甚于我们的目标,我们将Web性能定义为全面反映页面传送并对最终用户可用的时间。
影响Web性能的因素有很多,网络延迟是排在第一位的。你的网络有多快?要得到所需的服务内容,需要往返跳转多少次?服务器要给出多少次响应?
为了更好地理解网络延迟,先来看看完成一个HTTP事务所需要的步骤(见图1-1)。

购买书籍

当当网购书 京东购书 卓越购书

PDF电子书下载地址

相关书籍

搜索更多