loading-assets

Queue and cache Phaser 4 assets during preload with progress events.

Updated Apr 16, 2026
One-click install
npx skills add https://github.com/GiantCroissant-Lunar/proto-breakout --skill loading-assets-giantcroissant-lunar
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: loading-assets
Source: https://github.com/GiantCroissant-Lunar/proto-breakout/tree/main/.agent/skills/01-phaser/loading-assets
Command: npx skills add https://github.com/GiantCroissant-Lunar/proto-breakout --skill loading-assets-giantcroissant-lunar

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Loading and managing a wide variety of assets in Phaser 4 (images, spritesheets, atlases, audio, JSON, tilemaps, bitmap fonts) can be error-prone and slow without a standardized preload workflow. This skill provides a structured approach to queue, load, and cache assets, ensuring everything is ready when a scene starts.

Core Features & Use Cases

  • Use the Phaser Loader to queue assets in preload(), letting the Loader fetch files in parallel and cache them for cross-scene access.
  • Supports images, spritesheets, atlases, audio, JSON, tilemaps, and fonts, with progress events to drive loading screens and user feedback.
  • Real-world use: in a game scene, preload the logo, background, character sprites, level data, and audio, then start the scene once all assets are available.

Quick Start

Preload all required assets in your Scene's preload() method to guarantee they are ready when create() runs.

Frequently Asked Questions about loading-assets

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

FAQPage Schema
How do I preload spritesheets and tilemaps in Phaser 4?

To preload spritesheets and tilemaps in Phaser 4, queue the files in your scene's preload() method using the LoaderPlugin API. The loader fetches files in parallel, caches them globally, and ensures assets are ready when the scene starts.

What is the best way to track asset loading progress for a loading screen in Phaser?

Tracking asset loading progress in Phaser involves listening to progress and complete events emitted by the LoaderPlugin API during the preload phase. You can drive loading screens and user feedback by capturing these events as images, audio, and JSON files download.

Can I share loaded images and audio across multiple scenes in Phaser 4?

Yes, you can share loaded images and audio across multiple scenes in Phaser 4. When assets are fetched during preload, the loader stores them in global caches, enabling cross-scene access without reloading the same files.

Does the Phaser 4 loader support audio, JSON, and bitmap fonts?

Yes, the Phaser 4 loader supports audio, JSON, and bitmap fonts. You can queue a wide variety of assets including images, spritesheets, atlases, and tilemaps in the preload method for parallel fetching and caching.

Why are my Phaser game assets not ready when the create method runs?

Phaser game assets are not ready when the create method runs if they were not properly queued in the preload method. You must use the LoaderPlugin API in preload to fetch files in parallel so they are cached and available before the scene starts.