Scene Inspector for PixiJS

Inspect and edit the scene graph and textures of PixiJS applications — v6, v7 and v8.

Scene Inspector adds a tab to Chrome DevTools for inspecting and debugging PixiJS (Pixi) applications. Open it on a page that runs a PixiJS application and you get the scene as the renderer sees it — the tree, the textures behind it, and what a frame costs. Works with PixiJS v6, v7, and v8. SCENE • The scene graph as a tree, with the same names and hierarchy defined by the application. • Click a node to edit it: position, scale, rotation, alpha, tint, blend mode, visibility, and other properties supported by its type. Changes land in the running application immediately. • Pick a node by clicking the canvas, and see the full stack of what is under the cursor rather than only the topmost hit. • A highlight drawn over the canvas follows the selection, with transform controls for dragging, scaling, and rotating a node in place. • Dedicated sections for Text and Spine — styles, tracks, skins, animations, and a scrub that works while the application is paused. • Bookmark a node to find it again after a reload. ASSETS • Every texture the renderer holds: dimensions, GPU format, memory, and a preview. • Atlas frames, listed and previewed one by one. • For any texture, which nodes in the scene are drawing it. STATS • Frame time, render time, and the worst frame in the window, live. • Draw calls, texture counts, GPU memory, and node counts. • An optional recording behind the charts, for looking at a spike after it has passed. THE PANEL • English and Ukrainian. • Light and dark themes, an accent colour, and keyboard shortcuts you can rebind. • A help page ships with the extension — open it from the ? button in the panel's bar. No internet connection needed to read it. PRIVACY The extension collects nothing, sends nothing, and has no servers. It declares no Chrome permissions. Everything it reads stays in your browser, and the settings it remembers stay on your machine. The full policy is in the repository.