Phaser
Published: 2021-01-09 01:27:57

Phaser 3 is an HTML 5 framework that is used to make games that easily run in the web browser. It is written entirely in either JavaScript or TypeScript (your choice) and makes use of the HTML 5 canvas element to create games that can run directly in your browser without the need of a plugin like Flash Player (which recently had its support dropped from Chrome). Phaser does all the heavy-lifting for you. It handles the DOM interaction while you worry about the look and feel of your game. The prepackaged tools like Physics engines, sprite handlers, audio features and more makes the development process simple. 

##Features
####WebGL and Canvas
Phaser uses both a WebGL and Canvas renderer internally so that it can seamlessly swap between the two based on browser support. It does this through the use of a package builder such as Webpack or Parcel to check the browser first and choose the best choice for the job. This effortless transition is accomplished through the use of a few lines of codes in your `webpack.config.js` file.

####Preloader
The preloader allows all the assets of your game to be loaded and stored in the Global Cache available for use by any child Game Objects. Images, sprite sheets, sounds, tilemaps, JSON, and XML are all parsed and handled automatically through the `load` function.

####Physics
Phaser comes prepackaged with three physics engines to suit your needs. The Arcade Physics library supports funner, less realistic physics as you might see in a 2D arcade game or platformer. Matter JS is a more realistic physics engine with support for real-world systems such as springs, constraints, and tension, as well as polygon support for 3D rendering. Finally, Impact physics allows for the simulation of advanced collision physics when tile mapping.

####Sprites
Sprite sheets allow for an animated character to look like it’s moving by capturing it in different positions and using each position one at a time at a certain framerate. Phaser does the animation for you by simply telling the `anims` function which frames you need and at what speed. Phaser also has a supply of ready-made sprite sheets and other assets like images, particles, sounds, and tile maps available for download from their website at [labs.phaser.io/assets](labs.phaser.io/assets).

####Particles
Phaser has a particle system built in, which allows for easy creation of particle effects such as sparks or lights. Persistent effects are also supported such as smoke, rain, or fire.

####Input
Phaser supports every type of input there is: keyboard, mouse, touchscreen, gamepad. All of these are supported, even if you change mid-game. Any object can be clickable or touchable, and any object can be manipulated through the keyboard. Just supply the rules for the actions and you are good to go.

####Sound
Sound effects are vital to any video game. Whether it be music, speech, bangs, pops, or blasts, the best games usually also have the best sound design. Phaser makes it easy to load your sound files into the game scene and use them at will. It also handles external factors such as volume control and mobile device silence. 

####Tilemaps
Tilemaps are the blueprints of how you want your play area to look. Each tile is designated a position on the canvas through a CSV or Tiled Map data format. Phaser can load, render, and collide with a tilemap with just a few lines of code. Tiles can then be deleted, swapped, or moved easily through the use of tilemap functions.

##Community Support
Phaser has a robust and inclusive community which shares ideas and projects frequently. There is a Phaser forum for discussing tech issues, a Discord server for more casual discourse. The Phaser Twitter account also makes frequent posts showcasing incredible games made through their framework and are always available to answer questions. Tutorials ranging from beginner level to advanced content are free to browse and experiment with as well as open source templates and projects.

Learn more and discover new games by checking out the [news](https://phaser.io/news) section of the phaser website.