## 综述近期由于公司要开发微信小程序，因此对目前流行的小程序开发框架做了一些预研工作。首先，目前流行的小程序开发框架主要有： - **Taro**（京东，React系，Taro3大改版后也支持Vue/Vue3，主打多平台小程序适配，以及H5、RN，大而全，希望对标Vue系的Uniapp，但感觉坑会不少） - **Uniapp**（QCloud，Vue系，早先集成了MpVue，主打一套代码，多端部署，支持各种小程序平台、H5、IOS、Android等，适合某些固定的业务场景，听说外包用的很多，滑稽脸~ ） - **Remax**（蚂蚁，React系，专注于使用 React 技术栈开发小程序，尤其微信小程序，支持和微信小程序进行混合开发，意味着它几乎完美继承原生小程序的能力，且可复用小程序社区。对其他小程序平台也有Remax one的跨端适配支持，小而精，未来可期~） - **MpVue**（美团，Vue系，2年未维护，如果希望使用Vue开发小程序，选Uniapp吧~） - **Wepy**（官方，让小程序支持组件化开发的框架，目前已被其他框架大大超越，欢迎进入到历史书中...） - **原生开发**（官方，能力相比最初已大幅加强，但无法使用 Vue 和 React 的技术栈是一大硬伤，小程序开发工具的开发体验也和我们熟悉的 VSCode 有差距）通过对各个框架的初步了解和资料查阅，以及结合团队对于扩展技术栈的需求，重点选择React系的 `Taro` 和 `Remax`进行对比，通过使用这两个框架分别实现 `TodoList` 示例，来对比两者的区别。 - [todolist-remax](https://gitee.com/AaronKong/todolist-collection/tree/master/todolist-remax) - [todolist-taro](https://gitee.com/AaronKong/todolist-collection/tree/master/todolist-taro) ## 一、总体设计理念 > 【引自Remax官网】 > Taro 3.0 版本的实现原理与 Remax 大同小异，没有太大的区别。主要区别在于以下两个方面： > - **跨平台设计**，我们深知要打造一个面面俱到的多平台框架会有非常多的坑，与其挖一个大坑填不上，我们选择把有限的精力放在框架的核心功能上，并提供跨平台同构机制以及一个精简的跨平台实现（Remax One），让开发者可以根据自己的业务需求去做跨平台实现。 > - **专注 React**，因为 React 是我们自己大量使用和熟悉的前端框架，Remax 会持续专注在 React 技术栈。 ## 二、对比维度 1. 开发体验（Remax > Taro） 2. 组件&API能力（Remax > Taro） 3. 插件支持-less（均支持） 4. 第三方小程序组件库支持（Remax > Taro）、 5. 运行性能-虚拟列表（Remax > Taro） 6. 打包大小（Taro > Remax） 7. 维护情况/社区（Taro > Remax） ~~其他维度：~~ - ~~多端适配：支持的多端适配（H5、多小程序平台、ReactNative）~~ - ~~自定义组件编写是否方便？~~ - ~~配置Webpack能力？~~ - ~~全局数据状态管理~~ ### 1、开发体验 - 创建项目：均可不安装全局包，使用一行命令即可新建项目 - Taro： `npx @tarojs/cli init myApp` - Remax: `npx create-remax-app my-app` - 创建项目速度： Remax 明显快于Taro，1min vs 3-5min - 得益于Remax仅安装核心库，十分小巧 - Remax的初始项目一共仅包含 `react` 和 `remax` 两个包，相比之下，Taro一共有十几个包; - 代码检查：Taro自带eslint，而remax无提示，不过有代码提示，基本也没差 - 代码调试：[remax](https://remaxjs.org/guide/basic/devtools) - 编译报错：咋个都不提示呢。。。特别是Taro，不支持Web标签，会白屏，但也没报错 - Web标签支持：Remax会自动帮你将`

`转成``，不过还是不建议写`

` ### 2、组件&API能力： > 1、均支持和小程序原生组件/API混合开发 > > 2、但实现思路稍有不同，Remax小而精，Taro大而全 > > 3、因为实现思路不同，调用时的开发体验也不同。Remax更统一，而Taro需区分组件和api，以及区分使用的小程序平台，分别通过不同的包引入 > > 4、总体上，Remax对微信原生小程序的支持度更高，因为原生小程序是官方维护，因此坑更少 - **Remax** - Remax/wechat 是微信小程序的组件库，基本可以完整使用原生小程序的能力，包括组件和API：`import { View, Text, Image, navigateTo } from 'remax/wechat';` - Remax/one 是可以兼容所有小程序平台的组件库，目前仅支持少量组件跨端，如 `