携程小程序生态之Taro跨端解决方案

一、摘要
 
随着携程接入小程序平台类型的增加,前端需要负责的端越来越多,研发成本也随之成倍增加 。为了解决一套代码多端运行的诉求,携程小程序框架不断调整、升级,逐渐形成了携程Taro跨端解决方案 。
 
二、背景
 
2.1 小程序现状
 
近几年业界推出了各种小程序平台,每个小程序平台都会提供一个专属的原生小程序DSL,这些DSL之间或多或少存在一些差异,这意味着使用某一类型小程序DSL编写的代码,无法直接复用到其他小程序平台上,造成开发和维护成本成倍增加 。
 
2.2 业务现状
 
目前携程支持的小程序业务涉及多个小程序平台,如果全部只使用平台自身的DSL开发,开发人员至少需要同时开发及维护5个活跃版本,开发任务繁重,代码维护困难 。此外,每新增一类小程序入口,开发人员必须将原有业务逻辑重写一遍,不仅工作内容重复,而且严重影响业务落地速度 。为此,一套代码多端运行的诉求迫在眉睫 。
 
值得注意的是,携程已经接入了多个平台的小程序,使用多端统一开发框架从零开始开发小程序代码既浪费研发资源又不现实 。我们需要考虑如何在携程当前已有的小程序代码的基础上使用跨端框架开发新业务、逐步切换原有代码,实现多端统一开发方案的平滑接入 。
 
2.3 解决方案
 
为了解决上述问题,我们研发了携程Taro跨端解决方案,开发者只需使用Taro框架书写一套代码,便可获得在多个平台皆运行良好的小程序项目 。此外,该方案还提供了仓库管理、辅助脚手架、编译功能扩展及过程优化等功能 。
 
三、Taro跨端解决方案设计
 
3.1 技术选型
 
为了在保留原有代码的前提下实现一套代码多端运行,我们对市面上的跨端开发框架进行了调研,最终决定使用Taro 3 作为携程小程序的跨端框架 。主要是考虑到Taro 3具有以下4项优点:
 

  • 框架稳定性高
  • 支持的平台种类多
  • 支持使用React 语法规范进行开发
  • 支持Taro和原生混合开发
 
3.2 整体架构设计
 
携程小程序随着业务的发展、多平台化趋势和跨端技术的不断演进,逐渐形成了一套多平台复用的Taro跨端解决方案 。
携程小程序生态之Taro跨端解决方案

文章插图
图1 项目工程架构图
携程小程序的项目工程架构图如图1所示 。上半部分是跨端复用层,这一层的项目代码是基于Taro框架进行开发的,多个Taro模块可以灵活组合成一个完整的Taro项目;从下半张图可以看出,Taro项目是完整小程序项目的其中一个模块,Taro项目的运行需要依赖小程序原生壳工程 。整个Taro项目是依据插件化的设计思想组织代码的,由多个独立的Taro模块和一个Taro基础壳工程构成 。
 
3.3 Taro模块的插件化设计
 
首先,携程小程序是由多个团队协同开发的项目,跨团队协作开发时常常会出现代码冲突、文件覆盖等问题 。因此,需要思考如何通过合理的项目架构从根本上解决这些问题,保证多团队并行开发的效率 。考虑到可以采用模块化的概念,根据业务线类型将项目代码拆解成多个子模块,并约定文件放置以及引用规则,从而确保各个子模块的源码文件能够完全隔离 。
 
然而,使用模块化开发方案,得到的Taro项目几乎不具有扩展性,Taro模块也无法快速便捷的被复用 。怎样才能提高Taro模块的灵活性,使得任取一个或多个Taro模块进行组合都能得到一个完整的Taro项目,且合并到小程序原生壳工程中能够正常运行?为解决以上问题,我们进一步将插件化的设计思想应用在Taro跨端解决方案上,提供了定制化的Taro基础壳工程以及一套开发规范 。
 
【携程小程序生态之Taro跨端解决方案】开发者需使用Taro基础壳工程作为开发模版,并遵循规范进行业务开发,所有Taro模块在本地开发或发布时按照统一的标准进行编译、融合,从而达到在不破坏原有项目结构的前提下灵活组合使用的目标 。下面我们将从项目构成与开发规范、仓库管理、开发架构,运行方案等方面详细讲解Taro跨端解决方案 。


推荐阅读