亲身体验小程序wepy和mpvue框架的区别

前言

小编公司也随潮流，把现有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数据管理

代码语言：javascript复制

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

wepy数据管理

代码语言：javascript复制

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

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

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

小程序 微信 sass vue.js html5

0 人点赞