v4-new-features

Document Phaser 4 WebGL rendering migration and new game object implementation.

Updated Mar 13, 2026
One-click install
npx skills add https://github.com/Dominik-Steinweg/Fragdachse --skill v4-new-features-dominik-steinweg
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: v4-new-features
Source: https://github.com/Dominik-Steinweg/Fragdachse/tree/main/.agents/skills/v4-new-features
Command: npx skills add https://github.com/Dominik-Steinweg/Fragdachse --skill v4-new-features-dominik-steinweg

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill addresses the complexity of transitioning to the Phaser 4 engine by providing a centralized guide to its overhauled WebGL rendering architecture, new game objects, and updated component systems.

Core Features & Use Cases

  • Rendering Architecture: Understand the shift from Pipelines to the RenderNode graph for centralized WebGL state management.
  • New Game Objects: Learn to implement high-performance features like CaptureFrame, Gradient, Noise, SpriteGPULayer, and TilemapGPULayer.
  • Component Integration: Utilize the new Lighting, RenderSteps, and RenderNodes components to optimize game object behavior and visual effects.

Quick Start

Use the v4-new-features skill to explain how to implement a SpriteGPULayer for rendering large numbers of sprites efficiently.

Frequently Asked Questions about v4-new-features

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate my rendering pipeline from Phaser 3 to Phaser 4?

Migrating from Phaser 3 to Phaser 4 involves shifting from Pipelines to the new RenderNode graph for centralized WebGL state management. This skill details API changes, updated component systems, and new shader-based features to facilitate the transition.

What is a RenderNode in Phaser 4 and how does it work?

A RenderNode in Phaser 4 is part of the new WebGL rendering architecture that replaces the old Pipeline system. It provides centralized state management through a graph structure, integrating with new Lighting and RenderSteps components to optimize game object behavior and visual effects.

How do I render large numbers of sprites efficiently in Phaser 4?

To render large numbers of sprites efficiently in Phaser 4, implement the new SpriteGPULayer game object. This high-performance feature is designed specifically for optimized rendering workflows within the updated WebGL engine architecture.

Does Phaser 4 support custom game objects and rendering components?

Yes, Phaser 4 supports custom game objects through the new RenderNode graph and updated component systems. You can utilize the new Lighting, RenderSteps, and RenderNodes components to implement custom game objects and optimize their visual effects.

What new game objects are available in Phaser 4?

Phaser 4 introduces several new game objects including CaptureFrame, Gradient, Noise, SpriteGPULayer, and TilemapGPULayer. These objects leverage the overhauled WebGL rendering architecture for high-performance features and optimized rendering techniques.

When should I use the new TilemapGPULayer instead of standard tilemaps in Phaser?

You should use the TilemapGPULayer in Phaser 4 when you need performance-optimized rendering for tilemaps within the new WebGL engine. It leverages the updated component-based rendering workflows and RenderNode graph for better visual effects management.