Text in ThreeJs

Hintergrund

Erstaunlicherweise ist das Anzeigen von simplen Text in ThreeJS ein Problem. So haben wir in unserem Projekt eine unterirdisch schlechte Performance bei der Anzeige von nur ca. 1000 Zeichen mit der offiziellen TextGeometry. Eventbrite wunderte sich in diesem Blogpost bereits 2015, dass das damals immer noch ein Problem war und fand eine etwas aufwändig anmutende Lösung für sich. Nicht sonderlich hilfreich ist aktuell noch diese offizielle Seite mit entsprechenden Empfehlungen, da die Pros&Cons nicht klar sind und funktionierende einfache Beispiele fehlen.

Lösung: Troika-Text

Aus meiner Erfahrung ist der performanteste Ansatz der Troika-Text. Ein lauffähiges einfaches Beispiel:

Überraschend für mich, dass es zwingend einen Animationloop braucht …