作为一名coder，像VSCode这样的代码编辑器自然是必不可少的，你还可以使用类似CodeSandbox这样的online编辑器开发demo程序。编辑器更多是作为工具方便我们进行日常的代码开发工作，倘若将编辑器视作产品的一部分为其提供可扩展的能力，我们该如何应对。答案是：web编辑器，现在热门的可视化页面搭建系统便是一个典型的案例。
今天要介绍的是三款开源的主流web编辑器:AceCodeMirrorMonacoEditor
前世今生
Ace是来自Ajax.orgCloud9Editor的一个独立的代码编辑器，它的前身是Bespin和后来的Skywriter。这两者最开始走的路线不一样，Bespin基于canvas，Ace基于DOM。Ace发布于年，之后Skywriter团队将Skywriter的插件系统和可扩展性融合到了Ace中，便形成了现在的Ace编辑器。现在，Ajax.org和Mozilla都在积极的开发和维护Ace。
CodeMirror的第一版于年发布，该版本基于浏览器的contentEditable属性实现。年发布的Ace采用了新的技术并证明即使是使用javascript操作数以千行的DOM也不存在性能问题，这驱使了CodeMirror的重构并发布了第二个版本，弃用了之前的contentEditable，性能得到了很大提升。如今，CodeMirror即将发布最新的重构版本6。
MonacoEditor算是后起之秀，随着年VSCode的发布而诞生，它与VSCode使用同样的核心代码。
快速开始
这里以不引入任何框架的，纯粹的html+css+js形式展示三类编辑器的使用。
Ace
官方示例
!DOCTYPEhtmlhtmllang=enheadmetacharset=UTF-8meta