[译] 高性能JavaScript 1至5章总结
2011-10-29 11:24 AndrewCja 阅读(471) 评论(0) 编辑 收藏 举报译者：andycja
第一章 加载与执行
总结
在浏览器中操控JavaScript是比较诡异的，因为JavaScript代码的执行会阻塞其他浏览器进程，比如界面渲染。每当碰到一个<script>标签，页面解析必须暂停，以等待JavaScript代码的加载和执行（如果是外部文件），之后页面才继续解析。尽管如此，有几个方法可以减少JavaScript对性能的影响：
1、将所有<script>标签放在页面的底部，刚好在</body>结束标签之前。这样保证在脚本执行之前，页面已经基本呈现完毕。
2.、将脚本代码放在一起。页面上的<script>标签越少，页面就会更快地加载和可以交互。不管是用<script>标签加载外部JavaScript文件还是编写内联脚本，都应该这样做。
3、有几种加载JavaScript的方式可以避免页面阻塞：
使用<script>标签的defer属性（Internet Explorer和Firefox3.5+支持）。
动态创建<script>标签来加载和执行代码。
使用XHR对象加载JavaScript代码，然后再将代码注入页面。
通过使用这些策略，你可以大大地提高需要大量JavaScript代码的页面应用的性能。
第二章 数据访问
总结
在JavaScript中的哪儿存储和访问数据，对代码的总体性能有很大的影响。可以从四个地方访问数据：字面值、变量、数组元素和对象成员。这四个地方有不同的性能考虑：
1、字面值和本地变量能够被快速地访问，而数组元素和对象成员需要更多的时间。
2、局部变量的访问速度比局部作用域外的变量更快，因为它们存在于作用域链的第一个变量对象中。一个变量存在于作用域链的更远处，访问它就需要更多的时间。访问全局变量是最慢的，因为它们处在作用域链的最后边。
3、避免使用with语句，因为它增大了执行上下文作用域链。同样，要小心try-catch语句的catch子句，因为它存在同样的问题。
4、用对象成员进行对象的嵌套引用同样会产生性能影响，这种嵌套引用应该被最小化。
5、一个属性或方法存在于prototyp链的越深处，访问它们的速度就越慢。
6、一般来讲，你可以把常用的对象成员、数组元素和局部作用域外的变量存放在局部变量中，以提高JavaScript代码的性能。访问局部变量是最快不过的了。
通过使用这些策略，你可以大大地提高需要大量JavaScript代码的页面应用的性能。
第三章 DOM脚本
总结
对DOM的访问和操纵是现代网页应用中很重要的一部分。每一次从ECMAScript对DOM的访问都需要一定的性能成本。为了降低对DOM访问的性能成本，请记住以下规则：
1、降低对DOM的访问次数，尽量在ECMAScript中完成工作。
2、使用局部变量存储你会重复访问的DOM对象的引用。
3、小心地处理HTML集合，因为它们实时地反映当前HTML的状态。将集合的length存储在一个局部变量中，以在循环语句判断条件中对其进行重复访问。在需要对HTML集合进行繁重工作时先将其转换成一个数组，再对数组进行操作。
4、有可能的话，使用性能高的API，比如querySelectorAll()和firstElementChild。
5、当心重新渲染和重新流动计算。批量地修改样式，以“离线”的形式操纵DOM树。缓存和减少对样式信息的访问。
6、在做动画时使用绝对定位，并使用拖放代理。
7、使用事件代理来减少事件处理器的个数。
第四章 算法和控制流
总结
和其他编程语言一样，你编写代码的方式和所使用的算法会影响JavaScript的执行时间。和其它编程语言不同的是JavaScript所使用的资源有限，所以优化技术对其更加重要。
1、for、while和do-while具有相似的性能特性，其中没有一种循环的速度比其它的有显著的差别。
2、避免使用for-in循环，除非你须要遍历未知的对象属性。
3、提高循环性能的最好方式就是降低每次循环中的工作量和循环的次数。
4、一般来讲，switch要比if-else更快，但不总是最好的选择。
5、在多条件判断上，用查询表比用switch或if-else要快得多。
6、浏览器调用栈的大小限制了JavaScript递归的次数。栈溢出错误使得剩下的代码无法执行。
7、如果碰到栈溢出，可以考虑重构遍历代码或使用缓存来避免重复计算。
被执行的代码量越多，使用这些策略所得到的性能提升就会越大。
第五章 字符串和正则表达式
总结
密集的表达式操作和漫不经心编写的正则表达式可能是性能问题的罪魁祸首。这一章的建议会帮你避免常见的缺陷。
1、当连接多个或长的字符串时，使用数组连接是在IE7及早先版本中提高性能的最好方法。（译注：在实践中我发现，这里须要有一个折中，并不能一味的使用数组的join()方法。当被连接的两个字符创都很短时，用+操作符会更快，只有存在长的字符串时才须用join()方法来提高性能。举例来说，要动态地展示一个表格数据，应该先用+操作符连接一行中的每个表示单元格的字符串，再将表示每一行的字符串用数组的join()方法进行连接，这样才能提高性能。）
2、如果你不须要关注IE7及其先前版本，使用数组连接是连接字符串最慢的方式之一。Y应该使用简便的+或+=操作符，同时避免中间字符串的出现。
（译注：本人对正则表达式不在行，也没能看懂这章中正则表达式部分，因此没翻译总结中的正则表达式部分，这样以免误导读者，还请读者见谅。）
