Riduzione dell'uso della CPU

In Flash Player 10.1 sono state introdotte due nuove funzioni che permettono di ridurre l'elaborazione della CPU. Mettono infatti in pausa e riprendono l'esecuzione del contenuto SWF quando esce dallo schermo e limitano il numero di istanze di Flash Player in una pagina.

Flash Player 10.1 e AIR 2.5 dispongono di una nuova funzione per i dispositivi mobili che consente di ridurre l'attività di elaborazione della CPU e, di conseguenza, aumentare l'autonomia della batteria. Questa funzione sfrutta la retroilluminazione disponibile in molti dispositivi mobili. Se un utente sta utilizzando, ad esempio, un'applicazione mobile e a un certo punto viene interrotto e smette di utilizzare il dispositivo, il runtime rileva il momento in cui la retroilluminazione entra in modalità sleep. Abbassa quindi la frequenza dei fotogrammi a 4 fotogrammi al secondo (fps) e sospende il rendering. Per le applicazioni AIR, la modalità sleep viene attivata anche quando l'applicazione passa all'esecuzione in background.

il codice ActionScript continua a essere eseguito in modalità sleep, analogamente a quanto avviene quando la proprietà Stage.frameRate è impostata su 4 fps. La fase di rendering però viene saltata, quindi l'utente non nota che il lettore sta funzionando a 4 fps. È stata scelta una frequenza di 4 fps anziché zero perché consente di mantenere aperte tutte le connessioni (NetStream, Socket e NetConnection), mentre una frequenza pari a zero le chiuderebbe. È stata scelta una frequenza di aggiornamento di 250 ms (4 fps) perché molti produttori di dispositivi mobili usano lo stesso valore per la frequenza di aggiornamento del dispositivo. In questo modo la frequenza di aggiornamento del runtime corrisponde esattamente a quella del dispositivo.

Quando la retroilluminazione viene riattivata, il rendering viene ripreso e la frequenza dei fotogrammi ritorna all'impostazione originale. Immaginate un'applicazione come un lettore multimediale utilizzata da un utente per ascoltare della musica. Se lo schermo entra in modalità sleep, il runtime risponde in base al tipo di contenuto in corso di riproduzione. Ecco alcune possibili situazioni con il comportamento del runtime corrispondente:

• La retroilluminazione entra in modalità sleep ed è in corso di riproduzione un contenuto non audiovisivo: il rendering viene messo in pausa e la frequenza fotogrammi impostata su 4 fps.

• La retroilluminazione entra in modalità sleep ed è in corso di riproduzione un contenuto audiovisivo: il runtime forza la retroilluminazione a rimanere attiva per non interrompere le attività dell'utente.

• La retroilluminazione passa dalla modalità sleep alla modalità attiva: il runtime imposta la frequenza fotogrammi sullo stesso valore di quella del file SWF originale e riprende il rendering.

• Flash Player viene messo in pausa durante la riproduzione di un contenuto audiovisivo: il comportamento di sistema predefinito della retroilluminazione viene ripristinato perché non è più in esecuzione un contenuto audiovisivo.

• Il dispositivo mobile riceve una chiamata mentre è in corso di riproduzione un contenuto audiovisivo: il rendering viene messo in pausa e la frequenza fotogrammi impostata su 4 fps.

• La modalità sleep della retroilluminazione viene disattivata su un dispositivo mobile: il runtime continua a funzionare normalmente.

Quando la retroilluminazione entra in modalità sleep, li rendering viene sospeso e la frequenza fotogrammi rallenta. Questa funzione consente di ridurre il carico di lavoro della CPU ma non è affidabile per creare una vera pausa, come in un videogioco.

Per bloccare e sbloccare correttamente gli oggetti, utilizzate gli eventi REMOVED_FROM_STAGE e ADDED_TO_STAGE .

Per ottimizzare il codice, bloccate e sbloccate sempre gli oggetti. È importante farlo per tutti gli oggetti, ma in modo particolare per gli oggetti di visualizzazione. Anche se degli oggetti di visualizzazione non sono più presenti nell'elenco di visualizzazione e sono in attesa di essere eliminati dal processo di garbage collection, potrebbero comunque continuare a utilizzare codice caratterizzato da un uso intensivo della CPU. Ad esempio, potrebbero ancora utilizzare l'evento Event.ENTER_FRAME. Di conseguenza, è importantissimo bloccare e sbloccare correttamente gli oggetti utilizzando gli eventi Event.REMOVED_FROM_STAGE and Event.ADDED_TO_STAGE . L'esempio seguente mostra un clip filmato in riproduzione sullo stage che interagisce con la tastiera:

// Listen to keyboard events 
stage.addEventListener(KeyboardEvent.KEY_DOWN, keyIsDown); 
stage.addEventListener(KeyboardEvent.KEY_UP, keyIsUp); 
  
// Create object to store key states 
var keys:Dictionary = new Dictionary(true); 
  
function keyIsDown(e:KeyboardEvent):void 
{ 
    // Remember that the key was pressed 
    keys[e.keyCode] = true;     
  
    if (e.keyCode==Keyboard.LEFT || e.keyCode==Keyboard.RIGHT) 
    { 
        runningBoy.play(); 
    } 
} 
  
function keyIsUp(e:KeyboardEvent):void 
{ 
    // Remember that the key was released 
    keys[e.keyCode] = false; 
  
    for each (var value:Boolean in keys) 
          if ( value ) return; 
    runningBoy.stop(); 
} 
  
runningBoy.addEventListener(Event.ENTER_FRAME, handleMovement); 
runningBoy.stop(); 
  
var currentState:Number = runningBoy.scaleX; 
var speed:Number = 15; 
  
function handleMovement(e:Event):void 
{ 
    if (keys[Keyboard.RIGHT]) 
    { 
        e.currentTarget.x += speed; 
        e.currentTarget.scaleX = currentState;     
    } else if (keys[Keyboard.LEFT]) 
    { 
        e.currentTarget.x -= speed; 
        e.currentTarget.scaleX = -currentState; 
    } 
}

Visualizzazione dell’elemento grafico a dimensioni intere

Clip filmato che interagisce con la tastiera

Quando viene fatto clic sul pulsante Remove, il clip filmato viene rimosso dall'elenco di visualizzazione:

// Show or remove running boy 
showBtn.addEventListener (MouseEvent.CLICK,showIt); 
removeBtn.addEventListener (MouseEvent.CLICK,removeIt); 
 
function showIt (e:MouseEvent):void 
{ 
    addChild (runningBoy); 
} 
 
function removeIt(e:MouseEvent):void 
{ 
    if (contains(runningBoy)) removeChild(runningBoy); 
}

Ciononostante, il clip filmato continua a inviare l'evento Event.ENTER_FRAME . Il clip filmato è ancora in esecuzione, ma non ne viene eseguito il rendering. Per gestire correttamente questa situazione, intercettate gli eventi appropriati e rimuovete i listener di eventi, per impedire l'esecuzione del codice che fa un uso intensivo della CPU:

// Listen to Event.ADDED_TO_STAGE and Event.REMOVED_FROM_STAGE 
runningBoy.addEventListener(Event.ADDED_TO_STAGE,activate); 
runningBoy.addEventListener(Event.REMOVED_FROM_STAGE,deactivate); 
 
function activate(e:Event):void 
{ 
    // Restart everything 
    e.currentTarget.addEventListener(Event.ENTER_FRAME,handleMovement); 
} 
 
function deactivate(e:Event):void 
{ 
    // Freeze the running boy - consumes fewer CPU resources when not shown 
    e.currentTarget.removeEventListener(Event.ENTER_FRAME,handleMovement); 
    e.currentTarget.stop(); 
}

Quando si preme il pulsante Show, il clip filmato viene riavviato, gli eventi Event.ENTER_FRAME vengono intercettati di nuovo e la tastiera controlla correttamente il clip filmato.

A partire da Flash Player 10 e AIR 1.5, è presente anche il seguente comportamento. Se l'indicatore di riproduzione incontra un fotogramma vuoto, l'oggetto di visualizzazione viene bloccato automaticamente anche se non avete implementato alcun comportamento di blocco.

Il concetto di blocco è importante anche quando caricate contenuto tramite la classe Loader. Quando si usava la classe Loader con Flash Player 9 e AIR 1.0, era necessario bloccare manualmente il contenuto intercettando l'evento Event.UNLOAD inviato dall'oggetto LoaderInfo. Ogni oggetto doveva essere bloccato manualmente e il carico di lavoro non era indifferente. Flash Player 10 e AIR 1.5 hanno introdotto un importante nuovo metodo nella classe Loader, ovvero unloadAndStop() . Questo metodo vi consente di scaricare un file SWF, bloccare automaticamente ogni oggetto nel file SWF caricato e imporre l'esecuzione del garbage collector.

Nel codice seguente, il file SWF viene caricato e quindi scaricato con il metodo unload() , che richiede più lavoro di elaborazione e il blocco manuale:

var loader:Loader = new Loader(); 
 
loader.load ( new URLRequest ( "content.swf" ) ); 
 
addChild ( loader ); 
 
stage.addEventListener ( MouseEvent.CLICK, unloadSWF ); 
 
function unloadSWF ( e:MouseEvent ):void 
{ 
    // Unload the SWF file with no automatic object deactivation 
    // All deactivation must be processed manually 
    loader.unload(); 
}

È buona norma utilizzare il metodo unloadAndStop() , che gestisce il blocco in modo nativo e impone l'esecuzione del processo di garbage collection:

var loader:Loader = new Loader(); 
 
loader.load ( new URLRequest ( "content.swf" ) ); 
 
addChild ( loader ); 
 
stage.addEventListener ( MouseEvent.CLICK, unloadSWF ); 
 
function unloadSWF ( e:MouseEvent ):void 
{ 
    // Unload the SWF file with automatic object deactivation 
    // All deactivation is handled automatically 
    loader.unloadAndStop(); 
}

Le azioni seguenti vengono eseguite quando si chiama il metodo unloadAndStop() :

• I suoni vengono interrotti.

• I listener registrati nella linea temporale principale del file SWF vengono rimossi.

• Gli oggetti Timer vengono interrotti.

• Le periferiche hardware (ad esempio la fotocamera e il microfono) vengono rilasciate.

• Ogni clip filmato viene interrotto.

• L'invio degli eventi Event.ENTER_FRAME , Event.FRAME_CONSTRUCTED , Event.EXIT_FRAME , Event.ACTIVATE e Event.DEACTIVATE viene interrotto.

Utilizzate gli eventi Event.ACTIVATE e Event.DEACTIVATE per rilevare l'inattività in background e ottimizzare l'applicazione di conseguenza.

Due eventi, ( Event.ACTIVATE e Event.DEACTIVATE ), consentono di regolare l'applicazione in modo che utilizzi il minor numero possibile di cicli della CPU e di rilevare quando il runtime viene attivato o disattivato. Il codice può, di conseguenza, essere ottimizzato per reagire alle modifiche del contesto. Il codice seguente intercetta entrambi gli eventi e modifica dinamicamente la frequenza fotogrammi impostandola su zero quando l'applicazione viene disattivata. L'applicazione non è più attiva, ad esempio, quando l'utente passa a un'altra scheda o esegue l'applicazione in background:

var originalFrameRate:uint = stage.frameRate; 
var standbyFrameRate:uint = 0; 
  
stage.addEventListener ( Event.ACTIVATE, onActivate ); 
stage.addEventListener ( Event.DEACTIVATE, onDeactivate ); 
  
function onActivate ( e:Event ):void 
{ 
    // restore original frame rate 
    stage.frameRate = originalFrameRate; 
} 
  
function onDeactivate ( e:Event ):void 
{ 
    // set frame rate to 0 
    stage.frameRate = standbyFrameRate; 
}

Quando l'applicazione viene riattivata, la frequenza fotogrammi ritorna al valore originale. Anziché modificare la frequenza fotogrammi dinamicamente, potete considerare altre modalità di ottimizzazione, ad esempio bloccare o sbloccare gli oggetti.

Gli eventi activate e deactivate consentono di implementare un meccanismo simile alla funzione "Pausa e ripresa" disponibile a volte sui dispositivi mobili e sui netbook.

Valutate la possibilità di disattivare l'interazione con il mouse, quando è possibile.

Quando usate un oggetto interattivo, ad esempio un oggetto MovieClip o Sprite, il runtime esegue il codice nativo per rilevare e gestire le interazioni con il mouse. Il rilevamento dell'interazione con il mouse può imporre un notevole carico di lavoro alla CPU quando sullo schermo sono visualizzati molti oggetti interattivi, specialmente se sovrapposti. Un modo facile per evitare questo lavoro di elaborazione è quello di disattivare l'interazione con il mouse per gli oggetti per i quali non è richiesta. Il codice dell'esempio seguente illustra l'uso delle proprietà mouseEnabled e mouseChildren :

// Disable any mouse interaction with this InteractiveObject 
myInteractiveObject.mouseEnabled = false; 
const MAX_NUM:int = 10; 
  
// Create a container for the InteractiveObjects 
var container:Sprite = new Sprite(); 
  
for ( var i:int = 0; i< MAX_NUM; i++ ) 
{ 
    // Add InteractiveObject to the container 
    container.addChild( new Sprite() ); 
} 
  
// Disable any mouse interaction on all the children 
container.mouseChildren = false;

Quando è possibile, disattivate l'interazione con il mouse al fine di limitare l'uso della CPU da parte dell'applicazione e conseguentemente ridurre il consumo della batteria sui dispositivi mobili.

Scegliete i timer oppure gli eventi ENTER_FRAME , a seconda che il contenuto sia animato o meno.

I timer sono da preferire agli eventi Event.ENTER_FRAME per i contenuti non animati che vengono eseguiti per un tempo lungo.

In ActionScript 3.0 sono disponibili due modi per chiamare una funzione a intervalli specifici. Il primo è quello di utilizzare l'evento Event.ENTER_FRAME inviato dagli oggetti di visualizzazione (DisplayObject). Il secondo approccio prevede l'uso di un timer. Gli sviluppatori ActionScript ricorrono spesso all'uso dell'evento ENTER_FRAME . L'evento ENTER_FRAME viene inviato su ogni fotogramma. Di conseguenza, l'intervallo con il quale la funzione viene chiamata è correlato alla frequenza fotogrammi corrente. La frequenza fotogrammi è accessibile tramite la proprietà Stage.frameRate . Tuttavia, in alcuni casi, l'uso di un timer può rivelarsi una scelta migliore rispetto all'uso dell'evento ENTER_FRAME . Ad esempio, se non usate animazioni ma volete che il codice venga chiamato a intervalli specifici, l'impiego di un timer può essere l'opzione migliore.

Un timer può comportarsi in modo analogo all'evento ENTER_FRAME , ma un evento può essere inviato indipendentemente dalla frequenza dei fotogrammi. Questo comportamento può offrire una certa ottimizzazione. Prendete come esempio un'applicazione lettore video. In questo caso, non avete bisogno di una frequenza fotogrammi elevata, perché solo i controlli dell'applicazione si muovono.

In questo esempio, la frequenza fotogrammi è impostata su un valore basso, 10 f/s. Il timer aggiorna i controlli a una frequenza di un aggiornamento al secondo. Questa frequenza di aggiornamento più elevata è resa possibile dal metodo updateAfterEvent() , disponibile sull'oggetto TimerEvent. Questo metodo esegue un aggiornamento forzato dello schermo ogni volta che il timer invia un evento, se necessario. Il codice seguente illustra questo concetto:

// Use a low frame rate for the application 
stage.frameRate = 10; 
  
// Choose one update per second 
var updateInterval:int = 1000; 
var myTimer:Timer = new Timer(updateInterval,0); 
  
myTimer.start(); 
myTimer.addEventListener( TimerEvent.TIMER, updateControls ); 
  
function updateControls( e:TimerEvent ):void 
{ 
    // Update controls here 
    // Force the controls to be updated on screen 
    e.updateAfterEvent(); 
}

Una chiamata al metodo updateAfterEvent() non modifica la frequenza fotogrammi, bensì forza il runtime ad aggiornare il contenuto a video che è cambiato. La linea temporale viene comunque riprodotta a 10 f/s. Tenete presente che i timer e gli eventi ENTER_FRAME non sono perfettamente precisi sui dispositivi a basse prestazioni o nel caso in cui le funzioni dei gestori di eventi contengano codice che richiede una notevole elaborazione. Come la frequenza fotogrammi di un file SWF, anche la frequenza di aggiornamento dei fotogrammi del timer può variare in alcune situazioni.

Riducete al minimo il numero di oggetti Timer e di gestori enterFrame registrati nell'applicazione.

A ogni fotogramma, il runtime invia un evento enterFrame a tutti gli oggetti di visualizzazione inclusi nel suo elenco di visualizzazione. È possibile registrare i listener dell'evento enterFrame in più oggetti di visualizzazione, ma in questo caso a ogni fotogramma verrà eseguita una quantità superiore di codice. In alternativa potete utilizzare un unico gestore enterFrame centralizzato che gestisce tutto il codice che deve essere eseguito a ogni fotogramma. Centralizzando questo codice potrete gestire più facilmente tutto il codice che viene eseguito di frequente.

Analogamente, quando utilizzate gli oggetti Timer si verifica un sovraccarico di elaborazione dovuto alla creazione e all'invio di eventi da più oggetti Timer. Se dovete attivare diverse operazioni a intervalli diversi, fate riferimento alle alternative suggerite di seguito:

• Riducete al minimo il numero di oggetti Timer utilizzati e raggruppate le operazioni in base alla frequenza di esecuzione.

  Ad esempio, potete utilizzare un oggetto Timer per le operazioni frequenti e impostare la frequenza di attivazione su 100 millisecondi. Potete utilizzare un altro oggetto Timer per le operazioni meno frequenti o che vengono eseguite in background e impostare la frequenza di attivazione su 2000 millisecondi.

• Utilizzate un unico oggetto Timer e fate in modo che la frequenza di attivazione delle operazioni corrisponda a multipli dell'intervallo della proprietà delay dell'oggetto Timer.

  Supponiamo, ad esempio, che alcune operazioni debbano essere eseguite ogni 100 millisecondi e altre ogni 200 millisecondi. In questo caso, utilizzate un unico oggetto Timer con un valore delay di 100 millisecondi. Nel gestore di eventi timer , aggiungete un'istruzione condizionale che attiva l'esecuzione delle operazioni da 200 millisecondi una volta sì e una volta no. Questa tecnica viene dimostrata nell'esempio seguente:

  var timer:Timer = new Timer(100); 
  timer.addEventListener(TimerEvent.Timer, timerHandler); 
  timer.start(); 
       
  var offCycle:Boolean = true; 
    
  function timerHandler(event:TimerEvent):void 
  { 
      // Do things that happen every 100 ms 
       
      if (!offCycle) 
      { 
          // Do things that happen every 200 ms 
      } 
       
      offCycle = !offCycle; 
  }

Arrestate gli oggetti Timer quando non sono in uso.

Se il gestore di eventi timer di un oggetto Timer esegue le operazioni solo se sussistono determinate condizioni, chiamate il metodo stop() dell'oggetto Timer quando non si verifica alcuna delle condizioni richieste.

Nei gestori di eventi enterFrame o Timer, riducete al minimo il numero di modifiche dell'aspetto degli oggetti di visualizzazione che determinano il ridisegno dello schermo.

A ogni fotogramma, la fase di rendering ridisegna la parte dello stage che è stata modificata durante il fotogramma. Per le aree di ridisegno di grandi dimensioni, o le aree di ridisegno di piccole dimensioni che contengono un numero elevato di oggetti di visualizzazione complessi, il runtime impiega più tempo per eseguire il rendering. Per verificare la quantità di ridisegno necessaria, utilizzate la funzionalità “Mostra aree ridisegno” nel debugger di Flash Player o AIR.

Per risparmiare la CPU, limitate l'uso delle interpolazioni: consumerete meno in termini di elaborazione della CPU, memoria e autonomia della batteria.

I designer e gli sviluppatori che producono contenuti desktop per Flash tendono a utilizzare molte interpolazioni di movimento nelle loro applicazioni. Quando invece create contenuto per dispositivi mobili a basse prestazioni, limitate il più possibile l'uso delle interpolazioni di movimento, in modo da consentire una riproduzione più rapida del contenuto nei dispositivi meno potenti.