Use case

Sprite animation for PixiJS games

The GreatSprites runtime is a small module for PixiJS v8. Each animation is a display object you add to the stage, play by name and listen to, with the device's GPU-compressed texture format picked for you.

import { GreatSprites } from './greatsprites/runtime.js';

const gs = await GreatSprites.init(app);          // picks the device's format
const coin = await gs.object('./sprites/object-1/', { height: 120 });
coin.position.set(400, 300);
app.stage.addChild(coin);

coin.on('land', () => sound.play('clink'));
await coin.play('spin');                          // resolves back on the still

What the runtime does for you

• Picks the size by how large the sprite is drawn, so a small object on a big desktop screen does not load a full-screen version.
• Shares one element between copies: fifteen coins on screen draw from one set of pages (measured: 15 more copies fetched nothing new).
• Recovers from a lost GPU context without a reload.
• Never hangs your sequence: every play resolves, also when the element is destroyed mid-clip.

Requirements

• PixiJS v8 with the WebGL renderer.
• A GPU-compressed texture format, which practically every phone and desktop browser has. On a device without one, the still picture is shown and nothing breaks.

More: Getting started and Memory and loading.