27-lazy loading(懒加载和预加载)

2023-06-02,,

加载

document.getElementById('btn').onclick = function () {
// 懒加载:当文件需要使用时才加载
import(/* webpackChunkName: 'test' */ './test').then(({mul})=>{
console.log(mul(4, 5));
})
}

预加载

document.getElementById('btn').onclick = function () {
// 预加载:webpackPrefetch: 会在使用之前,提前加载js文件
// 正常加载可以认为是并行加载(同一时间加载多个文件)
// 预加载 prefetch:等其他资源加载完毕,浏览器空闲了,再偷偷加载资源
import(/* webpackChunkName: 'test', webpackPrefetch: true */ './test').then(({mul})=>{
console.log(mul(4, 5));
})
}

27-lazy loading(懒加载和预加载)的相关教程结束。

《27-lazy loading(懒加载和预加载).doc》

下载本文的Word格式文档,以方便收藏与打印。