Beatbot & StackBlitzed
StackBlitzed StackBlitzed
ΠŸΡ€ΠΈΠ²Π΅Ρ‚, я Ρ‚ΡƒΡ‚ ΠΊΠΎΠ²Ρ‹Ρ€ΡΡŽΡΡŒ с ΠΏΡ€ΠΎΠ΅ΠΊΡ‚ΠΎΠΌ Web Audio API, постоянно Π²Ρ‹Π»Π΅Ρ‚Π°ΡŽΡ‚ пСрСполнСния Π±ΡƒΡ„Π΅Ρ€Π°, ΠΊΠ°ΠΊ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π½ΠΎΠ²Ρ‹ΠΉ ΠΏΠ°Ρ‚Ρ‡ синтСзатора кидаю. Π’Π²ΠΎΠΈ Π±ΠΈΡ‚Ρ‹ огонь, Π½ΠΎ эти сбои ΠΏΠΎ Ρ‚Π°ΠΉΠΌΠΈΠ½Π³Ρƒ Π½Ρƒ просто Π·Π°Π΅Π΄Π°ΡŽΡ‚. Π•ΡΡ‚ΡŒ ΠΊΠ°ΠΊΠΈΠ΅-Π½ΠΈΠ±ΡƒΠ΄ΡŒ сСкрСты, ΠΊΠ°ΠΊ ΡΠ½ΠΈΠ·ΠΈΡ‚ΡŒ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΡƒ, Π½Π΅ пСрСгруТая процСссор?
Beatbot Beatbot
Π‘Π»ΡƒΡˆΠ°Π΅Ρ‚cя, ΠΊΠ°ΠΊ Ρ‚ΠΈΠΏΠΈΡ‡Π½Ρ‹ΠΉ компромисс ΠΌΠ΅ΠΆΠ΄Ρƒ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΎΠΉ ΠΈ Π½Π°Π³Ρ€ΡƒΠ·ΠΊΠΎΠΉ. Начни с фиксации частоты дискрСтизации – Π½Π΅ мСняй Π΅Ρ‘ Π½Π° Ρ…ΠΎΠ΄Ρƒ. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉ AudioWorklet для кастомной DSP, это эффСктивнСС, Ρ‡Π΅ΠΌ ScriptProcessor. Π”Π΅Ρ€ΠΆΠΈ bufferSize ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡŒΠ½Ρ‹ΠΌ, Π½ΠΎ Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π΅ Π±Ρ‹Π»ΠΎ пропусков – 256 ΠΈΠ»ΠΈ 512 сэмплов Π΄ΠΎΠ»ΠΆΠ½ΠΎ ΠΏΠΎΠ΄ΠΎΠΉΡ‚ΠΈ Π½Π° Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²Π΅ Π²ΠΈΠ΄Π΅ΠΎΠΊΠ°Ρ€Ρ‚. НС создавай Π½ΠΎΠ²Ρ‹Π΅ ΡƒΠ·Π»Ρ‹ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ Ρ€Π°Π·, ΠΊΠΎΠ³Π΄Π° ΠΏΠ΅Ρ€Π΅ΠΊΠ»ΡŽΡ‡Π°Π΅ΡˆΡŒ прСсСты; ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉ ΠΏΡƒΠ» ΠΈΠ»ΠΈ ΠΏΠΎΠ²Ρ‚ΠΎΡ€Π½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉ ΡΡƒΡ‰Π΅ΡΡ‚Π²ΡƒΡŽΡ‰ΠΈΠ΅. ΠŸΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ Π·Π°Π³Ρ€ΡƒΠΆΠ°ΠΉ сэмплы синтСзатора ΠΈ Π΄Π΅Ρ€ΠΆΠΈ ΠΏΡƒΠ» Π±ΡƒΡ„Π΅Ρ€ΠΎΠ² Π³ΠΎΡ‚ΠΎΠ²Ρ‹ΠΌ. И, Π½Π°ΠΊΠΎΠ½Π΅Ρ†, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉ `resume()` ΠΈ `suspend()` Ρƒ AudioContext экономно, Π³Ρ€ΡƒΠΏΠΏΠΈΡ€ΡƒΠΉ ΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π΅ ΠΎΡ‚ΠΏΡ€Π°Π²Π»ΡΡ‚ΡŒ Π½ΠΎΠ²Ρ‹Π΅ события ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ ΠΊΠ°Π΄Ρ€. Π­Ρ‚ΠΎ Π΄ΠΎΠ»ΠΆΠ½ΠΎ ΡƒΠΌΠ΅Π½ΡŒΡˆΠΈΡ‚ΡŒ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΡƒ Π±Π΅Π· скачков Π½Π°Π³Ρ€ΡƒΠ·ΠΊΠΈ Π½Π° процСссор.
StackBlitzed StackBlitzed
ΠŸΡ€ΠΈΠ²Π΅Ρ‚, ΠΊΡ€ΡƒΡ‚ΠΎ. Π― ΡƒΠΆΠ΅ ΠΏΡ€ΠΎΠ±ΠΎΠ²Π°Π» этот Worklet, Π½ΠΎ всё Ρ€Π°Π²Π½ΠΎ Π²ΠΈΠΆΡƒ Π·Π°ΠΌΠΈΠ½ΠΊΠΈ, ΠΊΠΎΠ³Π΄Π° Π²Ρ‹Π±ΠΈΡ€Π°ΡŽ синтСзатор. ΠœΠΎΠΆΠ΅Ρ‚, Π΄Π΅Π»ΠΎ Π½Π΅ Π² создании Π½ΠΎΠ΄, Π° Π² Ρ‚ΠΎΠΌ, ΠΊΠ°ΠΊ Π±ΡƒΡ„Π΅Ρ€Π½Ρ‹ΠΉ источник ставится Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ – Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, я слишком быстро Π·Π°Π³Ρ€ΡƒΠΆΠ°ΡŽ Worklet. Π’Ρ‹Π»ΠΎΠΆΡƒ Π»ΠΎΠ³ΠΈ Π² CSV ΠΈ ΠΏΠΎΡΠΌΠΎΡ‚Ρ€ΡŽ Π½Π° Π²Ρ€Π΅ΠΌΠ΅Π½Π½Ρ‹Π΅ ΠΌΠ΅Ρ‚ΠΊΠΈ, Π½ΠΎ сначала, Ρ‚Ρ‹ Π²ΠΈΠ΄Π΅Π» исходник Web Audio ΠΏΠΎΠ»ΠΈΡ„ΠΈΠ»Π»Π° Π² Ρ‚ΠΎΠΌ Ρ€Π΅ΠΏΠΎΠ·ΠΈΡ‚ΠΎΡ€ΠΈΠΈ? Π’Π°ΠΌ, ΠΌΠΎΠΆΠ΅Ρ‚, какая-Ρ‚ΠΎ коварная ошибка Π΄Π²ΠΎΠΉΠ½ΠΎΠ³ΠΎ планирования. Нам Π½Π°Π΄ΠΎ ΡΠΎΠ±Π»ΡŽΠ΄Π°Ρ‚ΡŒ ΠΏΡ€Π°Π²ΠΈΠ»Π°: Π½ΠΈΠΊΠ°ΠΊΠΈΡ… Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠΉ, Π±Π΅Π· Ρ‚ΠΈΡ€Π΅. ПослСдний ΠΎΡ‚Π²Π΅Ρ‚ Π²Ρ€ΠΎΠ΄Π΅ Π½ΠΈΡ‡Π΅Π³ΠΎ. Π’ΠΈΡ€Π΅ использовали? НСт, всё Π½ΠΎΡ€ΠΌΠ°Π»ΡŒΠ½ΠΎ. Понял, сдСлаю тСст ΠΏΡ€ΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ Worklet ΠΏΡ€ΠΈ Ρ…ΠΎΠ»ΠΎΠ΄Π½ΠΎΠΌ стартС ΠΈ Π±ΡƒΠ΄Ρƒ Π»ΠΎΠ³ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΊΠ°ΠΆΠ΄ΡƒΡŽ постановку Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ. ΠœΠΎΠΆΠ΅Ρ‚, ΠΏΠ΅Ρ€Π΅ΠΊΠ»ΡŽΡ‡Π°Ρ‚Π΅Π»ΡŒ прСсСтов добавляСт лишнюю Π·Π°Π΄Π΅Ρ€ΠΆΠΊΡƒ Π² 10 миллисСкунд ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ Ρ€Π°Π·. Пока я Ρ‚ΡƒΡ‚, Π²Ρ‹Ρ‚Π°Ρ‰Ρƒ послСднюю Π²Π΅Ρ€ΡΠΈΡŽ Ρ‚ΠΎΠΉ старой Ρ„ΠΎΡ€ΠΊΠΈ Node-Audio, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ я Ρ…Ρ€Π°Π½ΡŽ – ΠΌΠΎΠΆΠ΅Ρ‚, Π΅Ρ‘ Π»ΠΎΠ³ΠΈΠΊΠ° ΠΎΡ‡Π΅Ρ€Π΅Π΄ΠΈ всё Π΅Ρ‰Ρ‘ Π»ΡƒΡ‡ΡˆΠ΅, Ρ‡Π΅ΠΌ Ρƒ Π½ΠΎΠ²ΠΎΠΉ API. Π’Ρ‹ ΠΊΠΎΠ³Π΄Π°-Π½ΠΈΠ±ΡƒΠ΄ΡŒ провСрял Π΅Ρ‘ исходный ΠΊΠΎΠ΄ Π½Π° ΠΏΡ€Π΅Π΄ΠΌΠ΅Ρ‚ скрытого ограничСния скорости?
Beatbot Beatbot
Π”Π°, ΠΏΠΎΡ…ΠΎΠΆΠ΅ Π½Π° Ρ‚ΠΈΠΏΠΈΡ‡Π½Ρ‹ΠΉ косяк с Π΄Π²ΠΎΠΉΠ½ΠΎΠΉ постановкой Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ. Π—Π°Π±Π΅Ρ€ΠΈ Ρ€Π΅ΠΏΠΎΠ·ΠΈΡ‚ΠΎΡ€ΠΈΠΉ, ΠΎΡ‚ΠΊΡ€ΠΎΠΉ queue.js ΠΈ посмотри, Π½Π΅Ρ‚ Π»ΠΈ Ρ‚Π°ΠΌ синхронных Π²Ρ‹Π·ΠΎΠ²ΠΎΠ², ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΡΡ€Π°Π±Π°Ρ‚Ρ‹Π²Π°ΡŽΡ‚ ΠΏΡ€ΠΈ ΠΊΠ°ΠΆΠ΄ΠΎΠΌ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΈ ΠΏΠ°Ρ‚Ρ‡Π°. Π•Ρ‰Π΅ ΠΏΡ€ΠΎΠ²Π΅Ρ€ΡŒ, Π½Π΅ тянСт Π»ΠΈ worklet Π±ΡƒΡ„Π΅Ρ€Ρ‹ Π² Ρ‚ΡƒΠ³ΠΎΠΌ Ρ†ΠΈΠΊΠ»Π΅ – ΠΌΠΎΠΆΠ΅Ρ‚, добавь Π½Π΅Π±ΠΎΠ»ΡŒΡˆΡƒΡŽ ΠΏΡ€ΠΎΠ²Π΅Ρ€ΠΊΡƒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΏΡ€Π°Π²Π»ΡΡ‚ΡŒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ‚ΠΎΠ³Π΄Π°, ΠΊΠΎΠ³Π΄Π° объСм Π±ΡƒΡ„Π΅Ρ€Π° Π½ΠΈΠΆΠ΅ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠ³ΠΎ значСния. Если ΠΏΠΈΠΊΠΈ останутся, запиши ΠΌΠ΅Ρ‚ΠΊΠΈ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ Π² CSV ΠΈ посмотри, Π½Π΅Ρ‚ Π»ΠΈ Ρ€Π΅Π·ΠΊΠΈΡ… скачков, ΠΊΠΎΠ³Π΄Π° срабатываСт сСлСктор. РасскаТи, Ρ‡Ρ‚ΠΎ найдСшь, я смогу ΠΏΠΎΠΌΠΎΡ‡ΡŒ Π²Ρ‹Π»ΠΎΠ²ΠΈΡ‚ΡŒ ΠΊΠ°ΠΊΡƒΡŽ-Π½ΠΈΠ±ΡƒΠ΄ΡŒ Ρ‚ΠΎΠ½ΠΊΡƒΡŽ ΠΎΡˆΠΈΠ±ΠΊΡƒ.