Vue实战051:各种懒加载技术实现

 时间:2024-10-28 14:58:41

1、为什么需要懒加载当我们项目很大的时候,打包应用后JavaScript 包会非常大,在首次载入页面的需要加载的内容会很多,这样加载的时间就很长,一般一个页面加载超过5s就会影响用户的体验感,甚至导致大量的用户流失。

Vue实战051:各种懒加载技术实现

3、Vue异步加载Vue 允许你以一个工厂函数的方式定义你的组件,这个工厂函数会异步解析你的组件定义。Vue 只有在这个组件需要被渲染的时候才会触发该工厂函数,且会把结果缓存起来供未来重渲染。使用vue的异步组件技术进行vue-router配置路由可以实现懒加载 ,这种情况下一个组件生成一个js文件。

Vue实战051:各种懒加载技术实现

4、ES6 import()加载这个import与前面非懒加载的路由配置中的import(静态加载)有点不同,这里是采用ES6语言实现的动态加载,使用ES6提出的import()方法进行vue-router配置路由实现懒加载,每个组件打包成一个js文件,也可以指定相同的webpackChunkName按组打包js文件,个人比较喜欢使用这个方案,方便快捷。

Vue实战051:各种懒加载技术实现Vue实战051:各种懒加载技术实现
  • Sourcetree设置默认工作目录
  • Notepad++设置新建文件编码
  • nginx 如何在window7系统上面安装和调试
  • Hive怎样修改表
  • java8、jdk8如何获取1周后1个月后1年后的日期
  • 热门搜索
    呼伦贝尔旅游 南湖国旅游官网 南昌旅游景点 漳州旅游必去十大景点 世界旅游日 梵净山旅游攻略 西安旅游股票 清远旅游景点大全 百度旅游 旅游景点排行