Eseguire il debug dei problemi di animazione

Uno dei problemi più difficili per gli sviluppatori di app è creare animazioni fluide e senza problemi. Il debug può essere particolarmente difficile quando il sistema esegue anche attività in background che richiedono molte risorse. Può essere difficile determinare se un problema è causato dall'app o dal sistema. Tuttavia, uno strumento di profilazione può aiutarti a identificare la possibile origine del comportamento anomalo.

Rendering su ChromeOS

Un'app ottimizzata, come un gioco, di solito utilizza il doppio buffering per mantenere il tempo di risposta dell'utente il più basso possibile. Tuttavia, molti fattori possono peggiorare le prestazioni. Ad esempio, se il rendering di un frame richiede troppo tempo, il risultato non è pronto per il successivo scambio di buffer e il frame precedente viene ripetuto.

A questo punto, il renderer non può iniziare a eseguire il rendering del frame successivo, causando ancora più problemi. Questo scenario è familiare agli sviluppatori di app mobile per Android. Quando un'app viene eseguita su ChromeOS, il contesto è ancora più complesso.

Un'app in esecuzione sul desktop non viene visualizzata direttamente nel frame del display dello schermo. Visualizza invece i dati in una texture. Di solito ci sono più app, ognuna delle quali esegue il rendering della grafica in una texture. Il sistema costruisce la visualizzazione sullo schermo utilizzando un compositore per combinare tutte le texture in un'unica immagine del desktop.

Il compositore funziona in modo trasparente in background, ma introduce un ritardo di un frame per massimizzare l'utilizzo della pipeline della GPU. Questo ritardo attenua le fluttuazioni delle prestazioni del sistema e contribuisce a bilanciare un carico asimmetrico.

Quando il sistema operativo è in funzione, la GPU può essere compressa, causando un ritardo tra il rendering di un frame e la sua visualizzazione sullo schermo. A seconda dell'hardware, il sistema potrebbe utilizzare il quadruplo buffering per compensare. Anche con un buffering più profondo, la pipeline grafica può comunque presentare problemi.

Tracciatore di grafici ARC

ChromeOS dispone di uno strumento di profilazione che mostra come i buffer si propagano nel sistema, quando si verificano scambi di memoria, il livello di utilizzo di CPU/GPU e cosa sta facendo la tua applicazione in un determinato momento, come mostrato nell'immagine seguente:

L'interfaccia utente di ARC Graphics Tracer, che mostra le sequenze temporali per i processi di sistema.
Figura 1. L'interfaccia utente di ARC Graphics Tracer, che mostra le sequenze temporali dei processi di sistema.

Configurare il profiler

Per utilizzare il profiler, devi eseguire M75 o versioni successive. Per risultati ottimali, utilizza un dispositivo Intel.

Prima di utilizzare il profiler, inserisci tracce nella tua app. Aggiungi Trace.traceCounter(Trace.TRACE_TAG_GRAPHICS, "Event", <number>); al codice ovunque tu voglia includere una traccia. Utilizza un Event che inizia con il prefisso customTrace. Il prefisso non viene visualizzato nel messaggio di traccia.

Per configurare il profiler:

  1. Attiva la modalità sviluppatore.
  2. Attiva le impostazioni di Chrome e abilita lo strumento di visualizzazione dei buffer grafici ARC.
  3. Vai a chrome://arc-graphics-tracing.

Esegui il profiler

  1. Seleziona stop on glitch.
  2. Esegui l'app per Android.
  3. Quando l'app per Android è attiva e in primo piano, premi Control+Shift+G.

Quando si verifica un problema, viene visualizzata una finestra del browser. Utilizza i tasti W e S per aumentare e diminuire lo zoom della sequenza temporale.