1、浏览器遇到js代码会暂停页面的下载和渲染，谁晓得js代码会不会把html给强奸（改变）了；

2、延迟脚本加载：defer 属性

<html>

<head>

    <title>Script Defer Example</title>

</head>

<body>

    <script type="text/javascript" defer>

        alert("defer");

    </script>

    <script type="text/javascript">

        alert("script");

    </script>

    <script type="text/javascript">

        window.onload = function(){

            alert("load");

        };

    </script>

</body>

</html>

不支持 defer 属性的浏览器的弹出顺序是：“defer”、“script”、“load”。而在支持 defer 属性的浏览器上，弹出的顺序则是：“script”、“defer”、“load”。请注意，带有 defer 属性的<script>元素不是跟在第二个后面执行，而是在 onload 事件被触发前被调用。

3、动态加载很多 JavaScript 文件，浏览器不保证文件加载的顺序。通过 loadScript()函数加载多个 JavaScript 脚本可以确保加载顺序

loadScript("script1.js", function(){

    loadScript("script2.js", function(){

        loadScript("script3.js", function(){

            alert("All files are loaded!");

        });

    });

});

4、减少 JavaScript 对性能的影响有以下几种方法：

  • 将所有的<script>标签放到页面底部，也就是</body>闭合标签之前，这能确保在脚本执行前页面已经完成了渲染。
  • 尽可能地合并脚本。页面中的<script>标签越少，加载也就越快，响应也越迅速。无论是外链脚本还是内嵌脚本都是如此。
  • 采用无阻塞下载 JavaScript 脚本的方法：
  • 使用<script>标签的 defer 属性（仅适用于 IE 和 Firefox 3.5 以上版本）；
  • 使用动态创建的<script>元素来下载并执行代码；
  • 使用 XHR 对象下载 JavaScript 代码并注入页面中。

详细链接：https://www.ibm.com/developerworks/cn/web/1308_caiys_jsload/

【摘要】JavaScript 的性能优化：加载和执行的更多相关文章

  1. JS性能优化——加载和执行

    JavaScript 在浏览器中的性能,可以认为是开发者所面临得最严重的可用性问题.这个问题因JavaScript的阻塞特性变得复杂, 也就是说当浏览器在执行JavaScript代码时,不能同时做其他 ...

  2. 高性能JavaScript笔记一（加载和执行、数据访问、DOM编程）

    写在前面 好的书,可能你第一遍并不能领会里面的精魂,当再次细细品评的时候,发现领悟的又是一层新的含义 (这段时间,工作上也不会像从前一样做起来毫不费力,开始有了新的挑战,现在的老大让我既佩服又嫉妒,但 ...

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

    随着 Web2.0 技术的不断推广,越来越多的应用使用 javascript 技术在客户端进行处理,从而使 JavaScript 在浏览器中的性能成为开发者所面临的最重要的可用性问题.而这个问题又因 ...

  4. [转]JavaScript 的性能优化：加载和执行

    原文链接:http://www.ibm.com/developerworks/cn/web/1308_caiys_jsload/index.html?ca=drs- JavaScript 的性能优化: ...

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

    随着 Web2.0 技术的不断推广,越来越多的应用使用 javascript 技术在客户端进行处理,从而使 JavaScript 在浏览器中的性能成为开发者所面临的最重要的可用性问题.而这个问题又因 ...

  6. 【转】js JavaScript 的性能优化：加载和执行

    JavaScript 的性能优化:加载和执行 转自:https://www.ibm.com/developerworks/cn/web/1308_caiys_jsload/ 随着 Web2.0 技术的 ...

  7. 前端性能优化：细说JavaScript的加载与执行

    本文主要是从性能优化的角度来探讨JavaScript在加载与执行过程中的优化思路与实践方法,既是细说,文中在涉及原理性的地方,不免会多说几句,还望各位读者保持耐心,仔细理解,请相信,您的耐心付出一定会 ...

  8. 性能优化-css，js的加载与执行

    前端性能优化 css,js的加载与执行 javascript是单线程的 一个网站在浏览器是如何进行渲染的呢? html页面加载渲染的过程 html渲染过程的一些特点 顺序执行,并发加载 词法分析 并发 ...

  9. 基于javascript实现图片懒加载（亲测有效）

    这篇文章主要介绍了javascript实现图片懒加载的方法及思路,有时我们需要用懒加载,也就是延迟加载图片的方式,来提高网站的亲和力,需要的朋友可以参考下! 一.定义 图片延迟加载也称为懒加载,延迟加 ...

随机推荐

  1. WildFly8(JBoss)默认web服务器-------Undertow

    Java微服务框架之Undertow 一.Undertow简介: Undertow 是红帽公司(RedHat)的开源产品,是 WildFly8(JBoos) 默认的 Web 服务器. 官网API给出一 ...

  2. 常州day7

    Task1 蛤布斯有一个序列,初始为空.它依次将 1-n 插入序列,其中 i 插到当前第 ai 个数的右边 (ai=0 表示插到序列最左边).它希望你帮 它求出最终序列. 对于 100%的数据,n&l ...

  3. 51NOD 1559：车和矩形——题解

    http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1559 波雷卡普有一个n×m,大小的棋盘,上面有k个车.他又放了q个矩形在 ...

  4. PHP关于VC9和VC6以及Thread Safe和Non Thread Safe版本选择的问题

    一.如何选择PHP5.3的VC9版本和VC6版本 VC6版本是使用Visual Studio 6编译器编译的,如果你的PHP是用Apache来架设的,那你就选择VC6版本.      VC9版本是使用 ...

  5. 代码收藏系列--javascript--移动端技巧

    JS判断是否是手机端访问: var is_mobi = navigator.userAgent.toLowerCase().match(/(ipod|iphone|android|coolpad|mm ...

  6. UTF-8和GBK编码之间的区别(页面编码、数据库编码区别)以及在实际项目中的应用

    第一节:UTF-8和GBK编码概述 UTF-8 (8-bit Unicode Transformation Format) 是一种针对Unicode的可变长度字符编码,又称万国码,它包含全世界所有国家 ...

  7. duilib CDateTimeUI 在Xp下的bug修复

    转自:http://my.oschina.net/u/343244/blog/370131 CDateTimeUI 的bug修复.修改CDateTimeWnd的HandleMessage方法 ? 1 ...

  8. Java的三大特性之封装

    java提高篇(一)-----理解java的三大特性之封装 三大特性之---封装 封装从字面上来理解就是包装的意思,专业点就是信息隐藏,是指利用抽象数据类型将数据和基于数据的操作封装在一起,使其构成一 ...

  9. python---tornado补充（异步非阻塞）

    一:正常访问(同一线程中多个请求是同步阻塞状态) import tornado.ioloop import tornado.web import tornado.websocket import da ...

  10. echart图跟随屏幕自适应变化

    var myChart = echarts.init(document.getElementById('main'),'macarons');// var option = { //...一些配置 / ...