JavaScript 的性能优化：加载和执行.docx

随着 Web2.0 技术的不断推广，越来越多的应用使用 JavaScript 技术在客户

端进行处理，从而使 JavaScript 在浏览器中的性能成为开发者所面临的最重要

的可用性问题。而这个问题又因 JavaScript 的阻塞特性变的复杂，也就是说当

浏览器在执行 JavaScript 代码时，不能同时做其他任何事情。本文详细介绍了

如何正确的加载和执行 JavaScript 代码，从而提高其在浏览器中的性能。

概览

清单 1 JavaScript 代码内嵌示例

<p>

document.write("Today is " + (new Date()).toDateString());

</html>

<script type="text/javascript" src="script1.js"></script>

<script type="text/javascript" src="script2.js"></script>

<script type="text/javascript" src="script3.js"></script>

<link rel="stylesheet" type="text/css" href="styles.css">

我们可以发现一个有趣的现象：第一个 JavaScript 文件开始下载，与此同时阻

载前存在一个延时，这段时间正好是 script1.js 文件的执行过程。每个文件必

须等到前一个文件下载并执行完成才会开始下载。在这些文件逐个下载过程中，

用户看到的是一片空白的页面。

从 IE 8、Firefox 3.5、Safari 4 和 Chrome 2 开始都允许并行下载 JavaScript

文件。这是个好消息，因为

标签在下载外部资源时不会阻塞其他

文件和图片。尽管脚本的下载过程不会互相影响，但页面仍然必须等待所有

并行下载提高了性能，但问题尚未完全解决，脚本阻塞仍然是一个问题。