博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
【摘要】JavaScript 的性能优化:加载和执行
阅读量:4593 次
发布时间:2019-06-09

本文共 927 字,大约阅读时间需要 3 分钟。

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

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

    Script Defer Example            

不支持 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/

转载于:https://www.cnblogs.com/supe/p/6719223.html

你可能感兴趣的文章
POJ 3352 Road Construction(图论-tarjan)
查看>>
JS 强制类型转化
查看>>
Note:JSON
查看>>
Design Pattern ->Bridge
查看>>
ModelAndView返回mav时,报404
查看>>
spring配置xml的错误
查看>>
资金归集率比率sql
查看>>
JavaScript常用字符串操作方法总结
查看>>
LinkedList、ArrayList各自的使用场景,如何确认应该用哪一个?
查看>>
java 并发——内置锁
查看>>
微信小程序实现各种特效实例
查看>>
JAVA编程思想读书笔记(三)--RTTI
查看>>
[洛谷P3931]SAC E#1 - 一道难题 Tree
查看>>
设计模式学习总结:(5)装饰模式
查看>>
sql JOIN语句应注意on与where的区别
查看>>
[转载]python 详解re模块
查看>>
HDU - 4686 函数积的前缀和
查看>>
k8s系列---EFK日志系统
查看>>
Python list、tuple、dict区别
查看>>
20190127-将一个文件拆分为多个新文件
查看>>