css - 优化文本渲染速度，然后通过延迟样式表异步优化易读性是否有效？

Question

text-rendering: optimizeLegibility 是 default for most modern browsers . (编辑:不正确，但留给子孙后代。)

但是，有一个considerable performance从 text-rendering: optimizeSpeed 中获益。

目前，我内联了首屏/关键样式，使用 rel=preload 异步延迟了首屏样式。 .

我的问题是，最初在我的关键样式中使用 text-rendering: optimizeSpeed 是否有效*或值得**，然后在我的延迟/异步样式表中切换到文本渲染:optimizeLegibility?

* 有效性定义为按您期望的方式工作。最初使用“优化速度”，然后当延迟样式表异步加载时，改为使用“优化易读性”。

** 值得定义为与在我的 SS 中切换样式的(简单)过程成比例的任何超过可忽略的性能提升。

Answer 1

好吧，我想我已经回答了我自己的问题，所以我会在这里为后代留下一些东西:

• 我的问题核心的答案:全面应用 optimizeLegibility 是慢，从初始渲染时间到重新绘制 em>。所以我的结论是，即使异步加载它也不值得，因为它会延迟异步样式表的加载并导致 FOIT [1] (尤其是应用于长文本字符串时)。

• 正如 BoltClock 指出的那样，Chrome 和 Safari 默认使用 auto，而只有 Firefox 在 20px 阈值时智能切换。此外，Chrome 和 Safari 将 auto 视为 optimizeSpeed。 [2]因此，无论如何，以我的 above-fold 样式声明 oS 基本上是多余的。

  • 我认为也许最重要的是，这表明 optimizeLegibility 还没有达到可以毫无异常(exception)地使用它的地步，因为 Chrome 和 Safari 甚至不习惯使用 speed 以外的任何东西 未指定其他选项(例如 precision)。

• 不仅某些旧版浏览器缺乏支持，实际上在其他浏览器中也存在破坏交易的错误，[2]这意味着 text-rendering: optimizeLegibility 对于渐进式增强是不可行的(至少通过推迟折叠下方样式的 PE)。

最后，我submitted an issue在 caniuse 的 repo 上纠正现代浏览器默认为 optimizeLegibility 的错误声明(感谢 BoltClock 指出了这一点)。

TL;DR 它有效吗？从技术上讲，但第一部分是多余的。这值得么？不仅不值得，还有性能和 Unresolved 错误问题。