JavaScript阻塞及解决方法

一、阻塞

出现原因是:JavaScript是单线程

二、改善方法

1.简单但不治本的方法

将script加载放在body的最后面,这样即使脚本之间阻塞了也不影响其他资源的加载,页面已经呈现出来,不至于显得很慢。将多个相关的JavaScript文件合并为一个JavaScript文件,减少脚本之间的阻塞。

2.无阻塞技术

  1. 使用defer和async
<script src=""  async>
<script src=""  defer>

async是异步执行,defer是延迟加载,这两个只在外联script中起作用。
async:脚本相对于页面的其余部分异步地执行(当页面继续进行解析时,脚本将被执行)
defer:脚本将在页面完成解析时执行

  1. 动态脚本元素
    《高性能JavaScript》中提到:当创建的script元素添加到页面后立刻开始下载。此技术的重点在于:无论在何处启动下载,文件的下载和运行都不会阻塞其他页面的处理过程。你甚至可以将这些代码放在部分而不会对其余部分的页面代码造成影响(除了用于下载文件的HTTP连接)
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值