html5 audio html5-audio construct-2

¿Cómo consiguió Scirra audio HTML5 tan perfecto en Construct 2?



html5-audio construct-2 (1)

Soy el desarrollador de Construct 2, así que espero ser lo suficientemente calificado para responder a su pregunta :)

El audio HTML5 es realmente un desastre, así que me he esforzado mucho para tratar de hacerlo a prueba de balas en Construct 2. Aquí hay un resumen de lo que he hecho:

Use la API de Web Audio

El audio HTML5 aparece diseñado para transmitir música, por lo que un objeto de audio HTML5 es un objeto pesado. Reproducir 10 sonidos por segundo como Space Blaster puede apoderarse fácilmente del navegador. Por otro lado, Web Audio API es un motor de audio de alto rendimiento con enrutamiento, efectos y reproducción de sonido ligero. Es perfecto para juegos. Los búferes de audio y la reproducción de audio están separados, por lo que puede tener un búfer de datos y reproducirlo de manera eficiente muchas veces simultáneamente, mientras que algunos navegadores son tan problemáticos si reproduce un sonido HTML5 varias veces, ¡lo vuelve a descargar cada vez! Dado que en realidad fue diseñado para juegos, puedes jugar toneladas de sonido felizmente por años y todavía se escuchará muy bien. También puede usar audio HTML5 como fuente de sonido, aunque solo utilizo audio HTML5 para las cosas que el usuario ha designado como pistas de música (ya que es donde preferiría tener la transmisión; por lo general, todo lo demás en la API de Web Audio se descarga completamente antes jugando).

Web Audio API es compatible con Chrome, también lo ha hecho con iOS 6+ (aunque está silenciado hasta que intentes reproducir algo de audio en un evento táctil), Firefox está trabajando en soporte y pronto estará disponible para Chrome. Androide. Entonces, en estas plataformas, el audio será significativamente más confiable.

Más información sobre HTML5Rocks y la especificación propuesta : tendrá que usar la especificación como la documentación por ahora, no hay mucho más por ahí.

Otros navegadores: implementar un sistema de reciclaje de audio

La API de Web Audio aún no se admite en todas partes, especialmente en IE, lo que significa que todavía necesita conectar el audio HTML5 a algo que funcione para los juegos por compatibilidad con versiones anteriores. La forma de hacerlo es reciclar objetos de audio.

El láser del jugador en Space Blaster dispara 10 veces por segundo, ¡y eso no incluye ningún otro efecto de sonido! Como mencioné anteriormente, Audio es un objeto pesado, por lo que si estás haciendo new Audio() 10 veces por segundo, entonces, el navegador finalmente muere y el audio comienza a fallar. Sin embargo, puede reducir drásticamente la cantidad de objetos de audio creados reciclándolos.

Básicamente, para cada efecto de sonido, mantenga una caché de cada objeto de Audio que haya creado con ese sonido como fuente. Luego, cuando reproduzca un sonido nuevo, busque en el caché los efectos de sonido que hayan terminado de reproducirse (la propiedad ended será verdadera). Si encuentra uno, rebobínelo al principio ( currentTime = 0 ) y play() nuevamente. De lo contrario, crea un new Audio() objeto new Audio() en la memoria caché.

Dado que el efecto de sonido del láser del jugador es corto, en lugar de crear 600 objetos de audio por minuto, habrá solo 3 o 4 que seguirá dando vueltas. Desafortunadamente, algunos navegadores lo descargarán 4 veces (¡Safari lo comprobó la última vez!) O tienen una alta latencia la primera vez que se reproduce cada buffer de sonido, pero finalmente el navegador se pone al día ya que los mismos búferes siempre se reutilizan. Entonces, básicamente, el sonido puede ser un poco extraño por unos momentos, luego se aclara. También usamos la memoria caché de la aplicación HTML5 para que la próxima vez que reproduzca todo se cargue desde el disco, por lo que las siguientes reproducciones deben tener un buen rendimiento de inmediato.

Eso es básicamente eso. Todavía es un poco dudoso en la primera jugada con audio HTML5, pero cada vez después de eso debe ser bastante sólido siempre que el navegador tenga una implementación de audio sensata. Hay varias maneras de intentar clonar objetos de audio, pero descubrí que el rebobinado de los audios existentes funciona mejor.

No hay ningún SoundManager ni ningún tipo de respaldo basado en Flash / plugin, ya que nos esforzamos por ser HTML5 puro.

También admitimos las API de audio proporcionadas por PhoneGap y appMobi para dispositivos móviles, ya que el audio HTML5 en dispositivos móviles ni siquiera vale la pena probarlo. Eso hace que un total de cuatro API de audio se ajuste a nuestro motor de audio, y sí, se ve como un desastre de frankenstein, pero funciona.

Eso es. ¡Supongo que nuestros competidores leerán esto, pero a quién le importa cuando hay un representante SO que se tiene !? 1111

Mira esta demostración de shooter espacial .

El audio HTML5 es perfecto en Chrome 18 y Firefox 10. No hay retraso en la reproducción de sonidos y cada muestra se reproduce perfectamente. La última vez que traté de reproducir sonidos usando audio HTML5 y JavaScript no pude escuchar un sonido más de una vez.

¿Qué hechicería está haciendo Scirra para que esto sea tan perfecto?