javascript 性能分析:加载和运行

管理浏览器的javascript代码是个麻烦的问题（从性能上讲），因为代码执行阻塞了其他浏览器处理过程，像用户界面绘制。每次遇到<script>标签，页面必须停下来等待代码下载（如果是外部的）并执行，然后在继续处理页面其他部分。

下面有几种方法可以减少javascript对性能的影响：

     1.将所有的<script>标签放置在页面的底部，在body关闭标签</body>的上方。这样可以保证页面在脚步运行之前完成解析。

    2.将脚本成组打包。页面的<script>标签越少，页面的加载速度越快，响应也更加迅速。不论是外部脚本还是内联代码都是如此。

    3.使用非阻塞方式下载javascript

        为<script>标签添加defer属性--启动下载 代码不会被立刻执行 在onload事件句柄处理之前调用（只适用IE和Firefox3.5以上版本） 但是不支持跨领域的多种浏览器

        动态创建<script>元素 用户它下载并执行代码，但是如果脚本包含供页面调用其他脚本调用的接口 会带来问题，同样代码不能保证按照你指定的顺序执行（firefox和Opera 可以）用loadScript或第三方js可以控制

        用 XHR对象下载代码 并注入到页面中

  4.第三方js插件 Yahoo的YUI 3 yui-min.js   指出dom的名字 传递给YUI的use()函数，再提供一个回调函数。

          YUI().use("dom",function(Y){

             Y.DOM.addClass(docment.body,"loaded");

              });

      Yahoo的Search的 Ryan Grove 创建LazyLoad库 可以下载多个文件并保证按照正确顺序执行

        <script type="text/javascript" src="lazyload-min.js"></script>
        <script type="text/javascript">
           LazyLoad.js[("the-rest.js","***.js"], function(){
          Application.init();
           });
        </script>

     LABjs http://labjs.com/ 中 Kyle Simpson写的一个开源库

      <script type="text/javascript" src="lab.js"></script>
      <script type="text/javascript">
         $LAB.script("first-file.js").wait()
           .script("the-rest.js")
           .wait(function(){
              Application.init();
             });
        </script>