干货 | 携程门票H5转小程序实践

作者简介

 

本文作者为携程门票前端小程序组，关注小程序相关的开发和优化。

一、背景

 

自微信小程序出来后，互联网进入一个新的纪元。由于手机的容量有限，每个人不可能装太多APP ，总有一些APP大家都装，称之为超级APP，它们集成越来越多的功能，其中以小程序尤为突出。小程序巨大的流量红利不容小视，这也是小程序越来越火的部分原因。

 

我们团队一直致力于推进react多端一致，在进入小程序一致性研发工作之前，RN和web已经实现了大部分的跨端工作。彼时（2020年8月）小程序的研发多以原生为主、迭代周期很长，且代码书写和结构与RN、web开发有着巨大区别；为了提高研发效率、完善多端一致的技术路线，将现有代码以较小改动转成小程序代码势在必行。

 

二、各个跨端转换框架对比

 

结合当时小程序开发场景以及内部的一些限制，跨端框架需要满足“能够与原生项目混合”的要求，主要包括：

• 在原生项目中使用转换后的页面

• 在原生项目的分包中运行完整的转后的项目

• 在原生项目中使用转换后的自定义组件，且在包体积等方面都需要考虑

结合我们之前做的一些调研，部分对比（有兴趣的朋友可以自行了解这些跨端转换框架）如下：

 

对比维度	KBone	Remax	Taro	Nanachi
跨平台	否	是	是	是
DSL	React、Vue	React	React、Vue等	React
开发效率	一般	一般	高	高
包体积	大	大	大	较小
与原生项目混合	支持	不支持	不支持	支持
书写规范限制	低