HeadlinesBriefing favicon HeadlinesBriefing.com

SDF vs MSDF vs Slug: GPUテキストレンダリングガイド

Hacker News •
×

SDF、MSDF、Slug、テクスチャアトラス、またはRiveの間でテキストレンダリングアルゴリズムをどのように選択しますか?テキストは、自分で描画する必要があるまで単純に見えます。文字はアウトラインのセットです。直線とベジェ曲線の閉じたループで、ワインディングルールに従って塗りつぶされます。CPUでビットマップに描画することは解決されています。GPUで、任意のサイズで、任意の3D変換の下で、テキストが毎フレーム変化する間に、鮮明に描画することは解決されていません。

ほとんどのエンジンは、グリフを事前にテクスチャにベイク処理することで難しいバージョンを回避しています。2017年に、Eric LengyelはSlugを公開しました。これは、フラグメントシェーダーでアウトラインから直接グリフをレンダリングし、テクスチャアトラスやフレームごとのテッセレーションを必要としません。Lengyelは2019年に特許を取得し、2026年3月17日にその特許をパブリックドメインに捧げました。このガイドでは、ビットマップアトラスからSlugまでのGPUテキストレンダリングの仕組みを説明します。

方法1のテクスチャアトラスは、各グリフを共有テクスチャに一度ラスタライズします。高速ですが、スケーリング時に問題が発生します。ベイクされたサイズを超えて拡大すると、グリフがぼやけます。鮮明にしたいサイズごとに別のアトラスが必要になり、中国語、日本語、韓国語などの言語はメモリ災害を引き起こします。方法2の符号付き距離場(SDF)は、最も近いエッジまでの距離を格納します。距離は滑らかに補間されるため、小さなSDFテクスチャを劇的に拡大して、クリーンなエッジを得ることができます。長い間、これは鮮明なUIテキストのデフォルトでしたが、SDFは依然としてベイクされたテクスチャです。