GPU-Text-Rendering ist ein ewiger Deal: Bildqualität, Speicherbedarf und Rechenkosten kann man nie gleichzeitig gewinnen. Genau darüber vergleicht ein Beitrag auf alphapixeldev.com fünf Ansätze, SDF, MSDF, Slug, Rive und vorgerenderte Texturen. Der Kernbefund der Quelle: SDF speichert Distanzen zur Schriftkontur statt Pixeln, hält Text beim Vergrößern sauber, erkauft das aber mit runden Ecken.
Ich habe Text in Engines bisher eher pragmatisch behandelt: einmal als Bitmap rendern, als Textur draufkleben, fertig. Zoomt man da rein, erinnert das entfernt an ein Fax. Diese Meldung nimmt genau diese Fax-Optik auseinander, also habe ich mir die Sache genauer angesehen.
Warum ist Text auf der GPU überhaupt ein Kompromiss?
Weil jedes Verfahren zwischen zwei Lagern wählt: Ansätze, die vorab generierte Texturen sampeln, und Ansätze, die Schriftkonturen direkt verarbeiten. Laut der Quelle pendeln beide über dieselben drei Achsen, Bildqualität, Speicher und Rechenkosten. Wer gestochen scharfe Schrift in jeder Zoomstufe will, zahlt an einer anderen Stelle drauf. Eine Methode, die alle drei Achsen gewinnt, beschreibt die Quelle nicht.
Genau diese Ehrlichkeit ohne „ein Gewinner verdrängt alles“-Gehabe hat mir am Artikel gefallen. Offen bleibt trotzdem, wo die eigene Schmerzgrenze liegt: Speicher oder Ecken.
Wie funktioniert SDF beim Text-Rendering?
SDF speichert pro Pixel nicht die Farbe, sondern die Entfernung bis zur nächsten Schriftkontur. Als Effekt nennt die Quelle eine deutlich bessere Qualität beim Vergrößern, weil keine feste Pixelrastervorlage hochskaliert wird. Den Preis trägt jeder Buchstabe: Ecken laufen rund zu. Warum das passiert, führt der übermittelte Text der Quelle nicht weiter aus.
Für mich wird es danach dünn: MSDF, Slug und Rive erscheinen erst einmal nur als Vergleichskandidaten. Die vollständige Fassung auf alphapixeldev.com dürfte mehr Substanz haben als der Auszug, der mir vorliegt. Zahlen oder Messwerte sehe ich in dieser Fassung jedenfalls nicht, und erfinden will ich keine.
Kurz beantwortet
Welche Verfahren vergleicht der Beitrag? SDF, MSDF, Slug, Rive und den Textur-Ansatz, das zeigt die Überschrift der Quelle. Zu den meisten nennt der Text allerdings nur die Namen.
Was ist der Trick hinter SDF? Gespeichert wird die Distanz zur Kontur statt des Pixels, erklärt die Quelle. Deshalb skaliert die Schrift glatt mit.
Was ist der Haken? Runde Ecken, ebenfalls laut Quelle. Bei UI-Text mit vielen spitzen Serifen ist das kein kleines Detail.
Meine Interpretation: Solange SDF Keile in Großbuchstaben zu runden Backsteinen macht, ist das Verfahren für UI-Schrift ein Angebot mit Kleingedrucktem. Die eigentlich spannende Frage lautet deshalb: Würdest du für garantiert rechte Ecken aufs stufenlose Zoomen verzichten, oder nimmt dein UI die runde Ecke als Steuer für die Schärfe gern in Kauf?