Les concepts de base de la Web Audio API

Graphes audio

La Web Audio API implique d'effectuer le traitement du son dans un contexte audio; elle a t conue sur le principe de routage modulaire. Les oprations basiques sont effectues dans noeuds audio, qui sont lis entre eux pour former un graphe de routage audio. Un seul contexte peut supporter plusieurs sources avec diffrentes configurations de canaux. Cette architecture modulaire assure la flexibilit ncessaire pour crer des fonctions audio complexes avec des effets dynamiques.

Les noeuds audio sont lis au niveau de leur entre et leur sortie, formant une chane qui commence avec une ou plusieurs sources, traverse un ou plusieurs noeuds, et se termine avec une sortie spcifique (bien qu'il ne soit pas ncessaire de spcifier une sortie si, par exemple, vous souhaitez seulement visualiser des donnes audio). Un scnario simple, reprsentatif de la Web Audio API, pourrait ressembler ceci :

1. Cration d'un contexte audio
2. Dans ce contexte, cration des sources telles que <audio>, oscillateur, flux
3. Cration des noeuds d'effets, tels que rverb, filtres biquad, balance, compresseur
4. Choix final de la sortie audio, par exemple les enceintes du systme
5. Connection des sources aux effets, et des effets la sortie.

[Diagramme simple compos de trois rectangles intituls Sources, Effets et Sortie, relis par des flches, de gauche droite, qui indiquent le sens du flux d'informations audio.]

Chaque entre ou sortie est compose de plusieurs canaux, chacun correspondant une configuration audio spcifique. Tout type de canal discret est support, y compris mono, stereo, quad, 5.1, etc.

[Diagramme qui montre comment les AudioNodes sont relis par leurs entres et sorties, et la configuration des canaux l'intrieur de ces entres/sorties.]

Les sources audio peuvent tre de provenance varie :

• gnres directement en JavaScript avec un noeud audio (tel qu'un oscillateur)
• cres partir de donnes PCM brutes (le contexte audio a des mthodes pour dcoder les formats audio supports)
• fournies par une balise HTML media (telle que <video> ou <audio>)
• rcupres directement avec WebRTC MediaStream (une webcam ou un microphone)

Donnes audio: ce qu'on trouve dans un chantillon

Lors du traitement d'un signal audio, l'chantillonage dsigne la conversion d'un signal continu en signal discret; formul autrement, une onde de son continue, comme un groupe qui joue en live, est convertie en une squence d'chantillons (un signal temporel discret) qui permet l'ordinateur de traiter le son en blocs distincts.

On peut trouver davantage de dtails sur la page Wikipdia Echantillonage (signal).

Mmoire tampon : trames, chantillons et canaux

Un AudioBuffer prend comme paramtres un nombre de canaux (1 pour mono, 2 pour stro, etc), une longueur, qui correspond au nombre de trames d'chantillon dans la mmoire tampon, et un taux d'chantillonage, qui indique le nombre de trames d'chantillons lues par seconde.

Un chantillon est une valeur float32 unique, qui correspond la valeur du flux audio un point prcis dans le temps, sur un canal spcifique (gauche ou droit dans le cas de la stro). Une trame, ou trame d'chantillon est l'ensemble de toutes les valeurs pour tous les canaux (deux pour la stro, six pour le 5.1, etc.) un point prcis dans le temps.

Le taux d'chantillonage est le nombre d'chantillons (ou de trames, puisque tous les chantillons d'une trame jouent en mme temps) qui sont jous en une seconde, exprims en Hz. Plus le taux d'chantillonage est lev, meilleure est la qualit du son.

Prenons deux AudioBuffer, l'un en mono et l'autre en stro, chacun d'une dure de 1 seconde et d'une frquence de 44100Hz:

• le mono aura 44100 chantillons, et 44100 trames. Sa proprit length vaudra 44100.
• le stro aura 88200 chantillons, et 44100 trames. Sa proprit length vaudra aussi 44100, puisqu'elle correspond au nombre de trames.

[Le diagramme montre une succession de tames dans un buffer audio. Comme le buffer est compos de deux canaux (stro), chaque trame contient deux chantillons.]

Lorsqu'un noeud de mmoire tampon est lu, on entend d'abord la trame la trame la plus gauche, puis celle qui la suit droite, etc. Dans le cas de la stro, on entend les deux canaux en mme temps. Les trames d'chantillon sont trs utiles, car elles reprsentent le temps indpendamment du nombre de canaux.

Voici quelques exemples simples:

var contexte = new AudioContext();
var memoireTampon = contexte.createBuffer(2, 22050, 44100);

Ce code gnre une mmoire tampon stro (deux canaux) qui, lorsqu'elle est lue dans un AudioContext 44100Hz (configuration rpandue, la plupart des cartes sons tournant cette frquence), dure 0.5 secondes: 22050 trames / 44100Hz = 0.5 secondes.

var contexte = new AudioContext();
var memoireTampon = context.createBuffer(1, 22050, 22050);

Ce code gnre une mmoire tampon mono (un seul canal) qui, lorsqu'elle est lue dans un AudioContext 44100Hzz, est automatiquement *rchantillonne* 44100Hz (et par consquent produit 44100 trames), et dure 1.0 seconde: 44100 frames / 44100Hz = 1 seconde.

Mmoire tampon linaire ou entrelace

La Web Audio API utilise un format de mmoire tampon linaire : les canaux gauche et droite sont stocks de la faon suivante :

LLLLLLLLLLLLLLLLRRRRRRRRRRRRRRRR (pour un buffer de 16 trames)

C'est assez courant dans le traitement audio, car cela permet de traiter facilement chaque canal de faon indpendante.

L'alternative est d'utiliser un format entrelac:

LRLRLRLRLRLRLRLRLRLRLRLRLRLRLRLR (pour un buffer de 16 trames)

Ce format est communment utilis pour stocker et lire du son avec trs peu de traitement, comme par exemple pour un flux de MP3 dcod.

La Web Audio API expose *uniquement* des buffer linaires, car elle est faite pour le traitement du son. Elle fonctionne en linaire, mais convertit les donnes au format entrelac au moment de les envoyer la carte son pour qu'elles soient joues. A l'inverse, lorsqu'un MP3 est dcod, le format d'origine entrelac est converti en linaire pour le traitement.

Canaux audio

Une mmoire tampon audio peut contenir diffrents nombres de canaux, depuis les configurations simple mono (un seul canal) ou stro (canal gauche et canal droit) en allant jusqu des configurations plus complexe comme le quad ou le 5.1, pour lesquels chaque canal contient plusieurs chantillons de sons, ce qui permet une exprience sonore plus riche. Les canaux sont gnralement reprsents par les abbrviations standard dtailles dans le tableau ci-aprs :

Conversion ascendante et descendante

Lorsque le nombre de canaux n'est pas le mme en entre et en sortie, on effectue une conversion ascendante ou descendante selon les rgles suivantes. Cela peut tre plus ou moins controll en assignant la valeur speakers ou discrete la proprit AudioNode.channelInterpretation .

Visualisations

Une visualisation audio consiste en gnral utiliser un flux de donnes audio dans le temps (souvent des informations de gain ou de frquence) pour gnrer un affichage graphique (comme un graphe). La Web Audio API possde un AnalyserNode qui n'altre pas le signal audio qui le traverse, permettant de gnrer des donnes qui peuvent tre utilises par une technologie de visualisation telle que <canvas>.

[Le noeud permet de rcuprer la frquence et le domaine temporel en utilisant FFT, et ce sans modifier le flux audio]

On peut accder aux donnes en utilisant les mthodes suivantes:

AnalyserNode.getFloatFrequencyData()

Copie les donnes de frquence dans le tableau Float32Array pass en argument.

AnalyserNode.getByteFrequencyData()

Copies les donnes de frquence dans le tableau d'octets non signs Uint8Array pass en argument.

AnalyserNode.getFloatTimeDomainData()

Copie les donnes de l'onde de forme, ou domaine temporel, dans le Float32Array pass en argument.

AnalyserNode.getByteTimeDomainData()

Copie les donnes de l'onde de forme, ou domaine temporel, dans le tableau d'octets non signs Uint8Array pass en argument.

Spatialisations

Une spatialisation audio (gre par les noeuds PannerNode et AudioListener dans la Web Audio API) permet de modliser la position et le comportement d'un signal audio situ dans l'espace, ainsi que l'auditeur qui peroit ce signal.

La position du panoramique est dcrite avec des coodonnes cartsiennes selon la rgle de la main droite, son mouvement l'aide d'un vecteur de vlocit (ncessaire pour la cration d'effets Doppler) et sa direction avec un cone de direction. Le cone peut tre trs large, par exemple dans le cas de sources omnidirectionnelles.

[Le PannerNode donne la position dans l'espace, la vlocit et la direction d'un signal donn]

La position de l'auditeur est dcrite avec des coodonnes cartsiennes selon la rgle de la main droite, son mouvement l'aide d'un vecteur de vlocit et la direction vers laquelle elle pointe en utilisant deux vecteurs de direction : haut et face. Ceux-ci dfinissent respectivement la direction vers laquelle pointent le haut de la tte et le bout du nez de l'auditeur, et forment un angle droit entre eux.

[On voit la position d'un auditeur, ainsi que les vecteurs de direction haut et de face qui forment un angle de 90]

Fan-in et Fan-out

En audio, fan-in dsigne le processus par lequel un ChannelMergerNode prend une srie d'entres mono entre et restitue un seul signal multi-canaux :

[]

Fan-out dsigne le processus oppos, par lequel un ChannelSplitterNode prend une source multi-canaux en entre et restitue plusieurs signaux mono en sortie:

[]