Uber每个地区的网页内容都不一样。以前是每个地方的团队自己搭小网站，高峰时有1500多个小网站。这些小网站的域名十分繁杂，当地用户想要去网站上了解当地的最新消息，都不知道如何下手。
为了解决这个问题，Uber团队做了个统一的的内容管理系统（Content Management System， 简称CMS）， 把之前的小网站全部迁移集成到主域名下(Uber.com)。团队把这个CMS取名为变色龙(Chameleon)。 因为变色龙擅于适应环境，也希望这套系统无论是从设计上还是内容上，能够帮助运营团队轻松实现网页的“本地化”和“定制化”。
据说，这套CMS从最初的设计和原型开始，到全球城市普遍推出，只用了六个月的时间。一起来看看这是怎样的系统吧！
原文阅读时间：19分钟
本文阅读时间： 5分钟
一定要从头搭建吗？
你可能会问，为什么不用现成的开源库？Uber团队给出的答案就是：
- 不想做重复劳动。
在Chameleon之前，Uber推出过监测系统Morpheus，还有一些集成后端的服务。如果直接用开源库，就得在该库基础上再搭建一套监控系统, 完全没这个必要。
- 灵活性没有自己搭建的强。
自己搭建的话，UI想怎么简单就怎么简单，能够极大方便运营团队上手该系统。
另外，自己搭建CMS，能够和现有的网站进行整合。
架构
由四个部分组成：数据层Louvre、渲染层Chameleon-Render、UI层Chameleon-UI、还有负责托管的Uber.com网站。
1.存储层Louvre（卢浮宫）
Louvre是用Go写的， 在 Schemaless 数据库基础上搭建的， 并且使用 TChannel与其客户端进行通信。
数据库里的内容是以块为单位的，一个块包含内容（橘黄色）和地理定位（绿色）。Louvre会根据请求的地理定位参数进行查找。
- Louvre的一个区块
2. 渲染层 Chameleon-Render。
Chameleon-Render起着承“下”启“上”的作用。底层的Louvre解析完后，Chameleon-Render将得到的块内容渲染进React虚拟DOM结构中去。
Chameleon-Render有几个重要特点。
- 样式封装。通过 Styletron实现。
- 以块为单位进行内容渲染，从上到下逐一放置。对块的要求很高，必须支持响应式设计、高性能动画等等。
- 块类型是模板化的，且高度自定义的。每个块类型都可以在编辑器中使用表单进行编辑，并且表单为每个段落都提供了控件。
3.Chameleon UI—网页编辑器。
这个编辑器有三个特点：
实时预览正在编辑的内容
页面配置服务。可以配置与搜索引擎相关的属性（例如标题和描述）。
集成后端翻译服务
- 网页编辑器
4.Uber.com
就这样，Louvre，Chameleon-Render，与网站服务Uber.com一起，为全世界的司机和乘客提供本地化服务。
特别说明，本文是对Introducing Chameleon: A Global CMS from Uber Engineering 的概括。
原文链接：Introducing Chameleon: A Global CMS from Uber Engineering
原文作者： Ken Sheedlo
原文创作时间：2017年7月21日
文中图片均选自 Introducing Chameleon: A Global CMS from Uber Engineering
