Доступ к DOM в WebAssembly

Недавно я начал использовать WebAssembly для некоторых своих проектов. Я делаю это, потому что я слышал, что Wasm быстрее, чем javaScript.
Когда я фактически начал свой первый проект Wasm, я понял, что не знаю, как манипулировать DOM в C ++.
Есть ли способ сделать это с помощью Wasm?

Недавно я начал использовать Web Assembly для некоторых своих проектов. Я делаю это, потому что я слышал, что wasm быстрее, чем javascript.

WebAssembly работает быстрее, чем JavaScript, но только для определенных случаев использования. С WebAssembly ваш браузер должен выполнять меньше работы по загрузке и компиляции кода, что ускоряет его запуск. Однако, когда производительность WebAssembly во время выполнения обычно всего в 2–3 раза выше, чем в JavaScript. Смотрите следующую статью для очень хорошего и практического сравнения:

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

Однако WebAssembly не имеет прямого доступа к DOM, поэтому, несмотря на его превосходную производительность, вы можете обнаружить, что он медленнее, чем JavaScript, для вашего случая использования из-за дополнительных затрат ввода-вывода.

По этой причине в настоящее время люди находят наибольший успех с WebAssembly для алгоритмических / вычислительных задач.

я понял, что не знаю, как манипулировать домом в с ++. Есть ли способ сделать это с помощью wasm?

Чтобы манипулировать DOM, вы должны сделать это через хост JavaScript - ваш модуль WebAssembly должен отправлять сообщения в JavaScript, «прося» его манипулировать DOM от его имени.

Поскольку это довольно распространенная задача, существуют различные проекты сообщества, которые имеют решение этой проблемы. Поскольку вы используете C ++, это может вас заинтересовать:

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

В будущем это станет легче, предложения, такие как типы интерфейсов , упрощают взаимодействие с хост-средой и позволяют вызывать веб-API напрямую из WebAssembly.

К сожалению, доступ к DOM возможен только в основной ветке JavaScript браузера. Модули Service Workers, Web Workers и Web Assembly не будут иметь доступа к DOM. Ближайшая манипуляция, которую вы получите от WASM, - это манипулирование объектами состояния, которые передаются и отображаются главным потоком, с помощью компонентов пользовательского интерфейса на основе состояний, таких как Preact / React.

Сериализация JSON чаще всего используется для передачи состояния postMessage()или широковещательных каналов . Bitpacking или двоичные объекты могут использоваться с TransferrableArrayBuffers для более производительных сообщений, которые избегают издержек сериализации / десериализации JSON.