Prestazioni WebGL su Safari e Apple Vision Pro
Safari—specialmente su iOS—è sempre stato considerato il massimo della sfida prestazionale per gli sviluppatori che lavorano sul web 3D. L’implementazione di WebGL basata su Metal, insieme alle caratteristiche prestazionali uniche di WebKit, lo rende particolarmente interessante da affrontare.
In questo articolo, ti offriamo alcune indicazioni su come potresti migliorare le prestazioni delle tue app WebGL su Safari.
Apple Vision Pro
Negli ultimi giorni, con il lancio di Apple Vision Pro, le prestazioni di WebGL su Safari hanno acquisito ancora più importanza, poiché la versione di Safari su Apple Vision ha ereditato tutte le caratteristiche prestazionali di Safari su macOS e iOS.
Presto pubblicheremo un articolo completo su WebXR con Apple Vision Pro. Iscriviti alla nostra newsletter per ricevere notifiche.
Wonderland Engine su Apple Vision Pro
Se stai già usando Wonderland Engine, abbiamo buone notizie: tutte le ottimizzazioni che abbiamo fatto per la nostra versione 0.9.0 si trasferiscono su Apple Vision Pro.
Gli sviluppatori con accesso ad Apple Vision Pro stanno riportando ottime prestazioni sulle loro app basate su Wonderland Engine:
Ottimizzazione per Safari
Se stai usando un altro framework, assicurati di dare un’occhiata al nostro post del blog sul Profiling delle Prestazioni WebGL. Quel post contiene suggerimenti su come individuare i colli di bottiglia della tua applicazione per capire cosa ottimizzare.
Inoltre, ecco alcune note su ciò che potresti trovare in Safari durante il profiling. Queste non si adattano a tutte le situazioni, profila la tua applicazione per scoprire quali di queste ti causano problemi.
Collo di Bottiglia
Ecco alcuni problemi caratteristici che potresti incontrare lavorando con WebGL su Safari:
Buffer Uniformi
A causa di come l’API grafica di Apple Metal differisce da WebGL, Safari deve emulare un buffer uniforme in stile WebGL sotto il cofano. Questa emulazione comporta alcune difficoltà nel prevedere le prestazioni degli UBO: alcuni usi andranno bene, mentre altri potrebbero causare un blocco di 150 ms quando si tenta di caricare i dati nel momento sbagliato.
Questo snippet di codice dall’implementazione di Metal di Angle (che viene utilizzato da WebKit per implementare l’API WebGL2) indica l’implementazione dell’equivalente GLES del bufferSubData di WebGL. Ci aiuta ad apprezzare fino a che punto si spingano gli sviluppatori di browser per fornirci una API grafica coerente. Mostra anche fino a che punto si spinge il team di Wonderland Engine per farti capire le prestazioni del browser e ottimizzare per te.
C’era molto disappunto sul fatto che Safari stesse impiegando molto tempo a rilasciare il supporto per WebGL2. Contrariamente alle speculazioni secondo cui non l’avrebbero mai supportato, hanno rilasciato il supporto per WebGL2 in settembre 2021 con Safari 15. Leggere il codice di WebKit e Angle solleva un po’ di empatia su perché potrebbe non essere stato un compito facile da portare a termine.
Accesso allo Stato WebGL
La funzione getParameter di WebGL ha alcune sorprese in termini di prestazioni in serbo per te. Quella che sembra una funzione innocua può comportare un elevato costo in termini di prestazioni.
Errore WebGL
Mentre controllare gli errori con getError è generalmente una buona idea, evita di farlo al di fuori della tua callback di frame, poiché potrebbe essere più costoso del previsto.
Memoria e Limiti
WebGL su Safari riporterà i limiti per le dimensioni delle texture, i livelli, le dimensioni dei buffer uniformi e altro ancora. Un buon strumento per controllare questi limiti è webglreport.com.
Sebbene Safari ti permetta teoricamente di allocare fino a questi limiti, potresti scoprire che ciò può causare il crash della tua pagina.
Per utilizzare in modo più efficiente le risorse di memoria su iOS, Wonderland Engine fornisce una funzionalità che chiamiamo Texture Streaming, per scambiare dinamicamente frammenti di texture dentro e fuori dalla memoria in base a ciò che è attualmente necessario nel frame. È abilitato di default.
Parole Finali
Seguirà presto un post dettagliato sul blog su WebXR su Apple Vision Pro. Iscriviti alla nostra newsletter per ricevere una notifica quando lo rilasceremo.
Fino ad allora, speriamo che provi Wonderland Engine! Soprattutto se provieni da Unity, Wonderland Engine è facile da imparare.
Assicurati di unirti al nostro server Discord, saremo felici di indirizzarti verso le risorse giuste per iniziare.