# goodboydigital/pixi.js

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/goodboydigital-pixi-js).**

47,430 stars · 5,031 forks · TypeScript · MIT

## Links

- GitHub: https://github.com/GoodBoyDigital/pixi.js
- Homepage: http://pixijs.com
- awesome-repositories: https://awesome-repositories.com/repository/goodboydigital-pixi-js.md

## Description

Pixi.js is a high-performance 2D graphics engine used to render interactive animations, sprites, and visual effects in web browsers. It functions as a WebGL 2D rendering engine and HTML5 graphics library designed to produce high-performance two-dimensional visuals.

The project operates as a 2D sprite framework and a web-based visual effects engine, providing tools to apply filters, blend modes, and masks to real-time graphics. It also serves as an interactive web canvas API for handling multi-touch and mouse input to build responsive graphical user interfaces.

The framework covers a broad set of capabilities, including asset management for external media, the rendering of text and geometric shapes, and dynamic texture management. It also provides systems for processing visual effects and handling user input.

## Tags

### Graphics & Multimedia

- [Hardware-Accelerated Rendering](https://awesome-repositories.com/f/graphics-multimedia/graphics-engines-rendering/rendering/engines/graphics-pipeline-architectures/hardware-accelerated-rendering.md) — Uses GPU-accelerated rendering to deliver high-performance 2D graphics by bypassing standard DOM elements.
- [2D Rendering Engines](https://awesome-repositories.com/f/graphics-multimedia/graphics-engines-rendering/webgl-gpu-rendering/2d-rendering-engines.md) — Functions as a high-performance engine for rendering interactive 2D graphics and animations using WebGL and HTML5 Canvas.
- [Custom Shader Programs](https://awesome-repositories.com/f/graphics-multimedia/graphics-engines-rendering/materials-shading/custom-shader-programs.md) — Supports custom GLSL shader programs to implement real-time filters and advanced blending modes.
- [WebGL & GPU Rendering](https://awesome-repositories.com/f/graphics-multimedia/graphics-engines-rendering/webgl-gpu-rendering.md) — Provides a high-performance system for executing WebGL commands to render 2D graphics and animations.
- [User Interaction](https://awesome-repositories.com/f/graphics-multimedia/immersive-interactive-systems/user-interaction.md) — Processes mouse and multi-touch input events to create interactive and responsive graphical user interfaces. ([source](https://github.com/goodboydigital/pixi.js#readme))
- [Visual Effects](https://awesome-repositories.com/f/graphics-multimedia/media-production-suites/visual-effects.md) — Provides tools for applying masks, filters, and blend modes to create complex visual styles. ([source](https://github.com/goodboydigital/pixi.js#readme))
- [Visual Filter Pipelines](https://awesome-repositories.com/f/graphics-multimedia/media-production-suites/visual-effects/visual-filter-animators/visual-filter-pipelines.md) — Implements real-time visual filter pipelines for adjusting properties like brightness, contrast, and blending.
- [Draw Call Sorters](https://awesome-repositories.com/f/graphics-multimedia/graphics-and-media/shape-drawing/draw-call-sorters.md) — Groups similar geometry and textures to optimize rendering and minimize GPU draw calls.
- [Canvas APIs](https://awesome-repositories.com/f/graphics-multimedia/graphics-engines-rendering/canvas-apis.md) — Provides an API for programmatic 2D and 3D rendering within the browser's canvas.
- [Dynamic Texture](https://awesome-repositories.com/f/graphics-multimedia/graphics-engines-rendering/rendering/dynamic-texture.md) — Provides techniques for updating texture arrays in real-time during the render loop. ([source](https://github.com/goodboydigital/pixi.js#readme))
- [Shape Rendering](https://awesome-repositories.com/f/graphics-multimedia/graphics-engines-rendering/shape-rendering.md) — Draws flexible text, geometric primitives, and complex paths to build detailed visual layouts. ([source](https://github.com/goodboydigital/pixi.js#readme))

### Game Development

- [Scene Graphs](https://awesome-repositories.com/f/game-development/engine-architecture/scene-graphs.md) — Implements a parent-child tree structure to manage spatial transformations and visibility for all visual elements.
- [2D Game Frameworks](https://awesome-repositories.com/f/game-development/game-engines-frameworks/2d-engines/2d-game-frameworks.md) — Provides a comprehensive framework for building 2D browser games with hardware-accelerated graphics and real-time loops.
- [2D Graphics Frameworks](https://awesome-repositories.com/f/game-development/game-engines-frameworks/2d-engines/2d-graphics-frameworks.md) — Ships a framework for rendering sprites, shapes, and text using hardware-accelerated 2D primitives. ([source](https://github.com/goodboydigital/pixi.js#readme))
- [2D](https://awesome-repositories.com/f/game-development/game-engines-frameworks/game-engines/2d.md) — Optimized for the development of 2D interactive experiences using sprite-based rendering.
- [Texture Optimization Tools](https://awesome-repositories.com/f/game-development/tooling-asset-pipeline/texture-optimization-tools.md) — Includes utilities for packing multiple small images into texture atlases to reduce GPU state changes.

### User Interface & Experience

- [Interactive Graphics](https://awesome-repositories.com/f/user-interface-experience/interactive-graphics.md) — Enables the creation of responsive interfaces that support direct manipulation of visual objects via mouse and touch.
- [Interactive Graphics Libraries](https://awesome-repositories.com/f/user-interface-experience/interactive-graphics-libraries.md) — Functions as a comprehensive library for creating interactive and high-performance visual interfaces in the browser.
- [Real-Time Visual Effect Processors](https://awesome-repositories.com/f/user-interface-experience/visual-customization-tools/real-time-visual-effect-processors.md) — Provides a comprehensive toolset for real-time GPU-accelerated filters, blend modes, and masks for browser graphics.

### Web Development

- [Browser-Based Charting Libraries](https://awesome-repositories.com/f/web-development/browser-based-charting-libraries.md) — Renders large sets of geometric shapes and text to create interactive, browser-based data visualizations.
- [Fallback Mechanisms](https://awesome-repositories.com/f/web-development/performance-optimizations/hardware-accelerated-webgl-execution/fallback-mechanisms.md) — Provides automatic switching between WebGL and HTML5 Canvas to ensure compatibility across different browser environments.
- [Asset Loading and Resolution](https://awesome-repositories.com/f/web-development/web-infrastructure-deployment/asset-management-build-tools/asset-loading-resolution.md) — Handles the runtime retrieval and format loading of images and sounds required for rendering. ([source](https://github.com/goodboydigital/pixi.js#readme))

### Part of an Awesome List

- [Game Engines and Frameworks](https://awesome-repositories.com/f/awesome-lists/devtools/game-engines-and-frameworks.md) — Fast 2D rendering engine for the web.