懒加载

2020-06-01  本文已影响0人  skoll

没有使用到的代码一定要走懒加载

1 .如果把所有的第三方库都打到vender里面,越来越大的时候也是会有阻碍问题,会影响加载,所以这些第三方库的使用也要使用懒加载,就像vue懒加载组件一样
2 .代码的异步引入

function Mounted(){
  let app=document.createElement('div')
  app.id="app"
  app.className='test'
  app.innerHTML="G507"
  document.body.appendChild(app)
  app.onclick=e=>import(/*webpackPrefetch:true*/ './print.js').then(module=>{
  })
//空闲资源的时候自动加载这个代码
}

 app.onclick=e=>import('./print.js').then(module=>{
  })
//点击页面才会加载这个文档
}

Mounted()

vue框架

1 .单页面应用,路由切换的时候才会加载对应的代码
2 .懒加载的实质就是important语法,webpack做的仅仅是识别这种语法并使用
3 .import返回的是一个promise类型

上一篇下一篇

猜你喜欢

热点阅读