运行平台

小程序平台：百度智能小程序、支付宝小程序、微信小程序、QQ小程序、字节跳动小程序

快应用平台：努比亚手机、联想手机、一加手机、小米手机、vivo手机、华为手机、OPPO手机、金立手机、魅族手机、中兴手机

跨平台框架

omix：是腾讯omi项目的子项目，是腾讯webstore项目的进化版，是原生微信小程序项目的状态管理组件、响应式组件

腾讯 WePY（类vue）：支持输出 微信小程序
腾讯 kbone（纯vue，模拟浏览器环境）：支持输出 微信小程序、H5

美团点评 mpvue（纯vue）：支持输出 微信小程序、H5

滴滴 MPX（微信小程序原生语法增强为类vue）：支持输出 微信/QQ/支付宝/百度/头条小程序

滴滴 Chameleon（CML，类vue）：支持输出 微信/QQ/支付宝/百度/头条小程序、快应用、H5、Weex

DCLOUD uni-app（纯vue）：支持输出 微信/QQ/支付宝/百度/头条小程序、快应用、H5、Weex

京东 Taro（纯react）：支持输出 微信/QQ/支付宝/百度/头条小程序、快应用、H5、React Native

阿里巴巴 Rax（类React）：支持输出 支付宝/微信小程序、H5（PWA）、Weex、Flutter

小程序框架指标

跨端支持度：小程序、H5、Native App、快应用

学习成本：是否独立DSL（Domain Specific Language，领域特定语言）、目前掌握的是vue还是react

组件丰富度：官方(内置)组件库、第三方组件库、是否支持原生(H5、小程序)组件库

坑数：跨端数越多，bug就会越多，性能就会越差，使用各端的原生能力就越难；增强型框架跨平台

热度：社区活跃度、更新频率

微信小程序组件库

有赞-Vant Weapp、微信-weui-miniprogram、TalkingData - iView Weapp、蘑菇街-MinUI、Wux Weapp（个人项目，组件最多）

京东-TaroUI（基于Taro框架）、ColorUI（WXSS框架）、腾讯-WeUI-wxss（WXSS框架）

转译型 与 增强型

转译型框架（MPX以外）：将其他的语法规范转译为小程序语法规范

转译型框架的缺点：不支持源框架的一些语法特性，不支持原生组件库(H5、小程序)

增强型框架（MPX）：基于某一小程序语法规范，使用Vue中优秀的语法特性进行增强；但在跨平台编译时，仍然是转译

增强型框架的优点：可以从原生小程序项目渐进迁移、一定程度上支持原生小程序组件库

增强型框架的缺点：由于是基于某一小程序的语法规范，跨平台编译时，更难抹平平台差异；一旦抹平了，也就有了转译型框架的缺点

总结：不跨平台编译时，用MPX作为语法增强，是可行的。需要跨平台编译时，会出现很多不支持转译的语法特性

MPX跨平台编译

思路：新平台不支持的内容，要么抹平 要么 再编译前进行差异化

抹平案例：微信小程序代码 编译成 头条小程序
问题：vant-weapp组件库用到了<wxs>，不能跨平台编译成 头条小程序
解决思路：去掉vant-weapp里的<wxs>
步骤：
1、把 /wxs 目录下的 wxs文件 改为 .js，在wxss中引入
2、把这些文件里的wxs语法改为js语法，例如 模块导入导出语法、getRegExp()改为new RegExp()、判断是否是数组array.constructor === 'Array' 改为  Array.isArray(array)
3、template里调用方法 {{f(x)}} 改用 computed 方法实现
4、template里wx:for 内 调用方法 {{f(x)}} 得想办法展开成表达式 或者 数据预处理

kbone

不能用现成的第三方vue组件库；使用了小程序原生组件，则web端用不了；使用kbone-ui，才能两端通用

启动时打开指定路径：每个页面要设置成单独的page，而不能是一个单页多个路由；打开新页要用window.open(route); 否则会出现页面空白、没有返回按钮、没有Home按钮等问题

从外部（公众号菜单、分享等）打开指定路径要用 pages/xx/index?type=share&targeturl=${encodeURIComponent('https://origin.com/xx')}