首页 > 其他 > 详细

vue性能优化之大陆货色

时间:2020-01-09 15:56:14      阅读:79      评论:0      收藏:0      [点我收藏+]

一、修改productionSourceMap为false

在config??index.js??build

productionSourceMap: false,
默认为true,改为false有两大优点,代码体积变小,安全。原因请百度。
 
二、异步与懒加载
1、路由
import Vue from ‘vue‘
import Router from ‘vue-router‘
Vue.use(Router)
const HomeCont = ()=>import("@/components/HomeCont")
export default new Router({
  routes: [
    {
      path: ‘/‘,
      name: ‘HomeCont‘,
      component: HomeCont,
    },
  ]
})
2、组件
<Seckill ref="seckill"></Seckill>
components: {
      Seckill:() => import(‘@/components/common/home_module/seckill‘),
    },
异步路由打包会多出很多js文件,项目大时注意页面效果,使用swiper插件时有个坑。
如果组件中用了ref,那要开启定时器,不然报没定义。
 setTimeout(()=>{
              this.$refs.seckill
     },100)
3、图片使用懒加载
 
三、代码的写法
1、注意v-if与v-show
2、v-for绑定key
3、 减少watch的数据

vue性能优化之大陆货色

原文:https://www.cnblogs.com/xiao-wu-gui/p/12168072.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!