
Show HN: A WebAssembly game demo - rossisred
https://www.funkykarts.rocks/demo.html
======
rossisred
Hello,

I have also been taking notes while building this here:

[http://www.rossis.red/wasm.html](http://www.rossis.red/wasm.html)

I'm happy to answer your questions about it.

~~~
binji
Very nice write-up, thanks!

BTW, I also ran into issues with ScriptProcessorNode when generating audio,
and ended up using `createBufferSource` with a scheduled playback time. I
wrote a little about it here: [https://binji.github.io/2017/02/28/binjgb-on-
the-web-part-2....](https://binji.github.io/2017/02/28/binjgb-on-the-web-
part-2.html)

~~~
rossisred
Thanks for sharing! Your article is what I was looking for and didn't find
when I was working on the audio :) That is an interesting approach which I
will definitely try.

------
dccoolgai
This represents simultaneously everything that makes me hopeful about WASM - a
really clean, fun and nice game that performs super well - and everything that
makes me dread it. I was curious so I opened up
[https://www.funkykarts.rocks/demo.wasm](https://www.funkykarts.rocks/demo.wasm)
and there's nothing there that I can really read and learn from. I'm not
saying it isn't worth making the trade, but it seems like a fundamental change
to a part of the web I really loved - the ability to read and learn from
things you experience that are cool - that doesn't seem to be considered very
much and it makes me a little sad to see its inexorable end spelled out. I
think I'll soon miss the days where we all had to show each other our code on
the web.

~~~
shurcooL
Don't you still have that place, for example GitHub, where open source code
lives in non-minified, non-obfuscated form, together with a README, an issue
tracker, etc.?

Why do you need to rely on the production binary to be human readable? Should
web developers be forced to open source all their work, whether they want to
or not, because of technical limitations of the web implementation?

> I think I'll soon miss the days where we all had to show each other our code
> on the web.

All of my code is open source, you're welcome to look at it. That's not
changing because WebAssembly is coming out.

~~~
dccoolgai
"Should web developers be forced to open source all their work, whether they
want to or not"

Yes. If they want it to run on the Web. That's the way it currently is and
that's the thing I'm saying I'll miss.

You don't _have_ to put any of your code on the Web, but when you do I can
read it. I like that.

~~~
tribby
I appreciate the nostalgia and share the sentiment, but it's mostly gone from
the web already thanks to JS minification and asset minification in general.
without a repo to look at the original code, it won't be of much use, even
using devtools. you can figure it out a lot more quickly than analyzing a
binary, sure, but the web isn't a "hey what's this how does this work"
platform anymore, unfortunately.

~~~
hacker_9
Yeah I feel like the OP missed the last 10 years or something, unreadable
minified code is everywhere.

~~~
dccoolgai
I read it well enough to see where the .wasm source was coming from. The
demo.wasm is inscrutable to me where the JS around it is not. I realize not
everyone is at a level where they can debug/read JS, but I can assure you it's
possible to do as a person of only modest intellect. Source: I can do it, and
I am a person of modest intellect. I can't really see a "path forward" doing
the same thing with .wasm, even decompiled to s-expressions.

------
baby
This is amazing, and it runs soooo well.

At the same time it makes me miss Flash.

I know it's easy to hate on flash, it was kinda buggy/slow and it was also
crazily insecure. But the web really got interesting with flash, people were
creating games, animations, interactive websites.

All the websites are pretty static/flat nowadays. Even if from a design point
of view they might look "nicer", I liked the Flash era.

~~~
tarr11
You can build some pretty cool games with libraries like phaser.io.

Here's an example:

[http://www.gunfight.io/](http://www.gunfight.io/)

------
DarkTree
Seems to load and run faster than most webpages. Really cool and a promising
example of WebAssembly

------
shurcooL
Wow, that is a really well polished, completed, and neat little game. Makes
for a great WebAssembly demo given how quickly it loads and how much value you
get out of it.

It runs and looks fantastic at 2560x1600 fullscreen too (on a laptop made in
2011).

------
fattire
In related news, it looks like Unreal Engine just today came out with an
update for "HTML5 Support for WebAssembly and WebGL 2". This seems huge as
there are a lot of games written with the Unreal Engine I'd love to see come
to the web.

[https://www.unrealengine.com/en-US/blog/unreal-
engine-4-16-r...](https://www.unrealengine.com/en-US/blog/unreal-
engine-4-16-released)

------
hashhar
This looks amazing and is buttery smooth. Loads and runs faster than most
webpages even. Takes even less than 10% of my CPU (i5-5200U). Really excited
about what WebAssembly brings to the table. But sadly the WASM is an opaque
format and I couldn't learn anything about the demo.

------
Retr0spectrum
What engine/tools was this made with?

~~~
rossisred
The game has its own custom engine and tools. The engine is in C++ and is
small which made WebAssembly a great fit.

------
z3t4
The game looks good. But I'm a bit skeptical of web-assembly after the flash
era, where games did all kind of nasty stuff. I know "it's just javascript"
but I feel unease having a binary blob of code running on my machine, at least
with "javascript" you can view the source code. I do have JavaScript disabled
by default btw. I also know that png images are also binary blobs, yet I
allowed them, even though there have been exploits, but I feel that png
rendering is more hardened, and can do far less, then web-assembly.

~~~
opendomain
Web Assembly is NOT javascript. It literally is assembly for the web. There
are transpilers that converts higher level code (C#, Go, Python) to Web
Assembly, but the end result is always byte code that is run by the browser.

You may be confused with ASM.Js, which IS javascript. It is a very optimized
version that uses a similar idea of a CPU instruction set (get register, add,
branch on flag, push on stack, etc), but it still is interpreted. ASM.Js is
very fast and also has some transpilers, but it is very different from Web
Assembly.

Web Assembly has the highest potential. High potential for speed,
calculations, AND RISK. The threat model for Web Assembly has not been tested
as well as Javascript.

~~~
colordrops
Well, the WebAssembly bytecode is the same target that is used by JS, so it
kind of is JS in a way, well, at least in the way that is important to the
OP's concern, in that WebAssembly should have the same risk profile as JS.
wasm and JS don't represent two different pipelines - they run on the same VM.

------
REEKAH
Speaking of WebAssembly and games, has anyone tried building their Unity
projects in WebGL and exporting in Web Assembly? I hear they have that feature
in the latest 5.6 version

~~~
TheRoccoB
Yes. It works well, although I paid for a fancier demo and exported it, and it
crashed occasionally.

They've done a pretty good job with compressing the assets too. Good weissman
score.

------
sofaofthedamned
That is so smooth and beautiful, physics are great too. Nice!

------
shodan757
I just get "Sorry, but your browser does not yet support WebAssembly."

I'm on Firefox/Linux. Other WASM demos work, so I'm pretty sure that's a bug.
:)

~~~
rossisred
Thanks for the heads up, that is curious. I don't have access to a linux
machine at the moment, but will investigate later. There should be some output
from binaryen in the JavaScript console, does it report success?

~~~
artursapek
I get the same error, in Chrome 56.0.2924.87 on Ubuntu 16.04.

Console: [http://i.imgur.com/hVNCskv.png](http://i.imgur.com/hVNCskv.png)

~~~
rossisred
WebAssembly support landed in Chrome 57 :)

~~~
artursapek
d'oh, thanks

------
Tistel
very nice. I like the wall jump mechanic.

------
faitswulff
Looks great, and it's snappy! Is "Dartmobile" a reference to Dart the
programming language? It's the same color scheme :p

~~~
rossisred
Yes it is :) Fun fact: the first prototype of the engine was built in Dart and
later re-written in C++ for production.

~~~
bombita
Can you share the prototype? I am excited for reading interesting Dart apps in
the open.

~~~
wutbrodo
Back when Dart first came out (I think 0.1), I built a gravity simulator in
it. It was a shameless rip-off of
[http://www.nowykurier.com/toys/gravity/gravity.html](http://www.nowykurier.com/toys/gravity/gravity.html),
but it was just for me to get a little familiar with it.

It was pretty dang great writing that project, and I'm beyond surprised that
Dart didn't have more success in replacing JS.

I unfortunately lost the source code at some point :( (this was before I got
organized, got a GitHub, etc).

------
Retr0spectrum
Definitely a well made game, but I don't think it would really fit with the
Steam store. It looks like it's doing well on the play store however:
[https://play.google.com/store/apps/details?id=rocks.funkykar...](https://play.google.com/store/apps/details?id=rocks.funkykarts)

~~~
rossisred
The game is popular on the Chrome Web Store, and ~30% of those users are on
Windows. Chrome Apps will stop working on Windows later this year, and Steam
seems like a good place for them to transition. A full blown web version is
another possibility.

------
bobajeff
It doesn't seem to load right in my Nexus 6 Android Chrome 58.

Only the bottom left of the canvas is showing the game the rest is a lite blue
box.

Edit: however it displays correctly in Firefox 53.0.2 (Android) on the same
phone.

~~~
kristianp
It works on my old Android 5 phone in Chrome 58. Amazing that it's supported
so quickly at this stage of wasm development.

------
alexpw
My mbp fans kicked into overdrive, reminding me that this is a browser game,
but otherwise, I echo the sentiments that it loads fast and is really fun.

------
lkurusa
Interesting, wish it was also written in traditional JavaScript, so the
performance could be crosschecked. Thanks for the game, most enjoyable!

------
zokier
Background music does not work for me (Fx/Win10). Devtools console says
"Unsupported sample rate : 48000"

~~~
rossisred
I wrote about this in my audio article [1]. Ideally, browsers will implement
support for a configurable `sampleRate` in the `AudioContext` constructor.

There is a tracking issue [2] for Chrome but I wasn't able to find one for
Firefox.

[1] :
[http://www.rossis.red/wasm.html#audio](http://www.rossis.red/wasm.html#audio)
[2] : [https://crbug.com/432248](https://crbug.com/432248)

------
valuearb
I don't get it. I just see their home page with just a picture and links to
app stores. Tried Chrome and Safari.

------
nafizh
On my Linux Chrome with version 55 - it says, "Sorry, but your browser does
not yet support WebAssembly."

~~~
mrdoob2
Yes, I think you need Chrome 57+.

------
Kiro
OT but how is the coin sound played without user input? Is it a WebAssembly
thing enabling passive sound triggers?

~~~
runarberg
If I remember correctly iOS is the only platform were that limitation ever
existed.

[https://stackoverflow.com/questions/12517000/no-sound-on-
ios...](https://stackoverflow.com/questions/12517000/no-sound-on-ios-6-web-
audio-api)

~~~
Kiro
I get it on my web game on Android:

    
    
       Uncaught (in promise) DOMException: play() can only be initiated by a user gesture.
    

It's triggered in the game loop where the user event has been added to a queue
so it's not in the same call stack. The coins are picked up in the air etc so
I have a hard time believing they are within the same call stack since it's
long after the jump.

------
ninjakeyboard
Nice work! Looks really good.

------
simplify
Very nice. The levels are well-designed from a game design perspective, too.

------
pjmlp
Nice work, I enjoyed playing it.

