WebGL-Performance auf Safari und Apple Vision Pro
Safari – insbesondere auf iOS – wurde schon immer als die größte Performance-Herausforderung für Entwickler betrachtet, die auf dem 3D-Web arbeiten. Die auf Metal basierende Implementierung von WebGL zusammen mit den einzigartigen Leistungsmerkmalen von WebKit machen es besonders interessant zu handhaben.
In diesem Artikel geben wir Dir einige Einblicke, wie Du die Leistung Deiner WebGL-Apps auf Safari verbessern könntest.
Apple Vision Pro
In den letzten Tagen, mit der Einführung des Apple Vision Pro, hat die WebGL-Leistung auf Safari noch mehr an Bedeutung gewonnen, da die Safari-Version von Apple Vision alle Leistungsmerkmale von Safari auf MacOS und iOS geerbt hat.
Wir werden bald einen vollständigen Artikel über WebXR mit Apple Vision Pro veröffentlichen, abonniere unseren Newsletter, um benachrichtigt zu werden.
Wonderland Engine auf Apple Vision Pro
Wenn Du bereits die Wonderland Engine nutzt, haben wir gute Neuigkeiten: Alle Optimierungen, die wir für unser 0.9.0 Release vorgenommen haben, übertragen sich auf Apple Vision Pro.
Entwickler mit Zugang zum Apple Vision Pro berichten von großartigen Leistungen ihrer auf der Wonderland Engine basierten Apps:
Optimierung für Safari
Wenn Du mit einem anderen Framework arbeitest, schau Dir unbedingt unseren WebGL Performance Profiling Blogpost an. Dieser Blogpost enthält Tipps, wie Du die Engpässe Deiner Anwendung finden kannst, um herauszufinden, was optimiert werden muss.
Zusätzlich findest Du unten einige Anmerkungen dazu, was Du in Safari beim Profiling finden könntest. Das sind keine Einheitslösungen, profiliere Deine Anwendung, um herauszufinden, welche dieser Punkte Dir Probleme bereiten.
Engpässe
Hier sind einige weitere charakteristische Probleme, die Du möglicherweise beim Arbeiten mit WebGL auf Safari antreffen könntest:
Uniform Buffers
Aufgrund der Unterschiede zwischen Apples Grafik-API Metal und WebGL muss Safari einen WebGL-ähnlichen Uniform-Buffer im Hintergrund emulieren. Diese Emulation erschwert die Vorhersage der Leistung von UBOs: Einige Verwendungen sind in Ordnung, während andere einen 150ms-Einbruch verursachen können, wenn versucht wird, Daten zum falschen Zeitpunkt hochzuladen.
Dieser Code-Schnipsel aus der Metal-Implementierung von Angle (die von WebKit zur Implementierung der WebGL2-API verwendet wird) zeigt die Implementierung des GLES-Äquivalents zu WebGLs bufferSubData. Er hilft uns zu schätzen, welcher Aufwand von Browser-Entwicklern betrieben wird, um uns ein konsistentes Grafik-API zu bieten. Er zeigt auch den Aufwand, den das Wonderland Engine-Team für Dich betreibt, um die Browser-Leistung zu verstehen und für Dich zu optimieren.
Es gab viel Unmut darüber, dass Safari so lange für die Unterstützung von WebGL2 gebraucht hat. Entgegen der Spekulationen, dass sie es vielleicht nie unterstützen würden, haben sie die Unterstützung für WebGL2 im September 2021 mit Safari 15 veröffentlicht. Das Lesen des WebKit- und Angle-Codes weckt etwas Empathie dafür, warum es möglicherweise keine leichte Aufgabe war, dies zu bewerkstelligen.
WebGL State Access
Die getParameter-Funktion von WebGL hat einige Performance-Überraschungen für Dich parat. Was wie eine harmlose Funktion erscheint, kann viel Performance-Budget kosten.
WebGL Error
Während das Überprüfen von Fehlern mit getError im Allgemeinen eine gute Idee ist, vermeide es außerhalb Deines Frame-Callbacks, da es teurer sein kann, als es sollte.
Speicher und Limits
WebGL Safari wird Limits für Texturgrößen, Schichten, Uniform-Buffer-Größen und mehr melden. Ein gutes Werkzeug, um diese Limits zu überprüfen, ist webglreport.com.
Während Safari Dir theoretisch erlaubt, bis zu diesen Limits zu allocieren, kann es passieren, dass Deine Seite abstürzt.
Um Speicherressourcen auf iOS effizienter zu nutzen, bietet die Wonderland Engine ein Feature namens Texture Streaming, um Teile von Texturen dynamisch basierend auf dem aktuellen Bedarf im Frame ein- und auszutauschen. Es ist standardmäßig aktiviert.
Schlussworte
Wir werden in Kürze mit einem detaillierten Blogpost über WebXR auf Apple Vision Pro folgen. Abonniere unseren Newsletter, um benachrichtigt zu werden, wenn wir ihn veröffentlichen.
Bis dahin hoffen wir, dass Du der Wonderland Engine eine Chance gibst! Vor allem, wenn Du von Unity kommst, ist Wonderland Engine einfach zu lernen.
Stell sicher, dass Du unserem Discord-Server beitrittst, da wir Dir gerne die richtigen Ressourcen zum Einstieg zeigen.