常见的Vue性能优化方法

小洋人_
77 阅读1分钟
  1. 路由懒加载

image.png

  1. keep-alive缓存页面

image.png

  1. 使用v-show复用DOM

image.png

  1. v-for 遍历避免同时使用 v-if

image.png

  1. 长列表性能优化

image.png

  1. 事件的销毁

image.png

  1. 图片懒加载

对于图片过多的页面，为了加速页面加载速度，所以很多时候我们需要将页面内未出现在可视区域内的图片先不做加载， 等到滚动到可视区域后再去加载。

image.png

  1. 第三方插件按需引入

像element-ui这样的第三方组件库可以按需引入避免体积太大。

image.png

  1. 无状态的组件标记为函数式组件

image.png

  1. 子组件分隔

image.png

  1. 变量本地化

image.png

  1. SSR
avatar
文章
阅读
粉丝