闲爱孤烟 发表于 6 天前

JS加载

同步加载


[*]阻塞模式,提高安全性

[*]过多JS加载会影响页面效率
[*]默认情况下,JS是同步加载,及优先加载外部JS,只有当JS文件加载完成,don和css才开始加载

异步加载


[*]非阻塞加载

[*]动态创建script
[*]defer 延迟加载JS,等到HTML的DOM完全解析之后
[*]async HTML的文档解析和脚本的获取同时进行

#defer
#async理解优化


[*]浏览器解析html的DOM是从上到下的,JS默认为同步加载
[*]先被解析head的JS资源, 在body没有解析完之前会被绑定监听
即:head的JS资源在页面加载前,body的JS资源在页面加载后逐一获取JS
如:JS替换页面全局变量时, 需要将JS在body获取, 或者在head进行defer
PS:网页播放器一般放在body最底部,网页播放器与内容相干甚少,直接按需求defer/async
默认


async


defer



[*]默认: 提前加载并执行, 都占用html解析
[*]async: 异步加载, 获取和解析同时, 执行占用html解析
[*]defer: 异步加载, 获取完并不执行, 执行不占用html解析

来源:https://www.cnblogs.com/nagisb/p/18412822
免责声明:由于采集信息均来自互联网,如果侵犯了您的权益,请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容,谢谢合作!
页: [1]
查看完整版本: JS加载