Phaser 4 is here, representing a major update for the framework. For those unfamiliar, Phaser is a popular open source framework for building 2D games in JavaScript, mainly for the web in browsers, but also usable in mobile and desktop apps via wrappers. It is a mature solution that has been in development for 13 years and has been used to power thousands of titles, from prototypes to full scale commercial games. Phaser is also moving toward first class 3D support. However, for fully 3D games, other choices are currently recommended.

This latest update introduces a new WebGL renderer featuring a modern node based architecture that better manages WebGL state and handles context loss more gracefully. The Phaser team states that it is significantly faster, as well as more reliable and efficient, and can be up to 100x faster than before, capable of rendering over a million sprites in a single draw call.

Phaser 4 Is Here! | New Renderer, GPU Sprites, Filters & More | Full Overview

The new tilemap GPU layer offers seamless rendering with accurate texture filtering and strong performance. It enables the rendering of entire maps as a single quad with shader cost per pixel rather than per tile. This allows maps up to 4096 by 4096 tiles to be displayed without performance penalties tied to tile count.

The renderer also introduces smarter batching. Index buffers reduce vertex upload costs by roughly a third, and data is only sent to the GPU when required.

Other highlight features in this release include a new unified filter system. Effects and masks are now part of a single cohesive pipeline, removing previous restrictions on which objects can support effects. This release includes a large library of built in filters such as Blur, Glow, Shadow, Pixelate, ColorMatrix, Bloom, Vignette, and Wipe, along with others.

New additions include ImageLight for image based lighting, Blocky for pixel art friendly pixelation, and GradientMap for palette swap effects. It also adds Quantize for retro dithered palettes, Key for chroma keying, and NormalTools for normal map manipulation. The Blend filter brings all 27 Canvas blend modes to WebGL.

The lighting system has also been improved and can now be enabled with a single line of code. Sprites can cast self shadows based on their own texture, lights now include an explicit z height value, and lighting works across most game objects including BitmapText, Particles, TileSprite, and both tilemap layer types.

Phaser 4 sprite shadow casting.

Several new game objects have been added, including Gradient and Noise, enabling more advanced visuals without a significant impact on frame rates.

Phaser is also being developed with AI usage in mind. The team states that Phaser has been part of the training data for major frontier language models, including tools such as GitHub Copilot, Claude Code, Cursor, Codex, and Antigravity. In addition, the Phaser repository on GitHub includes a comprehensive set of AI agent skills covering every major subsystem, enabling code agents to better understand Phaser 4 architecture. This allows agents to create games, structure scenes correctly, load assets, set up physics, and handle input using idiomatic Phaser 4 code.

For those looking for a more engine like experience, Phaser Studio Inc. offers the Phaser Editor. The editor provides a visual desktop environment with drag and drop functionality, integration with VS Code, and MCP support for AI tools. It is available for Windows, macOS, and Linux through a subscription model. The Phaser framework itself remains completely free under the open source MIT License, with no limitations.

For more information, visit the official Phaser website.

Blips Game Music Packs

Note: You're leaving the Blips Blog. The visited links may be subject to different privacy and cookie policies.