详解js异步加载的三种方式

本文详细介绍了JavaScript的三种加载方式:同步加载,它会阻塞页面后续处理;异步加载,包括defer和async特性,以及动态创建script标签,允许并行下载但可能不保证执行顺序;延迟加载,用于按需加载非初始化必需的JS模块,提高页面加载速度和用户体验。
摘要由CSDN通过智能技术生成

详解js异步加载的三种方式

一.同步加载

默认正常模式下,JS是同步加载的,及优先加载JS,只有当JS文件下载完,dom和css才开始加载

同步加载是我们使用最多的一种方式,同步模式,又称为阻塞模式,会阻止浏览器的后续处理,停止后续的解析,要等js加载完并执行之后才能执行下一步,所以默认同步执行是最安全的。但这样如果js中有输出document内容、修改dom、重定向等行为,就会造成页面堵塞。所以一般建议把

缺点:过多js加载会影响页面效率,一旦网速不好,那么整个网站将等待js加载而不进行后续渲染等工作。

<script src = 'index.js'></script>

二.异步加载

异步加载又叫非阻塞加载,浏览器在下载执行js的同时,还会继续进行后续页面的处理。主要有三种方式

  1. defer,异步加载,但要等dom文档全部解析完(dom树生成)才会被执行。只有IE能用;

    defer属性:IE4.0就出现。defer属声明脚本中将不会有document.write和dom修改。浏览器会并行下载其他有defer属性的script。而不会阻塞页面后续处理。

    defer属性的值只有defer一个,即 defer = ‘defer’,可直接写defer

    注:所有的defer脚本必须保证按顺序执行的。

    <script src 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值