Porting DOOM (1993) to WebAssembly

Slide 1

Slide 1 text

Manuel Wieser, 2020-04-23 Porting DOOM (1993) to WebAssembl y StahlstadT.js https://manu.ninja, @manuelwieser

Slide 2

Slide 2 text

No content

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

Which DOOM source port should I use?

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

Attempt #1 Chocolate Doom

Slide 8

Slide 8 text

Chocolate Doom Attempt #1 • Chocolate Doom has a separate repository for its build system • git clone https://github.com/chocolate-doom/chocpkg.git • cd chocpkg  ./chocpkg/chocpkg build chocolate-doom • It fetches and compiles all of its dependencies • chocolate-doom-3.0.0 • SDL2_mixer-2.0.4 • SDL2_net-2.0.1 • SDL2-2.0.12

Slide 9

Slide 9 text

Where do I get DOOM.wad?

Slide 10

Slide 10 text

S egmentation F ault

Slide 11

Slide 11 text

Attempt #2 GZDoom

Slide 12

Slide 12 text

GZDoom Attempt #2 • brew install   jpeg-turbo fluid-synth openal-soft libsndfile mpg123 • git clone https://github.com/coelckers/gzdoom

Slide 13

Slide 13 text

GZDoom Attempt #2

Slide 14

Slide 14 text

Problem #1 How the hell does make work?

Slide 15

Slide 15 text

make C/C++ build automation • ./configure  make • make reads a Makefile on how to build a program. • This is easy, if you stay on the same platform … if not, there’s other tools like Autoconf and CMake … they build a build script. To do this they have their own configuration files … http://www.c-howto.de/tutorial/makefiles/

Slide 16

Slide 16 text

CMake A cross-platform build system generator • mkdir build  cd build  cmake ..  # cmake --build . • I was told there’s a GUI? • cmake-gui • ccmake • If you [C] Configure often enough, you will be able to [G] Generate …

Slide 17

Slide 17 text

Problem #2 ZMusic

Slide 18

Slide 18 text

No content

Slide 19

Slide 19 text

ZMusic F ighting the monolith, I guess? • cmake .. throws a Could NOT find ZMusic (missing: ZMUSIC_LIBRARIES ZMUSIC_INCLUDE_DIR) error. • I was able to build ZMusic on the ﬁrst try • cmake --build . ﬁnally compiles GZDoom, which takes ages on my MacBook Air (13-inch, Mid 2013). • ./gzdoom.app/Contents/MacOS/gzdoom

Slide 20

Slide 20 text

Emscripten Getting Started

Slide 21

Slide 21 text

No content

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

Emscripten C/C++ to asm.js/WebAssembl y • “Using Emscripten is, at a base level, fairly simple.”  – Emscripten Tutorial • “Building large projects with Emscripten is very easy. Emscripten provides two simple scripts that conﬁgure your makeﬁles to use emcc as a drop-in replacement for gcc — in most cases the rest of your project’s current build system remains unchanged.”  – Building Projects

Slide 24

Slide 24 text

Emscripten C/C++ to asm.js/WebAssembl y • emcc -v • emconfigure ./configure  emmake make • emcc project.bc -o project.html • emcc compiles the bytecode generated by make to JavaScript,   builds a project.html file as an output,   as well as an accompanying project.js launcher file,   and a project.wasm WebAssembly file.

Slide 25

Slide 25 text

Problem #3 What the hell is this thing building? It's not simple C code anymore ...

Slide 26

Slide 26 text

Attempt #2,5 Chocolate Doom and Emscripten?

Slide 27

Slide 27 text

No content

Slide 28

Slide 28 text

All of this fluff is nested and complicated ...

Slide 29

Slide 29 text

Attempt #3 SDLDoom

Slide 30

Slide 30 text

No content

Slide 31

Slide 31 text

SDLDoom Attempt #3 • SDLDoom is a minimalistic port of Doom by Sam Lantinga • Released in 1998, its based on the code released by id Software in 1997 • Simple DirectMedia Layer? • Sam Lantinga? • It’s a single folder with C code and a configure then make build process

Slide 32

Slide 32 text

SDLDoom Attempt #3 Fix compiler errors

Slide 33

Slide 33 text

SDLDoom Attempt #3 Live codinG

Slide 34

Slide 34 text

SDLDoom Attempt #3 1. Fixing compilation errors • You should hack this file for your BSD sockets layer • SDL_byteorder.h file not found • implicitly declaring library function alloca 2. Fixing runtime errors • failure to dynamicAlloc • Game mode indeterminate. • Uncaught CopyOnLock is not supported for SDL_LockSurface • The game shows a black screen, then halts at the closing credits • wasm streaming compile failed 3. Proﬁt

Slide 35

Slide 35 text

No content

Slide 36

Slide 36 text

No content

Slide 37

Slide 37 text

What I've learned Key takeaways • Stay humble, new stuff is always daunting • Stuff you wrote may not run in a couple of years/months • Front-End Developers are not the only people … • … dealing with platform-speciﬁc problems • … creating overly complex, nested build systems • Don’t try to tackle the complex problem ﬁrst, start small

Slide 38

Slide 38 text

What I've learned Key takeaways • Doom is still fun after 27 years • Porting C code to the web platform is not a one-click solution,   even with tools like Emscripten • Ports can be impressive work on their own • Sh*t about the Doom engine (not part of this talk)

Slide 39

Slide 39 text

No content

Slide 40

Slide 40 text

Manuel Wieser, 2020-04-23 Porting DOOM (1993) to WebAssembl y Questions? StahlstadT.js https://manu.ninja, @manuelwieser