受现代软件质量和“他们不再像以前那样制造Sublime Text anymore”的启发，作者踏上了构建自定义文本编辑器的旅程。旅程探索了三种渲染方式：<canvas>、contenteditable和<textarea>。

初始的<canvas>实验实现了60–120 FPS的渲染，但缺乏原生交互性。实现基本功能如光标定位、输入和行高亮揭示了缺失的基本要素：文本选择、撤销/重做和溢出滚动。使用隐藏的<div>进行原生滚动计算的混合方案改善了滚动，但<canvas>在根本上仍然不可访问。

切换到contenteditable="plaintext-only"提供了原生选择、撤销历史和可访问性。Selection API启用了自定义光标渲染，尽管在较大文件中性能会不可预测地下降，尤其是在Chromium中。

最后，<textarea>方法在较长文本上证明了更高的性能。语法高亮通过Micro Lighter的第三层添加，尽管新的Opaque Range API可能实现原生高亮。作者指出，Tree-sitter和虚拟滚动可以提高鲁棒性，但承认当前演示代表“90%的文本编辑器，只有1%的功能”。

关键实体：公司：Apple，Chromium，Web Kit，Firefox

FAQ：为什么<textarea>比contenteditable在大文本文件上更高效？

<textarea>是浏览器为纯文本输入优化的原生表单控件，避免了contenteditable的复杂布局和渲染开销，即使在plaintext-only模式下，它也必须处理富文本格式、拼写检查和任意HTML结构。