<分区>
是否有指向有关 Google 文档布局引擎的更深入细节的链接？如果它使用 webgl，或 Canvas 元素 2d 上下文，或任何东西。我知道谷歌从头开始计算字符宽度和所有内容。
我在阅读关于 Bespin 的文章，它说它存在一些性能问题，所以我想知道谷歌做了什么来让它变得更快。 我只是找不到有关他们如何做的任何详细信息。
只有当它是开源的...
顺便说一句，我试过 benjamn/kix-standalone 但来自 github 的源代码根本不可读:
function $a(a) {
return Wa(a) == Ta
}
function ab(a) {
var b = Wa(a);
return b == Ta || b == Ra && typeof a.length == Sa <br/>
}
最佳答案
Google 文档在隐藏的输入元素中和/或通过键盘和鼠标事件捕获您的所有输入，然后通过完全用 Javascript 实现的自定义界面和布局引擎将文档内容布置到您的屏幕上。
显示器上从文本到光标本身的所有内容都由 DOM 元素组成。例如，光标不是由浏览器直接呈现的，而是由位于正确位置的 1 像素宽的 div 呈现的。您可以使用 Chrome 的检查功能来查看 Google 文档创建的 DOM，以查看该引擎的运行结果。有关详细信息，另请参阅 Google 文档产品经理的这篇博文:http://googledrive.blogspot.ca/2010/05/whats-different-about-new-google-docs.html .正如您在问题中提到的，这种类型的光标定位所需的字符宽度是即时计算的。
为了获得更多洞察力，查看类似(虽然显然更简单)项目的实现可能会有所帮助:Ritzy是一个新的开源富文本编辑器，它包含自定义 javascript 表面和布局引擎，就像 Google Docs 一样。它的 DOM 操作使用 Facebook React .据我所知，这是该技术的第一个开源实现。它包含类似 Google 文档的字符宽度和光标定位计算(参见 TextFontMetrics.js )，可以作为有用的学习工具。
免责声明:我是上述项目的作者。
关于javascript - Google 文档表面引擎，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12403863/