JS延迟加载的方式有:1、异步加载(Asynchronous Loading);2、延迟加载(Deferred Loading);3、动态加载(Dynamic Loading);4、懒加载(Lazy Loading)。
一、JS延迟加载的方式
1、异步加载(Asynchronous Loading)
通过添加“async”属性来异步加载JavaScript文件,从而避免在页面加载期间阻塞其他资源的下载和渲染。异步加载不保证脚本的执行顺序,但适用于独立的组件和工具库。
2、延迟加载(Deferred Loading)
通过添加“defer”属性来延迟加载JavaScript文件,以确保页面上的其他资源被优先加载和渲染。与异步加载不同,延迟加载保证脚本按照其出现的顺序执行,因此更适用于需要按顺序加载的组件和依赖库。
3、动态加载(Dynamic Loading)
通过JavaScript代码动态地添加或移除HTML标记来加载或卸载脚本文件。这种方式适用于需要根据用户行为或业务需求来加载和卸载组件和功能的情况。
4、懒加载(Lazy Loading)
在需要时再加载JavaScript文件,而不是在页面初始加载时加载。懒加载可以减少初始页面的大小和加载时间,并优化用户体验。通常懒加载适用于图片、视频、广告和一些非关键的JavaScript代码。