Acceda al DOM en WebAssembly

11

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

La manipulación del DOM es la mitad del viaje, también debe volver a llamar el ensamblaje web desde JavaScript.

— amirouche

A menos que el rendimiento de sus scripts realmente sea importante, consideraría seguir con JavaScript. La mitad de los sitios web que usan el ensamblaje web parecen usarlo con fines maliciosos , por lo que algunos usuarios ya intentan desactivar el ensamblaje web en sus navegadores.

— mzuther

1

Recientemente comencé a usar Web Assembly para algunos de mis proyectos. Estoy haciendo esto porque escuché que wasm es más rápido que javascript.

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.

Me di cuenta de que no sabía cómo manipular el dom en c ++. ¿Hay alguna manera de hacer esto usando wasm?

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.

— ColinE
fuente

1

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 con TransferrableArrayBuffers para mensajes más efectivos que eviten la sobrecarga de serialización / deserialización JSON.

— AnthumChris
fuente

"Desafortunadamente, solo se puede acceder al DOM dentro del hilo principal de JavaScript del navegador", aunque eso es cierto, no es la razón por la cual WebAssembly no puede interactuar con el DOM.

— ColinE