Uzyskaj dostęp do DOM w WebAssembly

10

Ostatnio zacząłem używać WebAssembly do niektórych moich projektów. Robię to, ponieważ słyszałem, że Wasm jest szybszy niż JavaScript.
Kiedy faktycznie zacząłem swój pierwszy projekt Wasm, zdałem sobie sprawę, że nie wiem, jak manipulować DOM w C ++.
Czy można to zrobić za pomocą Wasm?

webassembly SherylHohman
źródło
Manipulowanie DOMem to połowa drogi, musisz także oddzwonić do złożenia strony internetowej z JavaScript.
amirouche
O ile wydajność twoich skryptów naprawdę nie ma znaczenia, rozważę pozostanie przy JavaScript. Połowa stron internetowych korzystających z asemblera wydaje się używać go do szkodliwych celów , więc niektórzy użytkownicy już próbują wyłączyć asembler w swoich przeglądarkach.
mzuther

Odpowiedzi:

1

Ostatnio zacząłem używać Websemblera do niektórych moich projektów. Robię to, ponieważ słyszałem, że wasm jest szybszy niż javascript.

WebAssembly jest szybszy niż JavaScript, ale tylko w niektórych przypadkach użycia. Dzięki WebAssembly Twoja przeglądarka musi wykonać mniej pracy, aby pobrać i skompilować kod, co skraca czas uruchamiania. Jednak gdy wydajność środowiska wykonawczego WebAssembly jest zazwyczaj tylko 2-3 razy szybsza niż JavaScript. Zobacz bardzo dobry i praktyczny porównanie w następującym artykule:

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

Jednak WebAssembly nie ma bezpośredniego dostępu do DOM, więc pomimo jego doskonałej wydajności może się okazać, że jest wolniejszy niż JavaScript w twoim przypadku użycia z powodu dodatkowego obciążenia We / Wy.

Z tego powodu obecnie ludzie odnajdują największy sukces dzięki WebAssembly w zadaniach intensywnie korzystających z algorytmów / obliczeń.

zdałem sobie sprawę, że nie wiem, jak manipulować domem w c ++. Czy można to zrobić za pomocą wasm?

Aby manipulować DOM, musisz to zrobić za pośrednictwem hosta JavaScript - moduł WebAssembly musi wysyłać wiadomości do JavaScript, „prosząc” go o manipulowanie DOM w jego imieniu.

Ponieważ jest to dość powszechne wyzwanie, istnieje wiele projektów społecznościowych, które mają rozwiązania tego problemu. Gdy używasz C ++, ten może Cię zainteresować:

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

W przyszłości będzie to łatwiejsze, propozycje takie jak Typy interfejsów ułatwiają interakcję ze środowiskiem hosta i mogą umożliwiać wywoływanie interfejsów API sieci Web bezpośrednio z WebAssembly.

ColinE
źródło
1

Niestety dostęp do DOM jest możliwy tylko w głównym wątku JavaScript przeglądarki. Pracownicy serwisowi, pracownicy sieci i moduły składania stron internetowych nie mieliby dostępu do DOM. Najbliższa manipulacja, jaką można uzyskać z WASM, polega na manipulowaniu obiektami stanu, które są przekazywane i renderowane przez główny wątek za pomocą opartych na stanie składników interfejsu użytkownika, takich jak Preact / React.

JSON serializacji jest najczęściej używany do przekazywania stanu z postMessage()lub nadawanie kanałów . Z pakietami ArrayBuffers można stosować Transferrablepakowanie bitów lub obiekty binarne w celu uzyskania bardziej wydajnych komunikatów, które unikają nakładania się serializacji / deserializacji JSON.

AnthumChris
źródło
„Niestety dostęp do DOM jest możliwy tylko w głównym wątku JavaScript przeglądarki” - chociaż to prawda, nie jest to powód, dla którego WebAssembly nie może współpracować z DOM.
ColinE