davidmcneil/the-rusty-web

Targeting the web with Rust.

The Rusty Web

Note: The contents of this repo are now significantly outdated. Check out rustwasm for the latest and greatest on how to integrate Rust ans WebAssembly.

Discussion on Hacker News.

About

This project demonstrates a complete, albeit simple, example of integrating Rust code into a web application. This is accomplished by compiling Rust to asm.js or WebAssembly. The basic design pattern this project explores uses Rust to implement CPU bound portions of an app while using existing web technologies to handle user facing, I/O bound pieces. The guide explores this design pattern in detail.

The project compares implementations of the k-means clustering algorithm (this example's CPU bound task) applied to an image. The algorithm gives the resulting image a softened, painted look.

Setup

Dependencies

See the guide for steps on installing the dependencies.

• Rust
• Node
• Emscripten

Running the Project Natively

From the top level of the project run

cargo run

or

cargo run --release

The resulting painted image can be found at img/out.jpg.

Running on the Web

From the top level of the project...

Build the asm.js version

cargo build --release --target asmjs-unknown-emscripten

Build the WebAssembly version

cargo build --release --target wasm32-unknown-emscripten

From the website/ directory...

Install node dependencies

npm install

Build the website (build results can be found in website/dist)

npm run build

or build the website in release mode

npm run build-release

or start a web server, website is served at http://localhost:9000/

npm run start

the-rusty-web's Issues

Don't use transmute!

Hey there! I wanted to send you a PR, but couldn't find the text of the gitbook, so I'll just open an issue.

in https://davidmcneil.gitbooks.io/the-rusty-web/content/counter-example.html

this code is better written as

#[no_mangle]
unsafe pub extern "C" fn counter_destroy(counter: *mut Counter) {
    Box::from_raw(counter)
}

#[no_mangle]
pub extern "C" fn counter_create() -> *mut Counter {
    Box::into_raw(Box::new(Counter::new()))
}

That is, from_raw/into_raw over transmute, and the unsafety only belongs on counter_destroy; if you did a null check inside of it, you could make it safe too.

Very interesting guide, thanks for sharing it!

Try replacing powi(2) with a simple multiplication.

You wrote:

However, if you have any insight into the poor performance, issues and pull requests are always welcome!

Here's a suggestion you can try. You're currently using powi(2) to multiply a number by itself in a hot loop:

the-rusty-web/src/kmeans.rs

Line 10 in 84ec53a

sum_sqrs += (observation_1[i] - observation_2[i]).powi(2);

As sunfish said in a HN comment, there's an issue emscripten-core/emscripten-fastcomp#171 in Emscripten where performance for small integer special cases is suboptimal.

Until that issue is resolved, why don't you just try to manually optimize the code by replacing powi(2) with a simple multiplication, and see how much of an effect it has? I think it's interesting to see what'll happen to the native Rust performance, as well as Rust compiled to WebAssembly performance.

WebAssembly support in firefox in the demo

Warning: Native WebAssembly support is not available in this browser, but you can still run the JavaScript and asm.js implementations.
I am using Firefox Developer Edition 53.0a2 (2017-03-07) (64 bit).

cargo

Hi, I tried to compile with:
~/rustprojects/rustyweb$ cargo build --release --target wasm32-unknown-emscripten
and I get the following error:
...........
Downloading num-rational v0.1.36
invalid configuration for key target.wasm32-unknown-emscripten.rustflags
expected a table, but found a array in rustprojects/rustyweb/.cargo/config

Any ideas what is going wrong?

Error from emscripten (missing file) - probably toolchain-related

Hi,

fresh checkout, did emcc --clear-cache and compiled.
Getting this error:

[horus@beast2:~/dev/rust/the-rusty-web] master ± cargo build --release --target wasm32-unknown-emscripten --verbose
       Fresh rustc-serialize v0.3.24
       Fresh lazy_static v0.2.10
       Fresh bitflags v0.7.0
       Fresh scoped_threadpool v0.1.8
       Fresh color_quant v1.0.0
       Fresh glob v0.2.11
       Fresh inflate v0.1.1
       Fresh lzw v0.10.0
       Fresh libc v0.2.33
       Fresh cc v1.0.3
       Fresh either v1.3.0
       Fresh byteorder v1.1.0
       Fresh num-traits v0.1.40
       Fresh scopeguard v0.3.3
       Fresh byteorder v0.5.3
       Fresh gif v0.9.2
       Fresh num_cpus v1.7.0
       Fresh rand v0.3.18
       Fresh itertools v0.5.10
       Fresh enum_primitive v0.1.1
       Fresh num-integer v0.1.35
       Fresh coco v0.1.1
       Fresh num-iter v0.1.34
       Fresh num-bigint v0.1.40
       Fresh rayon-core v1.3.0
       Fresh miniz-sys v0.1.10
       Fresh num-rational v0.1.40
       Fresh rayon v0.8.2
       Fresh flate2 v0.2.20
       Fresh jpeg-decoder v0.1.13
       Fresh png v0.5.2
       Fresh image v0.11.1
   Compiling the_rusty_web v0.1.0 (file:///home/horus/dev/rust/the-rusty-web)
     Running `rustc --crate-name the_rusty_web src/main.rs --crate-type bin --emit=dep-info,link -C opt-level=3 -C metadata=aca243b7d3edf7fb -C extra-filename=-aca243b7d3edf7fb --out-dir /home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps --target wasm32-unknown-emscripten -L dependency=/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps -L dependency=/home/horus/dev/rust/the-rusty-web/target/release/deps --extern rand=/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/librand-07e9929c5a795f3f.rlib --extern image=/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libimage-727edf4ee88fb939.rlib --extern itertools=/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libitertools-bf4d3f737a256992.rlib --extern libc=/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/liblibc-e4b287d3d02bd2ed.rlib '-Clink-args=-s EXPORT_NAME='\''WasmModule'\'' -s EXPORTED_FUNCTIONS=['\''_kmeans_painter_create'\'','\''_kmeans_painter_step'\'','\''_kmeans_painter_destroy'\''] -s ALLOW_MEMORY_GROWTH=1' -L native=/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/build/miniz-sys-cb4c8f6e35b4e3cd/out`
error: linking with `emcc` failed: exit code: 1
  |
  = note: "emcc" "-s" "DISABLE_EXCEPTION_CATCHING=0" "-L" "/home/horus/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/wasm32-unknown-emscripten/lib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/the_rusty_web-aca243b7d3edf7fb.0.o" "-o" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/the_rusty_web-aca243b7d3edf7fb.js" "-s" "EXPORTED_FUNCTIONS=[\"_kmeans_painter_step\",\"_kmeans_painter_create\",\"_kmeans_painter_destroy\",\"_main\",\"___rdl_grow_in_place\",\"___rdl_alloc_zeroed\",\"___rdl_dealloc\",\"___rdl_shrink_in_place\",\"___rdl_alloc_excess\",\"___rdl_usable_size\",\"___rdl_alloc\",\"___rdl_realloc_excess\",\"___rdl_realloc\",\"___rdl_oom\",\"_rust_eh_personality\"]" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/the_rusty_web-aca243b7d3edf7fb.crate.allocator.o" "-O3" "--memory-init-file" "0" "-g0" "-s" "DEFAULT_LIBRARY_FUNCS_TO_INCLUDE=[]" "-L" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps" "-L" "/home/horus/dev/rust/the-rusty-web/target/release/deps" "-L" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/build/miniz-sys-cb4c8f6e35b4e3cd/out" "-L" "/home/horus/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/wasm32-unknown-emscripten/lib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libimage-727edf4ee88fb939.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libscoped_threadpool-426aa0e18bf89149.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libgif-ce35bc0a4def4f3d.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libbyteorder-1ee96d025842cee7.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libpng-fced38775854bd4e.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libbitflags-a3e6a23f93da4e97.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libflate2-30595f89942236eb.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libminiz_sys-1e16115fee04ddca.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libcolor_quant-65c76b17cf203a11.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libitertools-bf4d3f737a256992.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libnum_iter-12decfcc333e54f6.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libnum_rational-d918f0a94b64227d.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libnum_bigint-8e67d5c9da07349b.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libnum_integer-11888d695c0b5433.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/librustc_serialize-e9dee01f329733a0.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libenum_primitive-a59b17d7265e87c3.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libnum_traits-d46d703cec8530a1.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libinflate-00ae28409c547b09.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libjpeg_decoder-271e59b8508b5ff9.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/librayon-97f219d65d435b4f.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libbyteorder-3720559aa21df9b0.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/librayon_core-574aa9faaa70273c.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/librand-07e9929c5a795f3f.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libnum_cpus-3184262a11cad1c6.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/liblibc-e4b287d3d02bd2ed.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libcoco-483914f760d4391d.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libscopeguard-3577d106de4b8520.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libeither-cb0c24a58ae2ea52.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/liblazy_static-9e0a5d503049af89.rlib" "/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/liblzw-92156117f11b621a.rlib" "/home/horus/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/wasm32-unknown-emscripten/lib/libstd-7b157af21ae1347b.rlib" "/home/horus/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/wasm32-unknown-emscripten/lib/liballoc_system-38bc2ffba7aac62a.rlib" "/home/horus/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/wasm32-unknown-emscripten/lib/librand-30d6b4a7069ee56b.rlib" "/home/horus/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/wasm32-unknown-emscripten/lib/libpanic_unwind-d9be38a491a6b20b.rlib" "/home/horus/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/wasm32-unknown-emscripten/lib/libunwind-1768097fd1bb5d0a.rlib" "/home/horus/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/wasm32-unknown-emscripten/lib/liblibc-d4f79324c33264e2.rlib" "/home/horus/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/wasm32-unknown-emscripten/lib/liballoc-e2edf8b78eb9a037.rlib" "/home/horus/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/wasm32-unknown-emscripten/lib/libstd_unicode-29181a531b1322da.rlib" "/home/horus/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/wasm32-unknown-emscripten/lib/libcore-ac3876fe094f9f74.rlib" "/home/horus/.rustup/toolchains/stable-x86_64-unknown-linux-gnu/lib/rustlib/wasm32-unknown-emscripten/lib/libcompiler_builtins-4917ae9e58e9366a.rlib" "-l" "c" "-s" "EXPORT_NAME=\'WasmModule\'" "-s" "EXPORTED_FUNCTIONS=[\'_kmeans_painter_create\',\'_kmeans_painter_step\',\'_kmeans_painter_destroy\']" "-s" "ALLOW_MEMORY_GROWTH=1" "-s" "BINARYEN=1" "-s" "ERROR_ON_UNDEFINED_SYMBOLS=1"
  = note: INFO:root:generating system library: dlmalloc.bc... (this will be cached in "/home/horus/.emscripten_cache/asmjs/dlmalloc.bc" for subsequent builds)
          INFO:root: - ok
          INFO:root:generating system library: libc.bc... (this will be cached in "/home/horus/.emscripten_cache/asmjs/libc.bc" for subsequent builds)
          INFO:root: - ok
          INFO:root:generating system library: wasm-libc.bc... (this will be cached in "/home/horus/.emscripten_cache/asmjs/wasm-libc.bc" for subsequent builds)
          INFO:root: - ok
          Traceback (most recent call last):
            File "/usr/lib/emscripten/emcc.py", line 2611, in <module>
              run()
            File "/usr/lib/emscripten/emcc.py", line 1812, in run
              wasm_text_target, misc_temp_files, optimizer)
            File "/usr/lib/emscripten/emcc.py", line 2279, in do_binaryen
              subprocess.check_call(cmd)
            File "/usr/lib/python2.7/subprocess.py", line 181, in check_call
              retcode = call(*popenargs, **kwargs)
            File "/usr/lib/python2.7/subprocess.py", line 168, in call
              return Popen(*popenargs, **kwargs).wait()
            File "/usr/lib/python2.7/subprocess.py", line 390, in __init__
              errread, errwrite)
            File "/usr/lib/python2.7/subprocess.py", line 1025, in _execute_child
              raise child_exception
          OSError: [Errno 2] No such file or directory
          

error: aborting due to previous error

error: Could not compile `the_rusty_web`.

Caused by:
  process didn't exit successfully: `rustc --crate-name the_rusty_web src/main.rs --crate-type bin --emit=dep-info,link -C opt-level=3 -C metadata=aca243b7d3edf7fb -C extra-filename=-aca243b7d3edf7fb --out-dir /home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps --target wasm32-unknown-emscripten -L dependency=/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps -L dependency=/home/horus/dev/rust/the-rusty-web/target/release/deps --extern rand=/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/librand-07e9929c5a795f3f.rlib --extern image=/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libimage-727edf4ee88fb939.rlib --extern itertools=/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/libitertools-bf4d3f737a256992.rlib --extern libc=/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/deps/liblibc-e4b287d3d02bd2ed.rlib -Clink-args=-s EXPORT_NAME='WasmModule' -s EXPORTED_FUNCTIONS=['_kmeans_painter_create','_kmeans_painter_step','_kmeans_painter_destroy'] -s ALLOW_MEMORY_GROWTH=1 -L native=/home/horus/dev/rust/the-rusty-web/target/wasm32-unknown-emscripten/release/build/miniz-sys-cb4c8f6e35b4e3cd/out` (exit code: 101)

Rust istalled via rustup (Arch linux package)

$ rustc -V
rustc 1.21.0 (3b72af97e 2017-10-09)
$ rustup -V
rustup 1.6.0
$  rustup target list
[...]
wasm32-unknown-emscripten (installed)
[...]
x86_64-unknown-linux-gnu (default)
[...]
$ emcc --version
emcc (Emscripten gcc/clang-like replacement) 1.37.22 ()
Copyright (C) 2014 the Emscripten authors (see AUTHORS.txt)
This is free and open source software under the MIT license.
There is NO warranty; not even for MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.

Unfortunately, the message does not tell which file is missing.
Any ideas?

Cheers!