Recientemente comencé a usar WebAssembly para algunos de mis proyectos. Estoy haciendo esto porque escuché que Wasm es más rápido que JavaScript.
Cuando realmente comencé mi primer proyecto Wasm, me di cuenta de que no sabía cómo manipular el DOM en C ++.
¿Hay alguna manera de hacer esto usando Wasm?
webassembly
SherylHohman
fuente
fuente
Respuestas:
WebAssembly es más rápido que JavaScript, pero solo para ciertos casos de uso. Con WebAssembly, su navegador tiene que hacer menos trabajo para descargar y compilar su código, lo que le brinda tiempos de inicio más rápidos. Sin embargo, cuando el rendimiento en tiempo de ejecución de WebAssembly es típicamente solo 2 a 3 veces más rápido que JavaScript. Vea el siguiente artículo para una comparación muy buena y práctica:
https://hacks.mozilla.org/2018/01/oxidizing-source-maps-with-rust-and-webassembly/
Sin embargo, WebAssembly no tiene acceso DOM directo, por lo que, a pesar de su rendimiento superior, es posible que sea más lento que JavaScript para su caso de uso debido a la sobrecarga de E / S adicional.
Por esta razón, actualmente las personas están teniendo más éxito con WebAssembly para tareas algorítmicas / computacionales intensivas.
Para manipular el DOM, debe hacerlo a través del host de JavaScript: su módulo WebAssembly tiene que enviar mensajes a JavaScript 'pidiéndole' que manipule el DOM en su nombre.
Como este es un desafío bastante común, hay varios proyectos comunitarios que tienen soluciones al problema. Como está utilizando C ++, este podría ser de su interés:
https://github.com/mbasso/asm-dom
En el futuro, esto será más fácil, las propuestas como Tipos de interfaz están facilitando la interoperabilidad con el entorno host y podrían permitir que las API web se llamen directamente desde WebAssembly.
fuente
Desafortunadamente, solo se puede acceder al DOM dentro del hilo principal de JavaScript del navegador. Los módulos Service Workers, Web Workers y Web Assembly no tendrían acceso DOM. La manipulación más cercana que obtendrá de WASM es manipular objetos de estado que son pasados y renderizados por el hilo principal con componentes de IU basados en estado como Preact / React.
Serialización JSON más a menudo se utiliza para pasar del estado con
postMessage()
o canales de difusión . Los objetos bitpacking o binarios podrían usarse conTransferrable
ArrayBuffers para mensajes más efectivos que eviten la sobrecarga de serialización / deserialización JSON.fuente