In che modo Scirra ha reso l'audio HTML5 così perfetto in Construct 2?

Question

Check out this space shooter demo.

L'audio HTML5 è perfetto su Chrome 18 e Firefox 10. Non vi è alcun ritardo nella riproduzione dei suoni e ogni campione riproduce perfettamente. L'ultima volta che ho provato a riprodurre suoni usando l'audio HTML5 e JavaScript, non ho potuto riprodurre un suono più di una volta.

Che stregoneria sta facendo Scirra per renderlo così perfetto?

Answer 1

Sono lo sviluppatore di Construct 2, quindi spero di essere sufficientemente qualificato per rispondere alla tua domanda :)

HTML5 audio è davvero un disastro, così ho compiuto ogni sforzo per cercare di fare si antiproiettile in Construct 2. Ecco uno schema di quello che ho fatto:

Utilizzare l'API Web audio

audio HTML5 sembra essere progettato per lo streaming di musica, quindi un oggetto HTML5 audio è una specie di un oggetto pesante . Riproduzione di 10 suoni al secondo con esso come Space Blaster può facilmente catturare il browser. D'altra parte, l'API Web Audio è un motore audio ad alte prestazioni con routing, effetti e riproduzione audio leggera. È perfetto per i giochi. I buffer audio e la riproduzione audio sono separati, quindi puoi avere un buffer di dati e riprodurlo in modo efficiente molte volte contemporaneamente, mentre alcuni browser sono così buggati se suoni un suono HTML5 alcune volte lo scaricano nuovamente ogni volta! Dal momento che è stato progettato per giochi e simili, puoi tranquillamente riprodurre tonnellate di suoni per anni e continuerà a ronzare bene. Può anche utilizzare l'audio HTML5 come sorgente sonora, sebbene io utilizzi solo l'audio HTML5 per le cose che l'utente ha designato come tracce musicali (poiché è lì che preferiresti lo streaming - in genere tutto il resto nell'API Web Audio viene scaricato completamente prima giocando).

L'API Web Audio è supportata in Chrome, è stata aggiunta anche in iOS 6+ (anche se è disattivata fino a quando non si prova a riprodurre audio in un evento touch), Firefox sta lavorando per il supporto e dovrebbe venire presto su Chrome per Android. Quindi su queste piattaforme l'audio sarà significativamente più affidabile.

Ulteriori informazioni su HTML5Rocks e the proposed spec - per ora dovrai utilizzare le specifiche come documentazione, non c'è molto altro.

Altri browser: implementare un sistema di riciclaggio audio

L'API Audio Web non è ancora supportato in tutto il mondo, in particolare IE, il che significa che è ancora necessario per crowbar HTML5 audio a qualcosa che potrebbe funzionare per i giochi per retrocompatibilità. Il modo per farlo è riciclare gli oggetti audio.

Il laser del giocatore in Space Blaster scatta 10 volte al secondo - e questo non include nessun altro effetto sonoro! Come accennato in precedenza, Audio è una specie di oggetto pesante, quindi se stai facendo new Audio() 10+ volte al secondo, ecco che alla fine il browser muore e l'audio inizia a lampeggiare. Tuttavia, è possibile ridurre drasticamente il numero di oggetti Audio creati riciclandoli.

Fondamentalmente, per ogni effetto sonoro, mantenere una cache di ogni oggetto Audio creato con quel suono come sorgente. Quindi, durante la riproduzione di un nuovo suono, cerca nella cache eventuali effetti sonori che hanno terminato la riproduzione (la proprietà ended sarà vera). Se ne trovi uno, riavvolgi di nuovo all'inizio (currentTime = 0) e play() di nuovo. Altrimenti, creare un oggetto new Audio() nella cache.

Poiché l'effetto del suono laser del lettore è breve, invece di creare 600 oggetti Audio al minuto, ci saranno solo 3 o 4 che continua a girare. Purtroppo alcuni browser lo scaricheranno ancora 4 volte (Safari ha fatto l'ultimo controllo!) O hanno una latenza elevata prima del tempo in cui viene riprodotto ogni buffer audio, ma alla fine il browser si riavvia poiché gli stessi buffer vengono sempre riutilizzati. Quindi, in sostanza, il suono potrebbe essere un po 'strano per alcuni momenti, quindi si chiarisce. Utilizziamo anche la cache dell'app HTML5 in modo che la prossima volta che giochi tutto carichi dal disco, quindi le riproduzioni successive dovrebbero avere un buon rendimento immediato.

Questo è fondamentalmente. È ancora un po 'ambiguo il primo gioco con l'audio HTML5, ma ogni volta dopo dovrebbe essere abbastanza solido, a condizione che il browser abbia un'implementazione audio sana. Esistono diversi modi per provare a clonare gli oggetti audio, ma ho scoperto che il riavvolgimento degli audio esistenti funziona meglio.

Non esistono SoundManager o fallback basati su Flash/plugin poiché si tratta di un puro HTML5.

Supportiamo anche le API audio fornite da PhoneGap e appMobi per dispositivi mobili, dal momento che l'audio HTML5 su dispositivi mobili non è nemmeno la pena di provarlo. Questo rende un totale di quattro API audio il nostro motore audio si avvolge, e sì, sembra un pasticcio di frankenstein, ma funziona.

Questo è tutto. Suppongo che i nostri concorrenti leggeranno questo, ma a chi importa quando c'è un rappresentante SO? ??? !!! 1111