chameleon怎么读发音 【第2017期】如何在滴滴落地 Chameleon( 三 )


CML语法参考:http://cml.didi.cn/docs/cml.html类Vue语法参考:http://cml.didi.cn/docs/cml-vue.html

chameleon怎么读发音 【第2017期】如何在滴滴落地 Chameleon


文章图片

逻辑对象
对于中的部分,变色龙在编译层统一了生命周期和数据响应,平滑了每一端生命周期的差异,并绘制了数据响应能力,这也使得开发人员不需要像小程序一样手动操作setData,从而实现了类似Vue的开发体验。

chameleon怎么读发音 【第2017期】如何在滴滴落地 Chameleon


文章图片

风格语法
在风格语法层面,我们提供基本风格,理顺各端风格的差异,定义cpx风格单元,统一各端开发风格规范,提供多态风格的能力,可以在一端实现特定风格的特殊风格需求。

chameleon怎么读发音 【第2017期】如何在滴滴落地 Chameleon


文章图片

多态协议
另外,为了尽可能保证开发者的开发效率,尽可能覆盖一些框架没有考虑到的能力,变色龙创建了多态协议。基于这个协议,允许开发者用多态协议调用对应端底层支持的能力。
接口多态性相关参考:https://github.com/chameleon-team/chameleon-api组件/风格多态性参考:https://github.com/chameleon-team/chameleon-ui-builtin模板多态性参考:http://cml.didi.cn/docs/poly.html#多态性模板

chameleon怎么读发音 【第2017期】如何在滴滴落地 Chameleon


文章图片

比如多态接口,如果框架内置的API接口不具备一定的实现能力,开发者可以按照多态接口无障碍的实现
再比如多态组件,一个业务组件在每一端的实现都有很大的差异,不能用一组代码来适应,所以可以用多态组件来适应。
换句话说,在业务代码中,某个终端需要实现某个风格,因此可以通过多态风格为该终端单独覆盖和设计它
组件/接口生态库
根据统一的DSL和CML设计的多态协议,我们提供了cml-ui、变色龙-ui内置、light-ui、chamelon-api等各种UI组件库和API库
所有相关仓库都在https://github.com/chameleon-team.,如果你有兴趣,可以看看加深了解。

chameleon怎么读发音 【第2017期】如何在滴滴落地 Chameleon


文章图片

最后,我们从业务代码到输出的角度来理解变色龙

chameleon怎么读发音 【第2017期】如何在滴滴落地 Chameleon


文章图片

基于多态协议的CML业务代码在变色龙编译后编译成各种端的代码,比如web端的html、js、css,weex端的weex jsFile,applet端的JS、json、wxss、wxml。
编译后的CMl业务代码与各端之间的基本对应关系如下

chameleon怎么读发音 【第2017期】如何在滴滴落地 Chameleon


文章图片

成熟稳定期
好了,说了这么多废话。我们的题目是《如何在滴滴快速登陆变色龙》,但是讲的是变色龙原理和架构层的很多设计问题。是不是有点跑题?其实是基于变色龙的设计,灵活的开发,内置的UI/API平滑差异的能力,多终端适配等。,这使得变色龙在正式开源之初就已经被提前用于滴滴内部的各种业务线。
登陆所有业务线
支持滴滴出行10+的业务线和应用,降低人工成本50%以上。

chameleon怎么读发音 【第2017期】如何在滴滴落地 Chameleon


文章图片

各业务线的应用
下面是变色龙在各个业务线的应用,包括滴滴风车、滴滴驱动、滴滴跑腿、绿橙单车、滴滴团队版、滴滴企业、橙研问卷、滴滴货运、新橙驱动、智能交通代码、橙研社等。

推荐阅读