Vue项目性能优化

为什么要进行性能优化

目的:做vue的项目开发也有一段时间,一开始只考虑基本功能的实现,现在看到自己的代码就会想,有没有更简便高效的方法;网站好像打开有点慢,是不是优化一下?

优化方法:在19年3月的时候,Vue开发者大会上,有个大佬发布了名为Vue优化9法的主题

Ⅰ.函数型组件:

➀.实际应用:用来定义那些没有响应数据,也不需要有任何生命周期的场景,它只接受一些props来显示组件。如果你的业务组件是一个纯展示且不需要有响应式数据状态的处理的,那函数式组件会是一个非常好的选择

➁.函数型组件和普通组件的区别:

  • 渲染快
  • 没有实例,也就是说this无法调用vue实例
  • 没有生命周期和响应式数据

➂.使用方法

Ⅱ.子组件拆分:

Ⅲ.局部变量

Ⅳ.或用v-show,减少v-if

Ⅴ.使用keep-alive

Ⅵ.活用延迟装载(Defer)

Ⅶ.分批处理(Time slicing)

Ⅷ.非响应模式(non-reactive)

Ⅸ.仅渲染可视化部分

你可能感兴趣的:(Vue项目性能优化)