Unsere Startseite trägt fünfzigmal weniger Text

PageToVid spricht vier Sprachen, und die Texte der Oberfläche liegen in 56 Gruppen von Übersetzungen: Fehler, Navigation, Preise, Editor, Animationsbibliothek und viele mehr. Die erste Version der Website, als es nur ein Dutzend Gruppen gab, gab jeder Seite alle mit. Bei dieser Größe war das eine vernünftige Wahl.

Die Website wuchs weiter, und jede neue Funktion brachte ihre eigene Gruppe mit. Die Startseite trug am Ende 139 KB Übersetzungstext, größtenteils für den Editor, das Dashboard und andere Ansichten, die ein neuer Besucher nie öffnet. Nichts sah falsch aus; die Seiten waren einfach schwerer als nötig.

Jetzt bekommt jeder Teil der Website nur, was er liest. Die gemeinsame Ebene trägt eine kurze Liste, etwa Fehler, Navigation und Adressleiste, zusammen 2,6 KB. Jeder Bereich der Website, vom Editor bis zu den Animationsseiten, ergänzt die Gruppen, die er braucht, mit einer kleinen Hülle namens ClientMessages.

Es gibt eine Feinheit. In der Übersetzungsbibliothek, die wir nutzen, ersetzt die Liste eines Bereichs die gemeinsame Liste, statt sie zu ergänzen. Jede Liste muss also alles enthalten, was ihr Bereich liest. Das von Hand zu pflegen wäre fragil, deshalb läuft ein neuer Test durch die Importe jeder Route und schlägt in zwei Fällen fehl: wenn eine Komponente Worte liest, die ihre Route nicht schickt, und wenn eine Route Worte schickt, die niemand liest.

Dieselbe Prüfung fand eine größere Datei, die weiter reiste als nötig. Unsere Animationsbibliothek hat einen vollständigen Katalog von Vorlagen, etwa 1,5 MB groß. Eine kleine Hilfsfunktion des Editors und der Animationsseiten brauchte daraus nur ein paar Beispielzeilen, aber der Import brachte den ganzen Katalog in den Browser.

Die Hilfsfunktion liest jetzt eine kleine generierte Datei mit genau diesen Zeilen, die bei jeder Katalogänderung neu entsteht. Die Detailseite einer Animation lädt ihren Vorschau-Player erst bei Bedarf, und nur der Text in deiner Sprache erreicht die Animationsseiten. Ein Test auf den Browser-Code verhindert, dass der Katalog zurückkehrt. Im selben Sinn lädt der Kaufcode jetzt nur noch auf den Seiten, auf denen du etwas kaufst.

Der Rest der Arbeit drehte sich darum, pro Anfrage weniger zu tun:

• während dein Video entsteht, fragt seine Seite eine schlanke Zusammenfassung ab (Phase, geschätzte Zeit, Szenenzahl) statt des ganzen Projekts, und fragt nach einer Minute oder im Hintergrund-Tab seltener;
• die Wiedergabeseite eines Videos liest es einmal pro Besuch, nicht einmal pro Komponente;
• Galerie und Schaufenster der Startseite bleiben zehn Minuten lang bereit;
• Vorschaubilder der Galerie laden direkt aus dem Speicher, mit vorab bekannter Größe, während du scrollst;
• Icons, Töne und Schaufensterbilder werden einen Tag lang zwischengespeichert;
• untätige Verbindungen von Assistenten schließen sich nach 20 Sekunden, statt offen zu bleiben;
• die langsamsten Datenbankabfragen haben Indizes bekommen.

Auch KI-Videoclips bleiben bei einem zweiten Versuch auf der schnellen Variante ihres Modells, und ein Aufruf, der einmal in eine Zeitüberschreitung läuft, wird einfach wiederholt.

Nichts davon verändert ein einziges Bild deines Videos. Du merkst es anderswo: Die Videogalerie und die Startseite öffnen sich auf dem Handy schneller, die Videoseite bleibt beim Warten leicht, und ein Besuch verlangt den Servern dahinter weniger ab.

Auf einer Website, auf der jede Seite für jeden Besucher frisch erzeugt wird, zählt das mehr, als es klingt. Leichtere Seiten bedeuten weniger Kaltstarts, schnellere Antworten und einen flüssigeren ersten Eindruck.

Das war kein schweres Problem. Es war eine Voreinstellung aus der Zeit, als die App klein war, und niemand hatte einen Grund, sie zu überprüfen, während sie von einem Dutzend Wortgruppen auf 56 wuchs.

Die Lehre, die wir mitnehmen: Ein Größenbudget braucht einen Test, kein gutes Gedächtnis. Die zwei neuen Testreihen lassen den Build an dem Tag scheitern, an dem jemand eine große Datei in einen kleinen Knopf importiert oder vergisst, einem Bereich die Worte zu schicken, die er braucht.