我一直在尝试使用高级排版构建基于网络的设计应用程序。
不幸的是，HTML 画布在文本渲染方面没有太大的能力，似乎是实现这一点的主要障碍。
Freetype 有 python 绑定，似乎有一个通过 node js 的实现，但我的问题是：
即使 freetype 可以通过节点访问...它是否允许实时排版，还是总是向最终用户提供页面/画布上的静态渲染图像/结果？
换句话说...在技术上是否可以想象拥有一个带有可拖动/可拖放和可编辑文本框的前端，其类型通过 freetype 而不是浏览器呈现？
【问题讨论】：
标签： jquery html node.js canvas freetype
你不是唯一一个玩弄这个想法的人...... :-)
目前这会很困难，与其说是渲染能力，不如说是因为没有完全实现TextMetric object1)。
标准是这样指定对象的：
interface TextMetrics {
// x-direction
readonly attribute double width; // advance width -- only one implemented (!)*
readonly attribute double actualBoundingBoxLeft;
readonly attribute double actualBoundingBoxRight;
// y-direction
readonly attribute double fontBoundingBoxAscent;
readonly attribute double fontBoundingBoxDescent;
readonly attribute double actualBoundingBoxAscent;
readonly attribute double actualBoundingBoxDescent;
readonly attribute double emHeightAscent;
readonly attribute double emHeightDescent;
readonly attribute double hangingBaseline;
readonly attribute double alphabeticBaseline;
readonly attribute double ideographicBaseline;
};
* 在撰写本文时。
您需要这些属性中的大部分才能进行高级排版（以及轴承）。
有一些方法可以解决这个问题，方法是使用一系列字体/字体，并使用其他平台来遍历字体并将字体的特征（如上述特征）存储为 em 单元中的元数据。
渲染能力和性能可以通过智能（图像）缓存和巧妙设置您打算使用的字体以多种方式解决 - 全部在客户端 - 这不是真正的问题 IMO（但主题也是在这里广泛涵盖）。请记住，屏幕上的外观将是预览（在 72/96 任意 DPI/PPI 与典型的 300 DPI 打印相比）。
即使可以通过节点访问 freetype...它是否允许实时 排版还是总是为最终用户提供静态渲染 页面/画布上的图像/结果？
这种方法只会在实时使用（服务器渲染 + 位图传输到客户端）的上下文中引入另一个延迟，这可能比直接使用画布渲染字形的内部路径要慢。
您也许可以使用它来渲染 缓存 字形（为了在所有浏览器平台上保持一致性，但不能用于实时渲染），前提是它还为您提供字形度量数据，否则您将很难是时候将字形正确准确地放置在屏幕上了。
另外作为附注：不要忘记您还必须有一个目标文件格式（这意味着您还需要为这种格式编写一个解析器）来存储您的文档结构（即 ODF， PDF 或其他一些众所周知且受支持的格式）。
作为提示：看看 Mozilla Firefox 用作内部 PDF 解析器和查看器的 PDF.js 项目，它可以显示一种组织和构造所有这些对象以呈现到屏幕的方法（我不推荐伪- 文本格式为 PDF，用于 internal 处理，但为了构建排版文档，请检查它。
1) 我们只能推测（我知道我有）为什么 TextMetric 尚不可用，因为数据已经从文本渲染引擎内部可用，这应该是一件简单的事情将这些数字映射到与当前字体关联的TextMetric 对象。
如果它有战略原因，并且“某些”希望在首次发布时以在线更先进的“WORD/DOC/WRITE”为先；我不知道，但希望这些数据能在不久的将来提供。同时，带有预定义字体元数据的 LUT（查找表）可能是度量部分的一种方法。
【讨论】：