Perubahan Audio Web di m36

Budiman
Chris Wilson
Twitter

Perubahan Audio Web

Di Google, kami menyukai standar. Kami memiliki misi untuk membangun platform Web yang terdefinisi standar. Salah satu kendala kecil yang dihadapinya selama beberapa waktu adalah implementasi Web Audio API berawalan webkit- (terutama objek webkitAudioContext), dan beberapa bit Audio Web yang tidak digunakan lagi yang terus kami dukung.

Awalnya, Chrome 36 direncanakan akan menghapus dukungan untuk webkitAudioContext berawalan, karena kami mulai mendukung objek AudioContext tanpa awalan. Hal ini ternyata lebih merepotkan dari yang diharapkan, sehingga Chrome 36 mendukung tanpa awalan dan awalan - namun, bahkan dalam webkitAudioContext yang diperkenalkan kembali, beberapa metode dan atribut lama seperti createGainNode dan createJavaScriptNode telah dihapus. Singkatnya, di Chrome 36, webkitAudioContext dan AudioContext merupakan alias satu sama lain; tidak ada perbedaan fungsi di antara keduanya.

Kami akan menghapus dukungan untuk awalan sepenuhnya setelah Chrome 36, kemungkinan dalam beberapa rilis. Kami akan membuat pengumuman di sini saat perubahan sudah dekat, dan kami terus menghubungi para penulis untuk memperbaiki aplikasi Audio Web mereka.

Mengapa kami melakukan ini, bukan kembali ke implementasi sebelumnya? Yah, sebagian, kami enggan untuk bergerak terlalu jauh ke belakang; kami telah menghapus API tersebut, dan sebagai efek samping yang bagus untuk aliasing ini, aplikasi kemudian dapat bekerja dengan baik di Firefox, yang tidak pernah mendukung objek AudioContext berawalan (dan juga benar) di dukungan Audio Web mereka yang awalnya dirilis pada musim gugur yang lalu.

Bagian lainnya dari update ini memberikan panduan untuk memperbaiki hal-hal yang mungkin rusak dalam kode Anda karena perubahan ini. Hal yang baik tentang memperbaiki masalah ini adalah bahwa kode Anda kemungkinan besar juga hanya akan berfungsi di Firefox! (Sudah lama saya berpikir bahwa aplikasi Vocoder saya rusak akibat implementasi Firefox, namun ternyata itu adalah salah satu masalah tersebut!)

Jika Anda hanya ingin memulai dan menjalankan, sebaiknya lihat library Monkey-patch yang saya tulis untuk aplikasi yang ditulis ke kode Audio Web lama - hal ini dapat membantu penyiapan Anda berjalan dalam waktu minimum, karena library ini akan memberi alias pada objek dan metode dengan tepat. Sebenarnya, patch yang dicantumkan library adalah panduan yang baik untuk hal-hal yang telah berubah.

Pertama dan terpenting

Setiap referensi ke window.webkitAudioContext harus dibuat ke window.AudioContext. Masalah ini sering kali diperbaiki dengan cara sederhana:

window.AudioContext = window.AudioContext || window.webkitAudioContext;

Jika aplikasi Anda merespons dengan pesan seperti “Sayangnya, browser Anda tidak mendukung Audio Web. Gunakan Chrome atau Safari.” - kemungkinan besar pengguna mencari webkitAudioContext secara eksplisit. Developer yang buruk! Anda bisa saja mendukung Firefox selama berbulan-bulan!

Tetapi ada beberapa penghapusan kode lainnya yang lebih halus, beberapa di antaranya mungkin kurang jelas.

  • Konstanta jenis terenumerasi BiquadFilter untuk atribut .type (yang sekarang berupa string) tidak lagi muncul pada objek BiquadFilterNode, dan kami tidak mendukungnya di atribut .type. Jadi, Anda tidak menggunakan .LOWPASS (atau 0) lagi - Anda menetapkannya ke “lowpass”.
  • Selain itu, atribut Oscillator.type kini juga merupakan jenis terenumerasi string - tidak lagi .SAWTOOTH.
  • PannerNode.type kini juga merupakan jenis string yang dienumerasi.
  • PannerNode.distanceModel kini juga merupakan jenis string yang dienumerasi.
  • createGainNode diganti namanya menjadi createGain
  • createDelayNode diganti namanya menjadi createDelay
  • createJavaScriptNode diganti namanya menjadi createScriptProcessor
  • AudioBufferSourceNode.noteOn() sekarang diganti dengan start()
  • AudioBufferSourceNode.noteGrainOn() kini juga diganti dengan start()
  • AudioBufferSourceNode.noteOff() diganti nama menjadi stop()
  • OscillatorNode.noteOn() diganti nama menjadi start()
  • OscillatorNode.noteOff() diganti nama menjadi stop()
  • AudioParam.setTargetValueAtTime() diganti nama menjadi setTargetAtTime()
  • AudioContext.createWaveTable() dan OscillatorNode.setWaveTable() sekarang berganti nama menjadi createPeriodicWave() andsetPeriodicWave()`.
  • AudioBufferSourceNode.looping dihapus, dan mendukung .loop
  • AudioContext.createBuffer(ArrayBuffer, boolean) untuk mendekode blob data audio yang dienkode secara sinkron telah dihapus. Panggilan sinkron yang memerlukan waktu lama untuk diselesaikan merupakan praktik coding yang buruk; sebagai gantinya, gunakan panggilan decodeAudioData asinkron. Ini adalah salah satu perubahan yang lebih menantang - Anda harus benar-benar mengubah alur logika - tetapi praktik yang jauh lebih baik. Ehsan Angkari dari Mozilla menulis contoh yang bagus tentang cara melakukan ini dalam postingan mereka tentang mengonversi ke Audio Web standar.

Banyak di antaranya (seperti penggantian nama createGainNode, dan penghapusan decoding sinkron di createBuffer) akan jelas muncul di konsol alat developer sebagai error - namun, beberapa error lainnya, seperti penggunaan ini:

MULTI_LINE_CODE_PLACEHOLDER_1

tidak akan muncul sama sekali, dan gagal secara otomatis (myFilterNode.BANDPASS kini akan di-resolve menjadi undefined (tidak ditentukan), dan upaya menetapkan .type ke undefined (tidak ditentukan) akan gagal menghasilkan efek apa pun. Omong-omong, inilah yang menyebabkan kegagalan vocoder.) Demikian juga, hanya menetapkan filter.type ke angka yang digunakan untuk berfungsi:

myFilterNode.type = 2;

Namun sekarang, Anda perlu menggunakan enumerasi string:

myFilterNode.type = “bandpass”;

Jadi, Anda mungkin ingin melakukan grep kode untuk istilah-istilah berikut:

  • webkitAudioContext
  • .LOWPASS
  • .HIGHPASS
  • .BANDPASS
  • .LOWSHELF
  • .HIGHSHELF
  • .PEAKING
  • .NOTCH
  • .ALLPASS
  • .SINE
  • .SQUARE
  • .SAWTOOTH
  • .TRIANGLE
  • .noteOn
  • .noteGrainOn
  • .noteOff
  • .setWaveTable
  • .createWaveTable
  • .looping
  • .EQUALPOWER
  • .HRTF
  • .LINEAR
  • .INVERSE
  • .EXPONENTIAL
  • createGainNode
  • createDelayNode
  • .type (ya, ini akan memiliki banyak positif palsu - tetapi itu satu-satunya cara untuk mengetahui contoh terakhir di atas.)

Sekali lagi, jika Anda sedang terburu-buru dan ingin segera memulai, cukup ambil salinan library Monkeypatch webkitAudioContext dan sertakan dalam aplikasi Anda. Selamat Peretasan Audio!