@swordjs/wasmedge-quickjs
v0.5.0-alpha.1
Published
Now supporting wasmedge socket for HTTP requests and Tensorflow in JavaScript programs!
Readme
Run JavaScript in WebAssembly
Now supporting wasmedge socket for HTTP requests and Tensorflow in JavaScript programs!
Prerequisites
Make sure that you will have GCC installed on Ubuntu 20.04.
$ sudo apt update
$ sudo apt install build-essentialInstall Rust and use the following command to install the wasm32-wasi target.
$ rustup target add wasm32-wasiInstall wasmedge CLI tool. Make sure that you use the -e all option to install the WasmEdge Tensorflow extensions if you want to try the Tensorflow examples.
Hello world
Build
$ cargo build --target wasm32-wasi --releaseRun
$ wasmedge --dir .:. target/wasm32-wasi/release/wasmedge_quickjs.wasm example_js/hello.js WasmEdge RuntimeAdd Core Module With JavaScript(ES)
Build
cargo build --target wasm32-wasi --releaseRun
$ wasmedge --dir .:. target/wasm32-wasi/release/wasmedge_quickjs.wasm example_js/module_demo/demo.js
ReferenceError: could not load module filename 'my_mod_1'
$ ls example_js/module_demo/modules/
my_mod_1.js my_mod_2.js
# copy `my_mod_1.js` & `my_mod_2.js` into modules/
# and wasmedge_quickjs will load it as a core module
$ cp example_js/module_demo/modules/* modules/
$ wasmedge --dir .:. target/wasm32-wasi/release/wasmedge_quickjs.wasm example_js/module_demo/demo.js
hello from "my_mod_1.js"
hello from "my_mod_2.js"
Async HTTP Request
Build
$ cargo build --target wasm32-wasi --releaseRun
HTTP client applications.
$ wasmedge --dir .:. target/wasm32-wasi/release/wasmedge_quickjs.wasm example_js/wasi_http_client.jsStart an HTTP server.
$ nohup wasmedge --dir .:. target/wasm32-wasi/release/wasmedge_quickjs.wasm example_js/wasi_http_echo.js &Access the server.
$ curl -d "WasmEdge" -X POST http://localhost:8000
echo:WasmEdgeThese examples also show how to import another JavaScript file into the current program.
React SSR
Build
$ cargo build --target wasm32-wasi --releaseThen use rollup.js to bundle the React application into a combined JS file. It turns the CommonJS modules in the application into ES6 modules, which we support.
$ cd example_js/react_ssr
$ npm install
$ npm run buildRun
$ wasmedge --dir .:. ../../target/wasm32-wasi/release/wasmedge_quickjs.wasm dist/main.js
<div data-reactroot=""><div>This is home</div><div><div>This is page</div></div></div>React Stream SSR
Build
$ cargo build --target wasm32-wasi --releaseThen use rollup.js to bundle the React application into a combined JS file. It turns the CommonJS modules in the application into ES6 modules, which we support.
$ cd example_js/react_ssr_stream
$ npm install
$ npm run buildRun
Start the server.
$ nohup wasmedge --dir .:. ../../target/wasm32-wasi/release/wasmedge_quickjs.wasm dist/main.mjs &Access the server.
$ curl http://localhost:8001The results show the response comes in chuncks and the client closes the connection once all chuncks are received.
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
0 0 0 0 0 0 0 0 --:--:-- --:--:-- --:--:-- 0
100 211 0 211 0 0 1029 0 --:--:-- --:--:-- --:--:-- 1024
100 275 0 275 0 0 221 0 --:--:-- 0:00:01 --:--:-- 220
100 547 0 547 0 0 245 0 --:--:-- 0:00:02 --:--:-- 245
100 1020 0 1020 0 0 413 0 --:--:-- 0:00:02 --:--:-- 413
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><title>Title</title></head><body><div><div> This is LazyHome </div><!--$?--><template id="B:0"></template><div> loading... </div><!--/$--></div></body></html><div hidden id="S:0"><template id="P:1"></template></div><div hidden id="S:1"><div><div>This is lazy page</div></div></div><script>function $RS(a,b){a=document.getElementById(a);b=document.getElementById(b);for(a.parentNode.removeChild(a);a.firstChild;)b.parentNode.insertBefore(a.firstChild,b);b.parentNode.removeChild(b)};$RS("S:1","P:1")</script><script>function $RC(a,b){a=document.getElementById(a);b=document.getElementById(b);b.parentNode.removeChild(b);if(a){a=a.previousSibling;var f=a.parentNode,c=a.nextSibling,e=0;do{if(c&&8===c.nodeType){var d=c.data;if("/$"===d)if(0===e)break;else e--;else"$"!==d&&"$?"!==d&&"$!"!==d||e++}d=c.nextSibling;f.removeChild(c);c=d}while(c);for(;b.firstChild;)f.insertBefore(b.firstChild,c);a.data="$";a._reactRetry&&a._reactRetry()}};$RC("B:0","S:0")</script>TensorFlow
Build
Note: Build the QuickJS interpreter with the WasmEdge Tensorflow extension.
$ cargo build --target wasm32-wasi --release --features=tensorflowRun
$ cd example_js/tensorflow_lite_demo
$ wasmedge-tensorflow-lite --dir .:. ../../target/wasm32-wasi/release/wasmedge_quickjs.wasm main.jsES6 module support
Build
$ cargo build --target wasm32-wasi --releaseRun
$ cd example_js/es6_module_demo
$ wasmedge --dir .:. ../../target/wasm32-wasi/release/wasmedge_quickjs.wasm demo.jsOptional: Get static-lib & binding.rs
If you want to build a custom libquickjs.a to export some static c function.
See [quickjs-wasi]
run quickjs-wasi/lib/build.sh