微信小程序一键转百度小程序，携程火车票团队是这样做的

汪春华

作者简介张海明，携程火车票研发部开发经理。2015年加入携程，从事火车票Android、ReactNative和小程序相关研发工作。一、前言随着微信小程序的逐渐火爆，百度、支付宝等平台纷纷推出各自的小程序平台。面对众多平台，携程第一时间上线了自己的小程序。在带来巨大流量的同时，也带来了更多的工作量。如何保证各个平台小程序的质量、迭代速度以及减少工作量成为我们思考的问题。二、概述本文将根据携程火车票小程序团队从微信小程序转百度小程序的实践过程以及最终的实践成果，从以下几个方面来进行阐述：为什么要进行微信小程序转百度小程序微信转百度小程序的思路转化调整过程中遇到的问题以及解决方案实践成果及后续展望三、为什么要进行微信小程序转百度小程序在百度平台的小程序开放后，我们基于微信小程序的业务版本，快速投入资源，上线了第一版功能较为简单的小程序，去对市场进行试探。经过了一段时间的观察，发现百度小程序的流量很可观，觉得有必要对百度小程序做对应的优化。我们当时面临的情况如下：①因为需要保证微信小程序的质量，我们必须使用原生微信小程序进行开发。②主流的小程序转换方式：如使用类似Taro、remax等框架，需要进行完整的开发，这需要投入很多的资源，且基于①的原因，我们无法复用到微信。③使用百度原生语言开发：和②一样，在投入资源的情况下，可复用性不高。④需要考虑后续扩展到其他小程序平台。⑤微信小程序和百度小程序具有一定的相同点。⑥使用内嵌H5没有原生API支持，部分功能受限(支付、分享等)。⑦我们的主要工作在于自己的业务模块，基础构件已由框架同事全部支持。基于上述情况，我们决定尝试用现有的微信小程序代码直接转换为百度小程序代码。四、微信转百度小程序的目标及思路 4.1 微信转百度小程序的目标参考技术社区的转换方案，结合我们自身的需要，我们拟出初步目标：支持微信小程序一键转换为百度小程序，且支持迭代转换。 4.2 微信转百度小程序的思路一键转换工具我们选择了开源工具wx2swan?,在工具的介绍中，开发者提到了下面这句话：工具帮你迁移80%的代码，可能只节省你50%的工作量。而在初步实践中，也验证了开发者的观点，减少这50%的工作量也成了我们工作的重中之重。在具体讨论时，我们主要有两个方案：1）微信小程序代码转换后，进行代码搬运。在转换后的代码上进行修改，配合百度小程序平台带来的某些差异进行处理。这种方案是我们最先提出的，但是该方案存在两个缺点。①搬运代码进行修改，工作量较大，业务流程很有可能存在较多隐患，出现bug时，排查解决等也会耗费很多的时间；②解决了我们当前的需要，但是当后面需要继续迭代百度小程序时，又会面临①中的问题，无法减轻更多的工作量。我们团队继续讨论其他可行性，于是出现了第二个方案。2）结合百度小程序的差异，基于现有的微信代码进行修改。这个方案基本思路就是抹平两个平台的差异，做到微信小程序一套代码，转换后基本甚至完全可以在百度上运行。同样的，该方案的缺点我们也进行了分析。①工作量大，需要在微信代码的基础上，一个一个页面的去趟"坑"，如某些api的使用，页面展示差异等，并需要提出解决方案；②业务流程、功能策略在两个平台上的差异需要做一定的修改，如分享、活动入口等。但是该方案可以避免①中的持续迭代带来工作量问题，我们选择了该方案。五、转化调整过程中遇到的问题以及解决方案 5.1 平台差异性抹平这一部分的工作主要在API和平台某些特性如UI上。特性(UI)上差异处理如下：icon-font使用base64方式差异，百度小程序不支持woff2:统一使用了truetype@font-face {font-family: "xxx-iconfont"; src: url('data:application/octet-stream;bas...') format('truetype');}.ifont-add:before { font-family: 'xxx-iconfont'; content: "\e7f8";}for循环和判断条件一起使用时，百度小程序会生成空dom:for循环使用block嵌套 {{s.name}} 百度小程序中swan不支持位运算：移至至js中百度小程序中swan 运算符?首次开发基于release_wx新建develop_baidu分支;对于百度小程序的适配，全部在develop_baidu分支进行;使用develop_baidu进行转换，生成的代码拷贝至百度小程序仓库并提交;--->迭代开发release_wx?merge至develop_baidu分支;对于有修改的代码进行检查使用develop_baidu进行转换，生成的代码拷贝至百度小程序仓库并提交;六、实践成果及后续展望根据之前设定的目标，微信小程序调整后基本完成的预期的目标：在微信小程序代码的基础上，支持一键转成百度小程序，且可进行持续的迭代更新。而在此过程中，我们摸索出来的较为稳定的开发方式、流程，是我们对其他小程序推进更新的有益尝试。按照此方式，我们业已完成了对快应用的适配，并有计划推广至其他平台。也期待对于和我们一样，在以微信小程序开发为主，其他平台尝试转译的同学有一定帮助。【推荐阅读】携程的 Dubbo 之路数据质量良莠不齐？携程是这样来做多场景下的内容智能发现的已配置4000+页面，携程前端组件化探索之“乐高”运营系统携程Redis跨IDC多向同步实践关于SwiftUI，看这一篇就够了2019携程技术峰会5G、人工智能等热门话题云集11月9日上海戳下方图片直达↓↓↓