在ArchSummit深圳2019大会上,钟钦成(司徒正美)讲师做了《去哪儿网跨端小程序开发实践谈》主题演讲,主要内容如下。
演讲简介:
两年前,微信小程序横空出世,及小米直达号联合其他手机商摇身一变,推出快应用,在这个互联网寒冬中,去哪儿网敏锐抓住机会,迅速推出去哪儿微信小程序与快应用,以一套代码加语法宏的方式进行开发, 取得不俗的收益,日收入百万级别。
一年前,其他小程序也冒出来了,显然这意味新的商业机会,但旧的开发方式已经无法进行下去(宏里面太多分支),因此去哪儿网开发了自己的转译框架 nanachi,实现一套代码运行于 N 个平台(微信,QQ 轻应用,头条,抖音,钉钉 E 应用,支付宝,百度,快应用,H5)。
本次分享介绍研发心得,大家耳熟能详的转译部分(babel 的 API 的调用)会略过,但会展示更加有用的信息,及在框架无法 hold 住的情况下处理措施。
演讲提纲:
1、框架的研发细节
React 代码如何转换成小程序的代码
React 组件实例如何匹配相同页面上相同位置的小程序实例,实现数据的同步与视图的刷新
API 的兼容与 Promise 化
针对个别平台的标签差异开发出补丁组件,在编译阶段无感支持这种标签
样式单位的转译
对事件进行统一委托,解决传参与 bind(this)与数据上传
2、框架外的技术文案(需要开发人员手动添加额外代码,或进行某方面的约束)
针对平台的限制或体积的限制,需要将某个页面或频道放到 webview 中,开发出智能 webview 方案
iconfont 的跨平台处理
根据不同平台打包业务代码
拆库开发,方便多条业务线同时开发
通过与各大公司的技术人员洽谈,协商加入某些 API,减轻兼容难度
如何设计跨端的目录结构
快应用的兼容问题
听众受益:
1、对项目负责人来说,了解一下各种小程序的收益情况(微信>快应用>支付宝>百度),了解兼容难度,市面上有各种号称非常不错的转译框架,其实只能解决 60%的问题,于是才有了各种补丁方案,如何在框架无能为力的情况进行自救。从项目实施来讲,我的建议有三点:
必须有 backup 方案
如果决定上线,必须提前研发,不一定等到推广费到位,因为坑多
加强与大公司技术人员的沟通
2、对开发者,可以了解到众多平台的差异与相应的解决方案。
讲师介绍:
钟钦成(司徒正美)
去哪儿 架构师
网名司徒正美,拥有 11 年纯前端经验,涉猎多种语言与设计模式,精通 DOM 与 JS 各种黑魔法,精通选择器引擎、模块加载器、MVVM。著有《JavaScript 框架设计》一书,去哪儿网平台事业部前端架构师,人民出版社 Web+DB Press 中文版编委会编委!
开发过选择器引擎,前端模板,富文本选择器,甘特图 H5,多套 UI 库。主要开源项目有:mass、avalon、anujs、jsx-parser、fetch-polyfill、nanachi 多端小程序转译框架。
完整演讲 PPT 下载链接:
https://archsummit.infoq.cn/2019/shenzhen/schedule
评论