PixiJS Update - v8.13.0
This release delivers several new features, performance improvements, and over 20 bug fixes to keep PixiJS running smoothly.
Let's take a look at what's changed in this release and look ahead to what's coming next, with some exciting announcements to share!
What's New in v8.13.0โ
Some highlights from this release include:
-
SVG Fill Rule Support - The engine can now render SVG subpath fill rules, improving compatibility with vector assets (thanks @creativoma).
-
Text Caching - Text texture caching (temporarily removed in 8.10.0) is back. Now, textures are shared only when Text objects use the same
TextStyle
instance (not just equivalent settings). This makes caching more stable, less error-prone, and can significantly boost performance when rendering many same-styled text elements.const textStyle = new TextStyle({ fontSize: 24, fontFamily: 'Verdana', fill: 0xffffff });
const COUNT = 25000;
for (let i = 0; i < COUNT; i++) {
const bunny = new Text({ text: 'hello', style: textStyle });
bunny.x = (i % 100) * 105;
bunny.y = Math.floor(i / 100) * 25;
container.addChild(bunny);
} -
LRU Cache for Text Measuring - Repeated strings now reuse prior measurements via an LRU (Least Recently Used) cache, reducing redundant work and improving performance.
-
Deprecation Message Controls - You can now suppress deprecation warnings or remove their color formatting for environments that don't support it (thanks @mayakwd).
import { deprecation } from 'pixi.js';
deprecation.quiet = true; // Suppresses warnings
deprecation.noColor = true; // Removes color formatting -
20+ Bug Fixes - Improvements across text, rendering, interaction and more. A big thank you to everyone who contributed fixes and reported issues!
You can see the full release notes on GitHub.
What's Next for PixiJSโ
Next up, we're excited to share some of the bigger initiatives we're working on for future releases.
gl2D File Formatโ
We're currently working on a new open format for 2D scenes called gl2D.
gl2D is a JSON-based scene description format, inspired by glTF but designed specifically for 2D rendering. It provides a structured way to describe:
- Scenes - collections of nodes (e.g. menus, gameplay, credits).
- Nodes - containers, sprites, text, etc.
- Resources - textures, spritesheets, videos, fonts, gradients, etc.
Why gl2D?โ
Right now, there's no standard way to describe a 2D scene. Every engine or tool uses its own format, which means assets and layouts can't be shared easily. This fragmentation leads to duplicated work, manual conversions, and limited interoperability.
gl2D is designed to address this by:
- Providing a common foundation - so 2D scenes can be shared across tools and engines.
- Reducing duplication - developers and designers won't need to rebuild the same scene in multiple tools.
- Efficient resource management - resources like textures, fonts, or gradients are defined once and can be reused across multiple nodes, keeping files smaller and making rendering more efficient.
- Web-first design - gl2D is designed with interoperability in mind, so it can work not only with PixiJS but also with engines like Phaser and others in the ecosystem.
- Enabling new workflows - exporting from design tools or building editors on top of Pixi becomes much simpler.
Exampleโ
{
"asset": {
"version": "1.0",
"generator": "PixiJS"
},
"scene": 0,
"scenes": [
{
"name": "MainScene",
"nodes": [0]
}
],
"nodes": [
{
"type": "container",
"name": "Root",
"children": [1],
"translation": [100, 100]
},
{
"type": "sprite",
"name": "Hero",
"texture": 0,
"translation": [50, 0]
}
],
"resources": [
{ "type": "texture", "source": 0 },
{ "type": "image_source", "uri": "/textures/hero.png" }
],
"extensionsUsed": []
}
Figma Plugin Integrationโ
Alongside gl2D, we're building a Figma plugin that will let you sync designs directly into PixiJS.
This means:
- No more manually recreating layouts from design files.
- Scenes created in Figma can be exported as gl2D and loaded into PixiJS with minimal setup.
- Scenes can be created as fully responsive layouts that adapt to different screen sizes by using Figma's auto-layout features and PixiJS Layout.
- Designers and developers can work in parallel, changes made in Figma can flow into your PixiJS project without extra steps.
Our aim is to make the handoff between design and implementation seamless, so teams can focus more on iteration and less on translation.
Get the Latest PixiJSโ
Install via npm:
npm install pixi.js@8.13.0
Or use via CDN:
Development builds:
- https://cdn.jsdelivr.net/npm/pixi.js@8.13.0/dist/pixi.js
- https://cdn.jsdelivr.net/npm/pixi.js@8.13.0/dist/pixi.mjs
Production builds:
- https://cdn.jsdelivr.net/npm/pixi.js@8.13.0/dist/pixi.min.js
- https://cdn.jsdelivr.net/npm/pixi.js@8.13.0/dist/pixi.min.mjs
Documentation: https://pixijs.download/v8.13.0/docs/index.html
Wrapping Upโ
That wraps up our August update. If you're interested in contributing, we're always looking for help on open issues.
Thanks again to everyone who contributed to this release! We can't wait to see what you create with PixiJS.
- See the full release notes on GitHub
- Sponsor PixiJS on GitHub
- Submit your project to the Showcase
- Join the discussion on Discord
- Follow us on Twitter / Bluesky
Happy creating!
The PixiJS Team