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. 【JavaScript】事件

    一.前言         继续上一章的内容,继续今天的Js学习. 二.内容         事件处理程序 事件就是用户或浏览器自身执行的某种动作.而响应某个事件的函数就叫做事件处理程序 //HTML事 ...

  2. 基于 HTML5 的人脸识别技术

    基于 HTML5 的人脸识别技术 https://github.com/auduno/headtrackr/

  3. 【Django实例】博客1

    (上一篇) 一.概述 Blog是一个博客应用. dbe工程的目录结构,参考<序言>的最后部分.blog应用位于/home/russellluo/Django/dbe/dbe/blog目录下 ...

  4. 【bzoj4011】落忆枫音

    Portal --> bzoj4011 Solution ​ 这题..看了一眼之后深陷矩阵树定理然后我看了一眼数据范围== 注意到是有向无环图,DAG有十分多优秀的性质所以,这题需要充分利用这个 ...

  5. git 删除远程仓库的命令

    # 删除远程仓库的命令: git branch -r -d origin/branch-name #其中这条命令必须执行,远程仓库才会删除 git push origin :branch-name # ...

  6. gdb打印STL和boost容器

    http://note.youdao.com/noteshare?id=b581e0db0084b6ba3011d9d27d372c91

  7. UVA - 11181 数学

    UVA - 11181 题意: n个人去买东西,其中第i个人买东西的概率是p[i],最后只有r个人买了东西,求每个人实际买了东西的概率 代码: //在r个人买东西的概率下每个人买了东西的概率,这是条件 ...

  8. mysql 中delete和trncate区别

    mysql中删除表记录delete from和truncate table的用法区别: MySQL中有两种删除表中记录的方法:(1)delete from语句,(2)truncate table语句. ...

  9. 「Python」19个python编写技巧

    1. 交换赋值 2. Unpacking 3. 使用操作符in 4. 字符串操作 5. 字典键值列表 6. 字典键值判断 7. 字典 get 和 setdefault 方法 8. 判断真伪 9. 遍历 ...

  10. webservice 采用SSL实现加密传输

    本文转自:http://book.51cto.com/art/200906/129770.htm http://yeweiyun868.blog.163.com/blog/static/5637844 ...