前言

小编公司也随潮流,把现有h5项目,重做成小程序项目,前期是用wepy搭建的,开始感觉还不错,随着加入的功能越来越多,感觉性能也越来越成问题。下面我们来详细介绍。

开发文档

  1. 原生开发小程序文档:点此进入
  2. wepy 开发文档:点此进入
  3. mpVue 开发文档:点此进入

三者的简单对比

微信小程序 mpVue wepy
语法规范 小程序开发规范 VueJs开发规范 类Vue开发规范
标签集合 小程序标签 html标签+小程序标签 小程序标签
样式规范 wxss sass/less/postcss sass/less/stylus
组件化 无组件机制 VueJs组件规范 自定义组件规范
多端复用 不可复用 支持转换为H5 支持转换为H5
自动构建 本身无自动构建 webpack构建 框架内置自动构建
上手成本 全新学习 熟悉VueJs VueJs和wepy
集中数据管理 不支持 使用Vuex实现 不支持

小程序缺点

个人认为小程序开发中,最大的缺点,也是很蛋疼的问题
不支持vue的过滤器filters(因此数据都得提前处理,或者后端处理好后返回给前端)

wepy和mpvue的性能对比

看下图
mpvue数据管理
mpvue数据

computed: { trainListFilterList () { console.log(1111) } }

wepy数据管理
wepy数据管理

@connect({ trainListFilterList(state) { console.log(11111) } }

从这里这里看出同样是数据处理,wepy会执行很多遍,一直处于监听状态,只要页面有事件,或者数据变动,都会触发。导致页面会渲染很多次,这也是我开始所说的wepy的性能问题。或许是我没有学到更深次,没有处理好这个问题,希望各位大神支招。

上面是写在vue页面的@connect里面,解决这个问题需要把处理数据的方法都提取到store->reducers里面去,处理好后重新赋值给state,如此反复,总感觉不是很好,所以现在用mpvue,我也第一时间看了这个问题,感觉mpvue明显没有这个问题。

公告

以后每月5、15、25号更新原创文章,内容不限,喜欢小编的可以点击关注,也可在下方评论留言,你喜欢什么内容,小编根据大家喜欢的内容尝试更新