react-pixi - Create/control a Pixi.js canvas using React

•    Javascript

---

This library works with React 15. If you are using React 16, look at react-pixi-fiber or a different library also called react-pixi. Create/control a Pixi.js canvas using React.

react reactjs pixi pixijs webgl canvas

pixi

•    Javascript

---

The aim of this project is to provide a fast lightweight 2D library that works across all devices. The PixiJS renderer allows everyone to enjoy the power of hardware acceleration without prior knowledge of WebGL. Also, it's fast. Really fast. PixiJS is a rendering library that will allow you to create rich, interactive graphics, cross platform applications, and games without having to dive into the WebGL API or deal with browser and device compatibility.

canvas2d pixijs webgl glsl canvas rendering pixi game renderer rendering-engine rendering-2d-graphics

pixi-filters - A collection of filters for pixi.js v4

•    Javascript

---

Click here to interactively play with filters to see how they work. All filters work with PixiJS v4.

phenomenon - ⚡️ A fast 2kB low-level WebGL API.

•    Javascript

---

Phenomenon is a very small, low-level WebGL library that provides the essentials to deliver a high performance experience. Its core functionality is built around the idea of moving millions of particles around using the power of the GPU. Returns an instance of Phenomenon.

webgl particles shaders gpu rendering low-level

phaser-examples - Contains hundreds of source code examples and related media for the Phaser HTML5 Game Framework

•    Javascript

---

Looking for Phaser 3 Examples? They are in their own repo. Phaser v2 is a fast, free and fun open source HTML5 game framework. It uses Pixi.js for WebGL and Canvas rendering across desktop and mobile web browsers. Games can be compiled to iOS and Android apps via 3rd party tools.

phaser html5-game canvas webgl particles physics html5 game 2d web-audio tweens typescript

WebGL-GPU-Particles - 1 million+ particles being moved around on the GPU via WebGL

•    Javascript

---

Treat this as a first teaser of a GPU particle effects / physics library that I'm working on and will open source soon.

ParticleEffectsButtons - A little library that can be used for bursting particles effects on buttons and other elements

•    Javascript

---

Bursting particles effects for buttons. By Luis Manuel. The Particles library depends on anime.js to perform animations, so you need to include it before Particles.

animejs animation particles javascript-library button

particles.js - A lightweight JavaScript library for creating particles

•    Javascript

---

A lightweight JavaScript library for creating particles

particles particle canvas

vue-particles - Vue.js component for particles backgrounds ✨

•    Javascript

---

Vue.js component for particles backgrounds ✨

vuejs2 vuejs vue-components vue-particles particles-backgrounds vue-component vue vue2 vue.js particles.js particles

react-three - React bindings to create and control a 3D scene using three.js

•    Javascript

---

Create/control a three.js canvas using React. To use React for drawing 2D using WebGL, try react-pixi.

react reactjs threejs webgl canvas

ShaderParticleEngine - A GLSL-heavy particle engine for THREE

•    Javascript

---

The purpose of this library is to make creating particle effects using THREE.js and WebGL as simple as possible. The heavy-lifting is done by the GPU, freeing up CPU cycles. Emitters are created by first creating an instance of SPE.Group. It is in the group where ShaderMaterial settings are applied, and the texture for all emitters added to that group is set. Multiple groups can be created, but if efficiency is a high-priority then as few groups as possible should be created. The group takes care of uploading emitter data to the GPU for simulation and rendering, so the fewer chunks of data that get sent the better.

three.js webgl particle particles glsl shader spe

particulate-js - Particle physics micro library.

•    Javascript

---

Particulate.js is a JavaScript particle physics micro library designed to be simple, extensible, fast, and stable; it is capable of running a simulation with tens of thousands of particles and tens of thousands of constraints in real time. The core system is derived from that described in Advanced Character Physics by Thomas Jakobsen. The library provides an interface for defining a particle system with many inter-particle constraints and globally acting forces. Internal management of particle positions and state is designed to be easily integrated with a WebGL rendering pipeline, although no specific rendering scheme is required.

physics microlib particle-physics particle 3d

Pixi Network Server

•    

---

Pixi Server is a network server used to build MMOGs, FPS and other multiplayer game and simulation applications. Built using C# and .NET 4, it can easily be integrated into any .NET application. The engine features TCP and reliable UDP using the Lidgren network library.

vizceral - WebGL visualization for displaying animated traffic graphs

•    Javascript

---

Intuitive animated traffic graph visualization using webgl. If a graph of nodes and edges with data about traffic volume is provided, it will render a traffic graph animating the connection volume between nodes.

graph traffic visualization webgl monitoring particles flow intuition visceral

encom-globe - 🌎 WebGL globe based on the boardroom scene from Tron: Legacy

•    Javascript

---

The Encom Globe is a WebGL-based clone of the globe from the boardroom scene in Tron: Legacy. If you don't recall that scene, check out Bradley Munkowitz's excellent writeup about its production for more information. This version attempts to stay as true to the in-movie original as possible while maintaining a high frame rate on low powered machines and devices. It is getting pretty close to acheiving that goal and mimics most of the details seen on screen, including the loading animations for the globe hexagon particles, the satellites, and the markers.

webgl tron globe threejs

detect-gpu - Classifies GPUs based on their 3D rendering benchmark score allowing the developer to provide sensible default settings for graphically intensive applications

•    TypeScript

---

Classifies GPUs based on their 3D rendering benchmark score allowing the developer to provide sensible default settings for graphically intensive applications. Think of it like a user-agent detection for the GPU but more powerful. By default we use the UNPKG CDN to host the benchmark data. If you would like to serve the benchmark data yourself download the required benchmarking data from benchmarks.tar.gz and serve it from a public directory.

webgl threejs demo device browser hardware gpu detection benchmarks pixijs babylonjs adaptive progressive-enhancement webgl2 detect three.js three babylon 3d typescript

ParticlesLoadingView - A customizable SpriteKit particles animation on the border of a view.

•    Swift

---

With ParticlesLoadingView you can create your own amazing SpriteKit particles animations with the Xcode's built-in Particle Emitter Editor that looks like the following picture. Go ahead and create your own particles animation by doing File ➡️ New File ➡️ iOS Resource ➡️ SpriteKit Particle File. To see it in action, run the example project, clone the repo, and run pod install from the Example directory first. The example project shows how to set up ParticlesLoadingView in a few different ways.

animation spritekit ios particle-emitter-editor particles-animations

fieldplay - A vector field explorer

•    Javascript

---

Vector fields explorer. Made with WebGL, love and passion. more examples...

webgl vector-field particles glsl gpu

cloak - A network layer for HTML5 games using Node.js

•    Javascript

---

A cross-platform puzzle game. The goal is to compete against the anti-muon particles that seek to gain control of the energy fields by making triangles. The first muon particles to control an energy field wins. Bocoup is a software company that is dedicated to moving the Open Web forward. We do all kinds of awesome stuff, including making games.

qiciengine - A free JavaScript game engine library with a web-based comprehensive suite of toolset for making HTML5 games

•    

---

QICI Engine is a free and open source JavaScript game engine library with a web-based comprehensive suite of toolset for making HTML5 games. QICI Engine is based on the free and open source HTML5 game framework Phaser, which uses Pixi.js for WebGL and Canvas rendering across desktop and mobile web browsers.