# 也许你并不需要第三方小程序框架

这里说的去除小程序框架其实并不严谨,因为小程序本身也算是一个框架,而且是一个功能更加完善的框架系统。在前端的概念中,我们一般说一个框架是指一个用来帮助开发者构建用户界面的框架,而小程序框架本身不仅仅包含了 UI 层的功能,还提供了 API 能力、服务端的能力,所以说小程序框架本身是一个比常规的前端框架更完善的东西,或者说是一个完善的构建应用系统。 本文中所说的原生小程序与小程序框架的对比,均指与第三方小程序框架的对比。

在小程序的世界里,原生小程序框架已经足够好,它就是那把给你雕刻小而美应用的雕刻刀,而不必要去寻找一把屠龙刀。

# 框架的取舍

最近 Vue 作者尤大关于框架设计平衡 (opens new window)的分享中也提到了框架的取舍问题。

当我们去构建一个复杂的前端应用的时候,如果没有工具,而是使用原生 JavaScript 去开发的话,那只会花费更多的时间。 原生小程序框架已经足以构建一个复杂的小程序应用。

# 然而 web 应用的开发环境是否也适用于小程序开发呢?

小程序框架在小程序生态发展的初期的确起到了很大的促进作用,然而随着小程序原生框架的不断完善,这些小程序框架的作用已经不再具备优势。

框架的确给前端带来了生产力的提高,也带动了前端界生态的发展。所以在小程序出现之后,一股框架之风也很快的出现,微信小程序刚推出之后,就出现了两个比较出名的小程序开发框架,wepy、mpvue。这两个框架都带着一个共同的出发点,那就是将前端框架的开发体验移植到小程序开发中,从语法层做了改动,使用用户可以采用类似 Vue.js 风格的语法去开发微信小程序。

这些小程序框架初期主要做的是对小程序原生开发体验的增强,随着小程序生态的发展,又增加了跨端开发能力的支持。然而我们框架的引入真的增强了开发体验吗?我们是否真的需要跨端能力?是否需要通过引入框架的形式来实现跨端支持?

答案是否定的,引入框架对于小程序开发来说只会带来更多的问题。

# 原生小程序 VS Web 框架

如下是原生小程序与 Web 框架功能的对比情况,可以看到 Web 框架具备的能力,原生小程序也具备。

小程序出现的时候 Web 框架已经发展的比较成熟,所以可以简单猜测小程序的框架借鉴了许多 Web 框架的特性,这也是为什么小程序开发方式与前端开发方式如此接近的原因。

# 功能对比

模块 Vue.js React.js 原生小程序
数据监听 支持 支持 支持
组件式开发 支持 支持 支持
组件库 开源组件库丰富 开发组件库丰富 原生小程序组件支持
数据状态管理 vuex redux globalData 可实现基本的数据管理
路由 vue-router react-router 原生支持
模块开发 npm npm npm(有轻微的约束限制)

在开发前端应用的时候,Vue 和 React 技术栈是比较流行的两种类型,而对于选择什么样的生态工具时,许多开发者并不确定选择什么样的技术栈,所以一般都会选择 Vue 全家桶和 React 全家桶。原生小程序框架从能力上就考虑了小程序场景所需的技术栈,这也是笔者推崇原生小程序开发方式的原因,如果你对你当前构建的应用场景需要什么样的技术栈特别清晰,那么就用原生的好了,因为原生小程序框架就是基于小程序场景开发的。选择什么样的技术栈,提供什么样的框架能力,这应该是小程序平台团队去思考的问题。

# 原生小程序的优势

从上面的功能层级对比我们可以发现,原生小程序与框架相比,功能是非常接近的,简单来说就是同一个物种,只不过是花猫、白猫的区别。那么除此之外,原生小程序还有哪些优势呢?

  • 稳定
  • 安全
  • 可靠

原生小程序由专业的小程序团队维护更新,这是社区开源项目无法比拟的。即使是热门的开源项目也难保不会出现停滞更新维护的情况,也许有一天你就发现代码中的坑只得你自己的修复。

原生小程序还处于快速发展的阶段,每过一段时间就会发布新功能,如果使用原生小程序开发的话就可以及时的享用,而如果依赖于三方框架的话,只得依赖于框架作者更新之后才能使用。

作为一个开发人员,有时候选择一个什么样的框架是很难的,如果你想正确的选择框架,就得必须要了解框架所做的一些内部权衡,你必须知道这个框架朝着哪个方向发展,并且知道它与你构建的东西是否一致。而对于小程序来说,上述的问题其实不存在,小程序框架就是小程序平台团队为你量身打造的。

想了解更多小程序框架可以查看如下三个框架:

WePY 让小程序支持组件化开发的框架 WePY 框架在开发过程中参考了 Vue 等现有框架的一些语法风格和功能特性,对原生小程序的开发模式进行了再次封装,更贴近于 MVVM 架构模式, 并支持ES6/7的一些新特性。

mpvue 是一个使用 Vue.js 开发小程序的前端框架,目前支持 微信小程序、百度智能小程序,头条小程序 和 支付宝小程序。 框架基于 Vue.js,修改了的运行时框架 runtime 和代码编译器 compiler 实现,使其可运行在小程序环境中,从而为小程序开发引入了 Vue.js 开发体验。

Taro 是一套遵循 React 语法规范的 多端开发 解决方案。使用 Taro,我们可以只书写一套代码,再通过 Taro 的编译工具,将源代码分别编译出可以在不同端(微信/百度/支付宝/字节跳动/QQ小程序、快应用、H5、React-Native 等)运行的代码。

# 小程序跨端需求

继微信小程序推出后,阿里,百度,头条也推出了自己的小程序平台,这就给小程序开发者带来一个问题,是每个平台开发一套还是寻求代码复用的技术方案。

其实跨端方案很多,现有的小程序框架大多都内置了跨端能力支持,对于跨端支持能力要求并不是特别高的团队,也可以搭建自己的跨端方案,因为这些小程序框架都很类似,所以说搭建一套针对特定场景的跨端方案也变得可行。

# Antmove - 编译型小程序跨端解决方案

Antmove 是一个致力于提供通用型小程序跨端的解决方案,通过代码编译的手段和 runtime 的处理,实现小程序跨平台的目的,Antmove 与其它小程序开发框架的区别就是,它尽可能的通过代码编译的方式来解决多端差异问题(一个平台的代码转换到另一个平台),编译方式难以处理的才会进行运行时的抹平,而这部分只有简单的数据转换处理,不会引入特定的编码约束。

以微信小程序转支付宝小程序为例,微信小程序和支付宝小程序底层设计不同,导致双方组件机制不一样,微信小程序组件间的通信是基于事件的,而支付宝小程序是基于 props 的。在将使用了微信小程序事件能力的小程序应用转换为支付宝小程序应用的过程中,Antmove 不会去构造一套事件机制,它尽可能的避免任何不必要的运行时开销,而是利用支付宝小程序的 props 机制去实现同样的功能。