CML
近日，滴滴在Github上开源了其多端开发组件Chameleon。Chameleon简称CML中文名称卡梅龙
- CML
CML即多端
支持平台：web、微信小程序、支付宝小程序、百度小程序、android(weex)、ios(weex)、qq 小程序、字节跳动小程序、快应用(进行中)、一端所见即多端所见——多端高度一致，无需关注各端文档
CML示意图
设计理念软件架构设计里面最基础的概念“拆分”和“合并”，拆分的意义是“分而治之”，将复杂问题拆分成单一问题解决，比如后端业务系统的”微服务化“设计；“合并”的意义是将同样的业务需求抽象收敛到一块，达成高效率高质量的目的，例如后端业务系统中的“中台服务”设计。
而 Chameleon 属于后者，通过定义统一的语言框架 统一多态协议，从多端（对应多个独立服务）业务中抽离出自成体系、连续性强、可维护强的“前端中台服务”。
设计理念
跨端目标虽然不同各端环境千变万化，但万变不离其宗的是 MVVM 架构思想，Chameleon 目标是让 MVVM 跨端环境大统一
跨端目标
实际上手上面的那些是官网对Chameleon的各方面介绍。我们接下来尝试着用Chameleon开发一个简单的小demo
- 全局安装CML构建工具
npm i -g chameleon-tool 注：暂时只支持npm安装
全局安装遇到的用户问题
查询过后发现是文件所属用户导致的
通过 sudo chown -R Kyle ~/.npm顺利解决
显示安装成功
- 初始化项目
cml init project
目录结构
安装依赖项后，执行cml dev启动项目 可以看出CML支持的面还是很广泛的
CML支持多端的情况
CML支持多端的情况
- 代码结构
整体代码样式
这样一个Chameleon最简单的CMLdemo就成功完成了，目前只在web端查看，其他端并没做过多的查看
CML在web端下的效果
框架有多大，性能怎么样？
多端的打包大小
组件库官网是这样说明的
1、小程序的主要运行性能瓶颈是webview和js虚拟机的传输性能，我们在这里会做优化，尽可能diff出修改的部分进行传输，性能会更好。
2、包大小，小程序有包大小限制，web端包大小也是工程师关心的点。首先基于多态协议，产出包纯净保留单端代码；其次框架的api和组件会按需打包。包大小是我们重点发力点，会持续优化到极致。
cml自带的组件库分为内置组件和扩展组件，组件库覆盖了常用的功能
扩展组件
APIchameleon 支持大量基础API，对外提供统一的接口，以模块的方式引入chameleon-api进行使用。查看官网文档可以看到API的覆盖面还是很广的
注意：
- 接口均以promise形式进行返回，所以你可以结合异步流程控制如async、await进行操作。
- API模块为按需加载模块，可有效减少包体积。
- 失败回调的返回格式为{errMsg:string}，如果是自己扩展的方法也建议按照此结构进行构造。
- 你还可以利用接口多态来实现跨端的接口或差异化实现特定端接口。
小例子：使用showToast import cml from 'chameleon-api' cml.showToast({ message: 'Hello world!', duration: 1000 }) 总结
现如今多端开发框架越来越多，包括Taro、uni-app、weex和今天的CML，这其中由于我日常工作中使用的React进行开发，所以我对Taro会比较清楚，也实际上手过几个项目，整体下来的感觉是如果你有React编程经验的话，整体下来上手难度不大，除了一些语法上需要注意的地方，对投入工作还是比较友好的。而诸如weex、CML则是类vue语法，平常对vue了解得较少不过既然是类vue相信如果有一定的vue经验，上手起来也是不难的。
关于两者间的孰重孰轻我觉得并没有一个定数，更重要的是在开发中谁能提供更好的体验才是最重要的。在使用taro开发小程序的过程中，由于是在taro版本比较早的时候，所以遇到的问题还是比较多的，虽然整体使用起来感觉还是不错的，但是处理问题还是费了很大的心力，但是后续随着版本的更新，这些问题也慢慢的越来越少，相信CML也是类似的情况。
今天对CML只是初步进行了解，还有很多功能并没有进行深入体验，一是本人对vue比较不熟悉，二是体验时间也比较局促。后续会对CML进行更深入的体验，尝试做一个复杂点的demo
后续规划
后续规划图
资源Github地址：https://github.com/didi/chameleon
CML资源汇总：https://github.com/chameleon-team/awesome-cml
官方上手视频：https://mp.weixin.qq.com/s/3NY_pbqDVnbQSYQG_D2qiA
