Book Image

Hands-On Game Development with WebAssembly

By : Rick Battagline
Book Image

Hands-On Game Development with WebAssembly

By: Rick Battagline

Overview of this book

Within the next few years, WebAssembly will change the web as we know it. It promises a world where you can write an application for the web in any language, and compile it for native platforms as well as the web. This book is designed to introduce web developers and game developers to the world of WebAssembly by walking through the development of a retro arcade game. You will learn how to build a WebAssembly application using C++, Emscripten, JavaScript, WebGL, SDL, and HTML5. This book covers a lot of ground in both game development and web application development. When creating a game or application that targets WebAssembly, developers need to learn a plethora of skills and tools. This book is a sample platter of those tools and skills. It covers topics including Emscripten, C/C++, WebGL, OpenGL, JavaScript, HTML5, and CSS. The reader will also learn basic techniques for game development, including 2D sprite animation, particle systems, 2D camera design, sound effects, 2D game physics, user interface design, shaders, debugging, and optimization. By the end of the book, you will be able to create simple web games and web applications targeting WebAssembly.
Table of Contents (18 chapters)

HTML5 and game development

Most HTML rendering is done through the HTML Document Object Model (DOM). The DOM is what is known as a retained mode graphical library. Retained mode graphics retain a tree known as a scene graph. This scene graph keeps track of all the graphical elements in our model and how to render them. The nice thing about retained mode graphics is that they are straightforward for a developer to manage. The graphical library does all the heavy lifting and keeps track of our objects for us as well as where they render. The downside is that a retained mode system takes up a lot more memory and provides a lot less control to the developer. When we write HTML5 games, we could take images rendered in the DOM using <IMG> HTML elements and move those elements around using JavaScript or CSS animations to manipulate the positions of those images within the DOM directly...