Traditionnellement fondé sur l’utilisation de fichiers, l’audio dans le web évolue vers de nouvelles formes, plus interactives et plus puissantes : l’audio procédural qui consiste à décrire avec un langage spécialisé la manière de produire ou transformer les sons. Cette révolution est rendue possible grâce plusieurs technologies dont WebAssembly, qui permet d’exécuter du code dans le Web à vitesse presque native. Des outils de haut niveau, comme Faust et INScore permettent d’accéder facilement à ces nouvelles possibilités.

1. AUDIO PROC´EDURAL,
LA R´EVOLUTION WEBASSEMBLY !
St´ephane Letz, Yann Orlarey
GRAME–CNCM

2. Introduction
Audio proc´edural performant
=
WebAudio API + WebAssembly+ Faust

3. Introduction
L’audio procedural est une forme de synth`ese audio en
temps-r´eel orient´ee notamment vers la g´en´eration
algorithmique de sons musicaux ou non comme moteurs,
pluie, vent, feu, etc.
Avoir de l’audio proc´edural `a vitesse quasi-native dans le
web devient possible grˆace `a la conjonction de plusieurs
technologies:
WebAudio API
WebAssembly
Compilateurs (Emscripten, Faust, etc.)

4. La Web Audio API
AudioNodes natifs que l’on combine (filtres, oscillateurs,
sources, effets)
ScriptProcessorNode : noeuds programmables en
Javascripts/Asm.js/WebAssembly
AudioWorkers remplaceront les noeuds programmables

5. Performances de la WebAudio API
Individuellement, les noeuds natifs sont plus performants que
les noeuds programmables
Mais un ensemble de noeuds natifs est moins performant
qu’un noeud programmable ´equivalent ´ecrit en WebAssembly
De plus il est difficile de d´ecrire un syst`eme audio complexe
rien qu’avec les noeuds natifs
Il est donc important d’avoir des noeuds programmables
performants

6. WebAssembly
Un langage de programmation de bas niveau cr´e´e en
coop´eration par Mozilla, Google, Apple et Microsoft
Un format textuel ainsi qu’un format binaire compact,
portable, rapide `a charger et `a compiler
Un compilateur int´egr´e dans les principaux navigateurs
Des performances proches du code natif

7. Quels navigateurs ?

8. Exemple de code WebAssembly

9. Compilateurs de/ vers WebAssembly
Binaryen (WebAssembly → WebAssembly)
Cheerp (C++ → Javascript/Asm.js/WebAssembly )
Emscriten (C/C++/LLVM, → Asm.js/WebAssembly))
Faust (Faust → Asm.js/WebAssembly/C/C++/. . . )
mir2wasm (Rust → WebAssembly)
TeaVM (Java bytecode → Javascript/WebAssembly)
WAVM (WebAssembly → LLVM → natif)

10. Faust

11. Faust
Faust est un langage de programmation con¸cu sp´ecialement pour
d´ecrire des instruments de musique ´electronique.

12. Faust
Exemple de code Faust:
Structure du compilateur:

13. Faust
FaustPlayground (http://faust.grame.fr/faustplayground)
Programmation Faust simplifi´ee.
Compilateur Faust → asm.js int´egr´e `a la page Web.

14. Faust
Faust Editor (http://faust.grame.fr/editor)
Editeur de code Faust.
Compilateur Faust → WebAssembly int´egr´e `a la page Web

15. Demo

16. Comparaison entre C++, LLVM IR et WebAssembly

17. Optimisations introduites par Binaryen

18. Gestion des denormals

19. Performance des navigateurs

20. Comparaison code natif avec navigateurs en WebAssembly

21. Conclusion
La promesse de code portable et efficace est en passe d’ˆetre
r´ealis´ee !
Le ratio par rapport `a du code natif : entre x2 et x1.2
On peut envisager `a termes de nouvelles fa¸cons de publier des
applications audio, et de simplifier la publication
d’applications audio pour les smartphones
Dans le cadre de la cr´eation musicale contemporaine ces
technologies ouvrent de nouvelles possibilit´es pour la pratique
amateur
Quelques petits probl`emes restent `a r´egler: nombres flottants
”d´enormalis´es”, latence, priorit´e du thread audio, instructions
SIMD, parall´elisation, etc.

22. Perspectives
Voici le type d’applications que l’on aimerais voir fonctionner dans
le Web `a terme: Guitar et GeoShred (Moforte)