4. Game Assets

The previous chapters have shown you how to make a very basic game application by writing your own game loop methods as a part of an object called Game. You have seen which instructions in JavaScript retrieve the canvas as well as the canvas context, which is used to perform operations on the canvas. You have seen a few simple examples where you changed the background color. You also made a rectangle move over the screen by using the current system time in combination with the game loop methods. This chapter shows how to draw images on the screen, which is the first step toward making nice-looking games. In computer graphics, these images are also called sprites. Sprites are generally loaded from a file. This means any program that draws sprites is no longer simply an isolated set of instructions, but relies on game assets that are stored somewhere. This immediately introduces a number of things that you need to think about: