uniapp对比原生小程序

uniapp和原生小程序都有不少的槽点，但相对来说更推荐uniapp

uniapp官方文档-选型指南提供了详细的多方对比评测，需要深入了解可以阅读参考

APP端的跨端框架发展迅猛，本文仅针对小程序端进行对比

我个人的看法是：涉及跨端那就是无底的大坑，但uniapp是权衡下还不错的选择

功能实现

uniapp编写小程序最终是将代码转换为原生小程序

uniapp本身不限制底层API调用，兼容小程序JS SDK与小程序自定义组件，即使uniapp尚未封装，仍可以直接编写原生写法。同时支持了各家平台的视图层脚本语言，微信wxs、百度filter、阿里sjs

uniapp开发小程序在功能上与原生小程序没有区别

性能体验

uniapp因为需要跨端，内部会做层层封装、转换，看似是增加了运行负担，但其实常规场景下uniapp的性能体验更好

微信小程序文档-合理使用setData一文中明确说明：数据量大小、setData频率均会影响运行性能

因为setData需要将数据序列化后全量从逻辑层传到数据层，异步的触发视图层更新，且每一次调用setData均会触发虚拟DOM树的遍历、更新，甚至页面重新渲染

例如官方评测中提供的例子：向数组中新增数据时，需要将原有数据、新增数据合并、序列化后一起传输

data: {  
    listData: []  
},  
onReachBottom() { //上拉加载  
    let listData = this.data.listData;  
    listData.push(...Api.getNews());// 新增数据  
    this.setData({ listData }) // 全量数据，发送数据到视图层  
    // 例如原有1000条，新增20条后，setData仍然需要从逻辑层传递1020条数据到视图层
}

原生语法中上诉场景需要手动优化：

data: {  
    listData: []  
},  
onReachBottom() { //上拉加载  
    // 通过长度获取下一次渲染的索引  
    let index = this.data.listData.length;  
    let newData = {}; //新变更数据  
    Api.getNews().forEach((item) => {  
        newData['listData[' + (index++) + ']'] = item //赋值，索引递增  
    })   
    this.setData(newData) //增量数据，发送数据到视图层
    /* 
      this.setData({
        listData[21] = xxx
        listData[22] = xxx
      })
    */
}

uniapp的实现中使用了diff策略，最小量的传输数据，减少通信损耗；以及vue中的异步更新机制，先在虚拟DOM中应用一次事件循环中的所有更改，再将最小变更作用到视图，避免重复触发更新

可以类比vue开发与原生开发，如不做特殊优化，原生性能通常是不及框架性能的

优化后的原生性能 > uniapp性能 > 未优化的原生性能

社区生态

因为均作用在小程序平台，大多数的插件或者问题解决方案是比较容易相通的。所以在社区生态的比较上可以基本忽略差异，例如搜索问题时两个社区都可以尝试

微信小程序需要在管理后台中搜索添加插件，uniapp则是提供了开放的插件市场

在社区活跃程度上，DCLOUD社区与微信开放社区均较为火热，大多数的问题都有对应的帖子（虽然实际业务中也会有很多问题找不到明确的答案）

uniapp与微信小程序在生态上都较为完善

开发体验

原生小程序自创语法被吐槽为“不伦不类”，对于开发者来说相当于重学一套新语法，大幅提升学习成本

uniapp采用的vue语法+小程序api的方式则更为友好，上手难度大幅度降低

在编辑器上，uniapp有自研的HBuilderX。虽然也是被吐槽不断，但相当于微信原生开发者工具来说，提供了可视化配置，代码提示，转到定义，easycom，快速新建项目、文件以及方便的编译打包辅助功能等，内置支持状态管理工具vuex、pinia，支持预处理器，新ES语法，工程化支持更好等

uniapp开发体验大幅优于原生小程序

扩展性

开发小程序的一大目的就是背靠平台，便于引流。而uniapp主打的开发一次，多端覆盖能够很方便的将应用扩展到多个平台，对于企业来说具有较高的价值

uniapp保留扩展性，没有坏处

总结

	uni-app	原生
功能	相同	相同
性能	框架自动优化	需要手动优化
社区生态	丰富，更多高性能组件	丰富
开发体验	纯vue体验，上手容易，工程化能力强	自创语法，工程化能力弱
多端能力	同时支持H5、多家小程序、跨平台App	只能用于单一平台