编程与软件工程gankra.github.io
文本渲染恨你
Text Rendering Hates You
2019 — 2022,它一次次回到首页
黑点是上首页(≥ 50 分)的那次投稿,空心点是没冲上去的投稿,点越大分数越高。
导读
这篇经典长文从实现者视角解释文字渲染为何远比想象复杂:从 Unicode 码点、字形选择、文本整形、连字、换行,到抗锯齿和亚像素渲染,每一步都布满坑。它梳理了渲染器、浏览器和字体栈必须处理的种种边界情况。
为什么经久不衰:它把日常被忽视的文字显示难题系统化地摊开,解释了为什么不同平台和字体会出现奇怪的渲染问题,因此多年后仍被反复讨论。
HN 评论精选
补充中日韩文字在字形选择、竖排标点和断行上的额外复杂度。
原文漏了几个小点(多与中日韩文字有关):码点有时不足以确定字形,比如 U+5199 在简体中文和日文中应显示不同;通常靠不同字体处理,更规范的是用不同 lang 属性标记。日文仍常用竖排;HTML 支持差,PDF 里常见。竖排时拉丁字母旋转 90 度(原文已提),但标点不能只旋转字形,因为中心线会偏,需要专门的旋转标点字形。与拉丁文不同,中日文字符大多可在任意位置换行,但拗音、促音等连字(如 ちょっ)不能拆开,所以要把每个字符当成独立词处理(连字算一个词)。
euske查看英文原文
A few minor things missing in OP (mostly CJK related) - Code point is sometimes not enough to determine the glyph. For example, U+5199 must look different in Simplified Chinese and Japanese. Typically this is handled by using different fonts, but more formally it should be marked with different lang attributes (in case of HTML). - Top-to-bottom writing mode is still pretty much in use in Japanese. HTML support is poor, but it's common in PDF. Caveat: Latin alphabets are rotated by 90 degree (as explained in OP), but for punctuations, simply rotating the glyph isn't enough because the center line is going to be slightly off. You need special glyphs for rotated punctuation. - Unlike Latin scripts, most Chinese and Japanese characters are free to break line at any point, but there are exceptions: contracted letters (e.g. ちょっ) cannot be split. So you'll end up with treating each letter as a separate word. (Contracted letters are treated as one word.)
抗锯齿需正确处理线性空间与 sRGB,否则字重显示会异常。
文字抗锯齿的另一个痛点是色彩空间混用。FreeType 计算抗锯齿位图时假定线性色彩空间,但据我所知 GTK 和 Qt 会直接把它应用到 sRGB 上而不做调整;结果是在白底黑字时字体看起来变粗,黑底白字时变细。编辑补充:背景可看 FreeType 文档。
leni536查看英文原文
Another pain point on text AA: Many renderers mix up colorspaces on antialiasing. For example freetype assumes a linear colorspace when calculating the antialiased bitmap but AFAIK both GTK and QT apply it directly on sRGB without any adjusting. The result is apparently thickened fonts when displayed black on white and thinned fonts when displayed white on black. Edit: Some background can be read on [0]. [0] https://www.freetype.org/freetype2/docs/text-rendering-general.html#background
字体渲染依赖 Pango、Cairo、Fontconfig 等复杂栈,Behdad 贡献巨大。
我创业就是围绕字体渲染。特别感谢 Behdad Esfahbod:只要你在屏幕上见过文字,就见过他的工作;他曾亲自帮我调试文字渲染问题。字形注册、文本整形和绘制,往往是 Pango、Cairo 等一堆库配合完成的复杂流程。如果感兴趣,还可以看看 Unix 上字体安装和注册的复杂细节,核心是几乎每台电脑都有的 Fontconfig(也是 Behdad 的作品)。文字和字体很难,感谢幕后工作者。
warent查看英文原文
I built my business around font rendering! Shout out to Behdad https://en.wikipedia.org/wiki/Behdad_Esfahbod a one of a kind man doing god's work. If you've seen text on a screen, you've seen Behdad's work. I've had the lucky opportunity to chat with him briefly and he personally helped me debug a text rendering problem. He's a great guy! Glyphs are registered, text is shaped, and everything is drawn via a ballet of various libraries, often with Pango and Cairo: https://pango.gnome.org/ https://docs.gtk.org/PangoCairo/ By the way, if you think this is interesting, you might also be curious to read about how fonts are installed/registered on Unix systems. It is a rabbit hole involving a key piece of software on pretty much every computer in the world called Fontconfig (also by Behdad) https://en.wikipedia.org/wiki/Fontconfig Text and fonts are HARD. Give a hand to those who work tirelessly behind the scenes on this stuff for us. ( Shameless plug of my site https://fontpeek.com/ )
连字在跨行断词时被切半绘制,是文字渲染边界情况的一个典型 bug。
另一个“有趣”的渲染 bug:在 Firefox 中,如果一个词在通常由连字连接的两个字符之间跨行断开,连字没有被禁用并把两个字符分别渲染,而是被切成两半跨行绘制。
nyanpasu64查看英文原文
Another Fun(tm) rendering bug: In Firefox, when a word is split across lines between two characters normally connected by a ligature, the ligature doesn't get disabled and the two characters rendered separately, but the ligature is sliced in half and rendered across lines: - https://bugzilla.mozilla.org/show_bug.cgi?id=479829 - https://bug479829.bmoattachments.org/attachment.cgi?id=363733
历次讨论
同类还值得读
开源应用架构
The Architecture of Open Source Applications
《开源软件架构》(AOSA)是一本在线免费书,邀请知名开源项目的作者亲自剖析其内部设计,涵盖 SQLAlchemy、LLVM、Audacity、Apache、Bash 等系统。
编程与软件工程上首页 9 次 · 2011–2024aosabook.org编辑精选编程语言简史:简短、不完整且多半错误
A Brief, Incomplete, and Mostly Wrong History of Programming Languages
一篇以戏谑、故意不准确的方式回顾编程语言史的博客文章,用夸张轶事和讽刺定义串起 Lisp、C、C++、Java、JavaScript、PHP 等语言。
编程与软件工程上首页 8 次 · 2009–2021james-iry.blogspot.comSQLite 是如何测试的
How SQLite is tested
SQLite 官方文档页,系统介绍 SQLite 的测试体系:多种测试方法(TCL 测试、模糊测试、回归测试、静态分析等)和海量测试用例,展示了这个小型开源项目如何靠极致测试获得…
编程与软件工程上首页 8 次 · 2009–2025sqlite.org编辑精选高级编程语言(2009)
Advanced programming languages (2009)
Matt Might 的经典文章,按用途推荐“高级编程语言”:如果追求就业就选主流语言,如果追求表达力、学术研究或创业,则推荐 Haskell、OCaml、Scala 等函数式语…
编程与软件工程上首页 8 次 · 2009–2022matt.might.net我的 Forth 与栈机器经历
Yosefk - My history with Forth & stack machines
作者以亲身经历回顾了使用 Forth 语言和栈式机器的历程:既赞叹其简洁优雅、代码量小、可自举的优点,也坦率指出栈操作在实际编程中的痛苦,以及 Forth 社区文化中的问题。
编程与软件工程上首页 8 次 · 2010–2024yosefk.com编辑精选