5 ms·

WASM browser game

82 points by awwsmm 3y ago

"Game" is a stretch, but I put together this repo containing a pure Rust app which uses SDL2 and compiles to WASM (and can be run in a browser). Older resources were a bit out of date and a bit too verbose for my purposes, so here's a minimal working example.

deleted 3y ago
[deleted]
sdwr 3y ago
Appreciate the example! I've played around with game dev in JS before, how does this compare?
- awwsmm 3y ago
  I'm only just beginning to scratch the surface with gamedev in Rust, but JS and Rust are quite different languages. Rust is compiled, with strong typing. But once you get the mechanics of compiling to WASM figured out (as I have in this repo), it's pretty pleasant to work with.
  - FullyFunctional 3y ago
    Having reluctantly hacked up an emulator in Javascript, it was always very fragile. I'm very motivated to reimplement it in Rust and your framework looks like it has almost everything I need. The only thing missing is persistent state (eg. Web Storage API and import/export).
mrkramer 3y ago
I'm planning on learning Rust and experimenting with game dev so this might help me. Thx.
- SeanAnderson 3y ago
  https://github.com/MeoMix/symbiants https://github.com/MeoMix/symbiants Here's my open source game written in Rust and compiled to WASM if you want more reading material :) It uses Bevy not SDL2, though.
- Tsarbomb 3y ago
  Check out Bevy. https://bevyengine.org/ https://bevyengine.org/ It has the best ECS design I've ever seen for a game engine. Super fun to use. Currently no editor and you need to wrap your head around ECS, but it will definitely push you to improve your rust skills. Edit: Also it can be compiled for WASM.
- lordswork 3y ago
  I have been having a blast learning macroquad and Rust at the same time by making games. Also compiles to wasm, android, and iOS.
TillE 3y ago
I was confused about where/how SDL gets recompiled for WASM, but it looks like Emscripten specifically has built-in support for SDL and a handful of other libraries. That's cool. Other C dependencies could probably be managed with vcpkg.
- speps 3y ago
  If you don't want the portability, you can also write basic drawing code in JS, eg. WebGL, Canvas, WebGPU, whatever other API. Then, you can expose some basic functions to your WASM interface. It's more flexible but not much more complicated if you already are comfortable with JS.
- gnulinux 3y ago
  SDL API is used to interface with HTML5 canvas operations so that SDL doesn't need to be compiled: the entire SDL API is literally a primitive in your browser.
  - a1o 3y ago
    That is not true, SDL2 port is written in C and it has to be compiled. Here's where it's built https://github.com/emscripten-core/emscripten/blob/main/tools/ports/sdl2.py https://github.com/emscripten-core/emscripten/blob/main/tool...
    - versteegen 3y ago
      Half true. Emscripten implements (much of) the SDL 1.2 (and also SDL_mixer 1.2) API in Javascript here: https://github.com/emscripten-core/emscripten/blob/main/src/library_sdl.js https://github.com/emscripten-core/emscripten/blob/main/src/.... On the other hand SDL 2 (and SDL_mixer 2) are proper ports (which you linked to). So there's quite a size penalty to using SDL 2 rather than SDL 1.2, but the reimplemented SDL[_mixer] 1.2 is incomplete and differs from official.
      - deleted 3y ago
        [deleted]
mortallywounded 3y ago
Ebiten (Go package) compiles for all OSes, Switch and web via Wasm as well. The binaries are little fat but it's really nice :)
deleted 3y ago
[deleted]
pixelpoet 3y ago
A minimal C++ / Windows thing like this would've been right up my alley :)
- unclad5968 3y ago
  https://emscripten.org/docs/getting_started/Tutorial.html https://emscripten.org/docs/getting_started/Tutorial.html
pengaru 3y ago
I'm curious why there's so much interest in using Rust for gamedev. It strikes me as the polar opposite of a minimal-friction maximum-iteration-velocity you'd want for something creative like video games. Is it just a product of the general hipness/hype around the language? Jon Blow (Braid, The Witness) on rust for games: https://www.youtube.com/watch?v=SodXi2t1mtE https://www.youtube.com/watch?v=SodXi2t1mtE
- jasonjmcghee 3y ago
  For a lot of the same reasons people use C++, but I’d argue rust is more approachable.
  - HumanOstrich 3y ago
    C++ is definitely more approachable than Rust.
    - awwsmm 3y ago
      Having programmed in both for years, I respectfully disagree.
- capitainenemo 3y ago
  IMO Kyren (the game dev who created a large portion of the Starbound game) covers this well in her Rust 2018 keynote. https://kyren.github.io/2018/09/14/rustconf-talk.html https://kyren.github.io/2018/09/14/rustconf-talk.html She is of the opinion Rust is well suited to game dev, and ECS is an excellent choice for a game design. She works off an example from the Starbound code. Her thesis. "Rust, by design, makes certain programming patterns more painful than others. This is a GOOD thing! It turns out that, for game development, the patterns that end up being the easiest to deal with in Rust closely mirror the patterns that are easiest for game development in any language. I unfortunately had to learn this the HARD way! Rust highly rewards data-oriented design with simple, understandable ownership semantics, and this is great news because this is a really good fit for game development. I suspect this is also true generally, not just for game development! (but what do I know?)"
nmilo 3y ago
This is nice. I tried to set up something similar using wasm-pack and npm but the whole thing was kind of a mess. Though I heard the emscripten backend is deprecated/unsupported/WIP? Anyone know if that's still the case?
- jsheard 3y ago
  The Rust Emscripten backend has been on life support for years, all focus has shifted over to the wasm32-unknown-unknown target and associated tooling like wasm-bindgen for generating the JavaScript glue code. I think the only reason you might still want to use the Emscripten backend is if you must link a C or C++ library into your Rust project and compile it to WebAssembly, the newer backend works best with pure-Rust projects.
  - FullyFunctional 3y ago
    Does this mean that it would have been better to base hello-rust-sdl2-wasm on wasm32-unknown-unknown target (assuming this is possible)? EDIT: trying to answer this myself got me down this rathole: https://users.rust-lang.org/t/fixing-rusts-webassembly-targets/88947/4 https://users.rust-lang.org/t/fixing-rusts-webassembly-targe... and https://github.com/rust-lang/rust/issues/83788 https://github.com/rust-lang/rust/issues/83788 I did find older alternative solutions that uses wasm32-unknown-emscripten, like https://github.com/tanis2000/rust-sdl2-wasm https://github.com/tanis2000/rust-sdl2-wasm but it's not obvious to me that this is a better solution. TL;DR: it's currently a mess
    - jsheard 3y ago
      Ideally you wouldn't use SDL at all, you would use equivalent native Rust libraries like winit for windowing and wgpu for graphics, which all work with wasm32-unknown-unknown.
      - FullyFunctional 3y ago
        Sure. Any suggestions? (I don’t need much, just kbd input and pixel graphics out)
Sharlin 3y ago
Nice! I literally yesterday started writing wasm support for a Rust project of mine, so this is very topical to me :) I got a hacky PoC running but it definitely needs some design work…

82 points by awwsmm 3y ago

deleted 3y ago

[deleted]

sdwr 3y ago

Appreciate the example! I've played around with game dev in JS before, how does this compare?

awwsmm 3y ago
I'm only just beginning to scratch the surface with gamedev in Rust, but JS and Rust are quite different languages. Rust is compiled, with strong typing. But once you get the mechanics of compiling to WASM figured out (as I have in this repo), it's pretty pleasant to work with.
- FullyFunctional 3y ago
  Having reluctantly hacked up an emulator in Javascript, it was always very fragile. I'm very motivated to reimplement it in Rust and your framework looks like it has almost everything I need. The only thing missing is persistent state (eg. Web Storage API and import/export).

mrkramer 3y ago

I'm planning on learning Rust and experimenting with game dev so this might help me. Thx.

SeanAnderson 3y ago
https://github.com/MeoMix/symbiants https://github.com/MeoMix/symbiants Here's my open source game written in Rust and compiled to WASM if you want more reading material :) It uses Bevy not SDL2, though.
Tsarbomb 3y ago
Check out Bevy. https://bevyengine.org/ https://bevyengine.org/ It has the best ECS design I've ever seen for a game engine. Super fun to use. Currently no editor and you need to wrap your head around ECS, but it will definitely push you to improve your rust skills. Edit: Also it can be compiled for WASM.
lordswork 3y ago
I have been having a blast learning macroquad and Rust at the same time by making games. Also compiles to wasm, android, and iOS.

TillE 3y ago

I was confused about where/how SDL gets recompiled for WASM, but it looks like Emscripten specifically has built-in support for SDL and a handful of other libraries. That's cool. Other C dependencies could probably be managed with vcpkg.

speps 3y ago
If you don't want the portability, you can also write basic drawing code in JS, eg. WebGL, Canvas, WebGPU, whatever other API. Then, you can expose some basic functions to your WASM interface. It's more flexible but not much more complicated if you already are comfortable with JS.
gnulinux 3y ago
SDL API is used to interface with HTML5 canvas operations so that SDL doesn't need to be compiled: the entire SDL API is literally a primitive in your browser.
- a1o 3y ago
  That is not true, SDL2 port is written in C and it has to be compiled. Here's where it's built https://github.com/emscripten-core/emscripten/blob/main/tools/ports/sdl2.py https://github.com/emscripten-core/emscripten/blob/main/tool...
  - versteegen 3y ago
    Half true. Emscripten implements (much of) the SDL 1.2 (and also SDL_mixer 1.2) API in Javascript here: https://github.com/emscripten-core/emscripten/blob/main/src/library_sdl.js https://github.com/emscripten-core/emscripten/blob/main/src/.... On the other hand SDL 2 (and SDL_mixer 2) are proper ports (which you linked to). So there's quite a size penalty to using SDL 2 rather than SDL 1.2, but the reimplemented SDL[_mixer] 1.2 is incomplete and differs from official.
    - deleted 3y ago
      [deleted]

mortallywounded 3y ago

Ebiten (Go package) compiles for all OSes, Switch and web via Wasm as well. The binaries are little fat but it's really nice :)

deleted 3y ago

[deleted]

pixelpoet 3y ago

A minimal C++ / Windows thing like this would've been right up my alley :)

unclad5968 3y ago
https://emscripten.org/docs/getting_started/Tutorial.html https://emscripten.org/docs/getting_started/Tutorial.html

pengaru 3y ago

I'm curious why there's so much interest in using Rust for gamedev. It strikes me as the polar opposite of a minimal-friction maximum-iteration-velocity you'd want for something creative like video games. Is it just a product of the general hipness/hype around the language? Jon Blow (Braid, The Witness) on rust for games: https://www.youtube.com/watch?v=SodXi2t1mtE https://www.youtube.com/watch?v=SodXi2t1mtE

jasonjmcghee 3y ago
For a lot of the same reasons people use C++, but I’d argue rust is more approachable.
- HumanOstrich 3y ago
  C++ is definitely more approachable than Rust.
  - awwsmm 3y ago
    Having programmed in both for years, I respectfully disagree.
capitainenemo 3y ago
IMO Kyren (the game dev who created a large portion of the Starbound game) covers this well in her Rust 2018 keynote. https://kyren.github.io/2018/09/14/rustconf-talk.html https://kyren.github.io/2018/09/14/rustconf-talk.html She is of the opinion Rust is well suited to game dev, and ECS is an excellent choice for a game design. She works off an example from the Starbound code. Her thesis. "Rust, by design, makes certain programming patterns more painful than others. This is a GOOD thing! It turns out that, for game development, the patterns that end up being the easiest to deal with in Rust closely mirror the patterns that are easiest for game development in any language. I unfortunately had to learn this the HARD way! Rust highly rewards data-oriented design with simple, understandable ownership semantics, and this is great news because this is a really good fit for game development. I suspect this is also true generally, not just for game development! (but what do I know?)"

nmilo 3y ago

This is nice. I tried to set up something similar using wasm-pack and npm but the whole thing was kind of a mess. Though I heard the emscripten backend is deprecated/unsupported/WIP? Anyone know if that's still the case?

jsheard 3y ago
The Rust Emscripten backend has been on life support for years, all focus has shifted over to the wasm32-unknown-unknown target and associated tooling like wasm-bindgen for generating the JavaScript glue code. I think the only reason you might still want to use the Emscripten backend is if you must link a C or C++ library into your Rust project and compile it to WebAssembly, the newer backend works best with pure-Rust projects.
- FullyFunctional 3y ago
  Does this mean that it would have been better to base hello-rust-sdl2-wasm on wasm32-unknown-unknown target (assuming this is possible)? EDIT: trying to answer this myself got me down this rathole: https://users.rust-lang.org/t/fixing-rusts-webassembly-targets/88947/4 https://users.rust-lang.org/t/fixing-rusts-webassembly-targe... and https://github.com/rust-lang/rust/issues/83788 https://github.com/rust-lang/rust/issues/83788 I did find older alternative solutions that uses wasm32-unknown-emscripten, like https://github.com/tanis2000/rust-sdl2-wasm https://github.com/tanis2000/rust-sdl2-wasm but it's not obvious to me that this is a better solution. TL;DR: it's currently a mess
  - jsheard 3y ago
    Ideally you wouldn't use SDL at all, you would use equivalent native Rust libraries like winit for windowing and wgpu for graphics, which all work with wasm32-unknown-unknown.
    - FullyFunctional 3y ago
      Sure. Any suggestions? (I don’t need much, just kbd input and pixel graphics out)

Sharlin 3y ago

Nice! I literally yesterday started writing wasm support for a Rust project of mine, so this is very topical to me :) I got a hacky PoC running but it definitely needs some design work…