Akses DOM di WebAssembly

11

Saya baru-baru ini mulai menggunakan WebAssembly untuk beberapa proyek saya. Saya melakukan ini karena saya mendengar bahwa Wasm lebih cepat daripada javaScript.
Ketika saya benar-benar memulai proyek Wasm pertama saya, saya menyadari bahwa saya tidak tahu bagaimana memanipulasi DOM di C ++.
Apakah ada cara untuk melakukan ini menggunakan Wasm?

SherylHohman
sumber
Memanipulasi DOM adalah setengah perjalanan, Anda juga perlu memanggil kembali web assembly dari JavaScript.
amirouche
Kecuali jika kinerja skrip Anda benar-benar penting, saya akan mempertimbangkan tetap menggunakan JavaScript. Setengah dari situs web yang menggunakan perakitan web tampaknya menggunakannya untuk tujuan jahat , sehingga beberapa pengguna sudah mencoba untuk menonaktifkan perakitan web di browser mereka.
mzuther

Jawaban:

1

Baru-baru ini saya mulai menggunakan Web Assembly untuk beberapa proyek saya. Saya melakukan ini karena saya mendengar bahwa wasm lebih cepat daripada javascript.

WebAssembly lebih cepat dari JavaScript, tetapi hanya untuk kasus penggunaan tertentu. Dengan WebAssembly, peramban Anda harus melakukan lebih sedikit pekerjaan untuk mengunduh dan mengkompilasi kode Anda, sehingga memberikan waktu mulai yang lebih cepat. Namun, ketika kinerja runtime WebAssembly biasanya hanya 2 hingga 3 kali lebih cepat dari JavaScript. Lihat artikel berikut untuk perbandingan yang sangat bagus dan praktis:

https://hacks.mozilla.org/2018/01/oxidizing-source-maps-with-rust-and-webassembly/

Namun, WebAssembly tidak memiliki akses DOM langsung, jadi meskipun kinerjanya unggul, Anda mungkin menemukan bahwa itu lebih lambat daripada JavaScript untuk kasus penggunaan Anda karena overhead I / O tambahan.

Untuk alasan ini, saat ini orang-orang menemukan paling sukses dengan WebAssembly untuk tugas algoritmik / komputasi intensif.

saya menyadari bahwa saya tidak tahu bagaimana memanipulasi dom di c ++. Apakah ada cara untuk melakukan ini menggunakan wasme?

Untuk memanipulasi DOM Anda harus melakukan ini melalui host JavaScript - modul WebAssembly Anda harus mengirim pesan ke JavaScript 'memintanya' untuk memanipulasi DOM atas namanya.

Karena ini adalah tantangan yang cukup umum, ada berbagai proyek komunitas yang memiliki solusi untuk masalah ini. Saat Anda menggunakan C ++, yang ini mungkin menarik bagi Anda:

https://github.com/mbasso/asm-dom

Di masa depan, ini akan menjadi lebih mudah, proposal seperti Jenis Antarmuka membuatnya lebih mudah untuk berinteraksi dengan lingkungan host dan dapat memungkinkan API Web dipanggil langsung dari WebAssembly.

ColinE
sumber
1

Sayangnya, DOM hanya dapat diakses dalam utas JavaScript utama peramban. Modul Pekerja Layanan, Pekerja Web, dan Majelis Web tidak akan memiliki akses DOM. Manipulasi terdekat yang akan Anda dapatkan dari WASM adalah memanipulasi objek negara yang diteruskan ke dan diberikan oleh utas utama dengan komponen UI berbasis negara seperti Preact / React.

Serialisasi JSON paling sering digunakan untuk melewati status dengan postMessage()atau Saluran Siaran . Bitpacking atau objek biner dapat digunakan dengan TransferrableArrayBuffers untuk pesan yang lebih berkinerja yang menghindari overhead serialisasi / deserialisasi JSON.

AnthumChris
sumber
"Sayangnya, DOM hanya dapat diakses dalam utas JavaScript utama peramban" - sementara itu benar, itu bukan alasan mengapa WebAssembly tidak dapat berinteraksi dengan DOM.
ColinE