随着Web2.0技术的不断推广，越来越多的应用使用 JavaScript 技术在客户端进行处理，从而使JavaScript在浏览器中的性能成为开发者所面临的最重要的可用性问题。而这个问题又因JavaScript的阻塞特性变的复杂，也就是说当浏览器在执行JavaScript代码时，不能同时做其他任何事情。本文详细介绍了如何正确的加载和执行 JavaScript代码，从而提高其在浏览器中的性能。
?
无论当前JavaScript代码是内嵌还是在外链文件中，页面的下载和渲染都必须停下来等待脚本执行完成。JavaScript执行过程耗时越久，浏览器等待响应用户输入的时间就越长。浏览器在下载和执行脚本时出现阻塞的原因在于，脚本可能会改变页面或JavaScript的命名空间，它们对后面页面内容造成影响。一个典型的例子就是在页面中使用document.write()。例如清单 1：
?
Html代码 
- <html>
- <head>
- <title>Source Example</title>
- </head>
- <body>
- <p>
- <scripttype="text/javascript">
- document.write("Today is " + (new Date()).toDateString());
- </script>
- </p>
- </body>
- </html>
<html>
<head>
<title>Source Example</title>
</head>
<body>
<p>
<script type="text/javascript">
document.write("Today is " + (new Date()).toDateString());
</script>
</p>
</body>
</html>
当浏览器遇到<script>标签时，当前HTML页面无从获知JavaScript是否会向<p> 标签添加内容，或引入其他元素，或甚至移除该标签。因此，这时浏览器会停止处理页面，先执行JavaScript代码，然后再继续解析和渲染页面。同样的情况也发生在使用src属性加载JavaScript的过程中，浏览器必须先花时间下载外链文件中的代码，然后解析并执行它。在这个过程中，页面渲染和用户交互完全被阻塞了。
?
脚本位置
HTML 4 规范指出 <script> 标签可以放在 HTML 文档的<head>或<body>中，并允许出现多次。Web 开发人员一般习惯在 <head> 中加载外链的 JavaScript，接着用 <link> 标签用来加载外链的 CSS 文件或者其他页面信息。例如清单 2
清单 2 低效率脚本位置示例
Js代码
- <html>
- <head>
- <title>Source Example</title>
- <script type="text/javascript" src="script1.js"></script>
- <script type=
