
Experiment with particles using WebAssembly and WebGL - Schampu
https://maierfelix.github.io/wasm-particles/static/
======
Kiro
[https://maierfelix.github.io/wasm-
particles/dist/bundle.js](https://maierfelix.github.io/wasm-
particles/dist/bundle.js)

Quite interesting to read. I don't know much about WASM but I presume the big
Uint8Array is the actual C program or something?

~~~
__s
That is correct; it is the WASM binary [http://webassembly.org/docs/binary-
encoding](http://webassembly.org/docs/binary-encoding)

------
Schampu
Source: [https://github.com/maierfelix/wasm-
particles](https://github.com/maierfelix/wasm-particles)

------
shurcooL
Crashes in latest Chrome and Safari on latest iOS (11.1.1). Will have to try
on desktop later.

~~~
cordite
Chrome on iOS is just a wrapper around a safari web view, plus some nice to
haves.

Same behavior observed here too.

~~~
johnrivera
I thought it was using wkwebview, which is faster than uiwebview, but still
behind safari in terms of js performance on iOS.

------
tandav
Why WASM can't give native performance?? (games in a browser?).

All demos I saw only gives 8-10x performance boost?? (with respect to JS)

~~~
steveklabnik
> Why WASM can't give native performance?

As with any language, it depends on how good the optimizations are; wasm is
designed to be able to be JITted fast, but is still fairly new, so there's
still stuff left on the table.

Additionally if you're compiling a language _to_ wasm, you're also at the
mercy of that compiler as well, so it always depends.

> only 8-10x performance boost

I'll take it ;)

~~~
tmzt
> Additionally if you're compiling a language to wasm, you're also at the
> mercy of that compiler as well, so it always depends.

and potentially runtime, depending on the language you are compiling from

~~~
dangerbird2
Most wasm toolchains use clang for c/c++, so poor compiler generation is
rarely a significant issue. IIRC, the emscripten toolchain uses musl as the C
runtime, which is reasonably performant runtime. Of course, if you write
algorithmically inefficient code, no toolchain is going to improve it.

------
Santosh83
I'm getting a steady 40 FPS on Firefox 56 and 58 on Windows 10. About 5 FPS
slower on Chrome 62 on the same machine. And Vivaldi is almost identical to
Chrome, which is expected considering they share the same internals.
Impressive. EDIT: ~640,000 particles on all browsers.

~~~
jcelerier
> Impressive.

... is it ? tech demos ten years ago were already north of 1 million
particles.

[https://www.youtube.com/watch?v=3xN2PkxNRHs](https://www.youtube.com/watch?v=3xN2PkxNRHs)

~~~
giancarlostoro
WebGL is a new frontier for many. I myself was impressed by what I could do
with three.js at work. Also impressed by other three.js projects / products
out there.

------
fulafel
This is webgl 1 I guess? WebGL 2 has some nice particle suited features like
transform feedback:
[https://gpfault.net/posts/webgl2-particles.txt.html](https://gpfault.net/posts/webgl2-particles.txt.html)

~~~
sehugg
Looking at the source, seems they render all the points in software (WASM) to
a 2D texture then to the screen.

------
everyone
Could one use WASM to build a game engine that runs from the web in a browser
and actually performs good?

How does it work? What sort of VM is it running on? How is it compiled?

~~~
notaboutdave
User _rossisred_ ported his "Funky Karts" game from C++ (targeting Android) to
WASM.

Direct link to the game:
[https://www.funkykarts.rocks/demo.html](https://www.funkykarts.rocks/demo.html)

Blog post on porting the engine:
[http://www.rossis.red/wasm.html](http://www.rossis.red/wasm.html)

Original thread:
[https://news.ycombinator.com/item?id=14411328](https://news.ycombinator.com/item?id=14411328)

His post helped me demystify what WASM is capable of and how it fits with the
DOM. He shares some eye-opening code snippets, but the game itself is closed
source so it leaves something to be desired.

~~~
jcelerier
these barrels remind me of that fun old DOS game, Skunny. Quite fun, very nice
port !

------
neals
Is there an performance gain in using WASM?

~~~
steveklabnik
In general, there should be, but it depends on what you're doing. For example,
wasm can't access the DOM directly yet, so you have to call back into JS to do
it, which is much slower than the eventual native API will be. For stuff like
this, though, it should have _much_ lower overhead.

~~~
k__
Wasn't the main point of WASM that it is faster to parse than JavaScript?

~~~
steveklabnik
It's one of the main points, yes.

Parsing isn't the only aspect of overall performance, though.

------
dvdplm
Crashes on Safari Nightly and Firefox Nightly, but very neat when it works! :)

~~~
bobajeff
It works on my phone's browser (which is a fork of Chrome for Android). No
crashes. I even have 34 tabs open.

~~~
johnhenry
Likely, 33 of those tabs are suspended?

~~~
bobajeff
Well, most of them were suspended but I believe there were still a few that
were active at the time.

------
xstartup
Firefox 58, 60FPS.

Chrome: 40 FPS

~~~
tzs
It would probably be useful to include hardware.

60 FPS in Firefox 57.0, Chrome 62.0.3202.89, and Safari 11.0.1, on a 2017 iMac
running High Sierra (10.13.1) with a 3.4 GHz Intel Core i5 and a Radeon Pro
570 4 GB.

------
yakshaving_jgt
So… Who else drew their name?

------
qbaqbaqba
3 fps?

~~~
BatFastard
I get 23 on a beastly desktop with dual GeForce 980Ti. Not bad for 1.8 million
particles!

~~~
onion2k
17fps with 712000 particles on a Nexus 6P. That's really impressive.

~~~
PuffinBlue
That's pretty good! Get between 11-29 fps at 753620 particles on Galaxy s7,
mostly sits at 16 or 17fps though.

I wonder what an iPhone would get, I'm led to believe their GPUs are pretty
strong (to say the least).

