$ show Alchemist0823/three.quarks
three.quarks is a monorepo particle effect library for three.js, offering CPU-based particle simulation with a rich set of behaviors (color, size, rotation, force, noise, sub-emitters, etc.), emitter shapes (point, sphere, cone, hemisphere, donut, grid, rectangle, mesh surface), and batched rendering via a central BatchedRenderer. It includes a framework-agnostic core (quarks.core) with standalone math utilities, value generators, and a plugin system. The library integrates with React Three Fiber through quarks.r3f, providing declarative components and hooks (useParticleSystem, useQuarksEffect) that support Suspense and effect caching. An experimental node-graph VFX system (quarks.nodes) allows defining particle behavior visually or programmatically, with both CPU interpreter and WebGPU compute compiler for GPU-based simulation. The repository includes extensive demos, a playground for drag-and-drop JSON effects, and a visual editor at quarks.art. It is production-ready, with CI/CD, high test coverage thresholds, and serialization via QuarksLoader/QuarksPrefab compatible with Three.js ObjectLoader.
The LLM identified 6 files worth highlighting for reuse:
Defines ValueGenerator and FunctionValueGenerator interfaces with startGen/genValue lifecycle and per-particle memory (GeneratorMemory). This pattern is used by all parameter generators (ConstantValue, IntervalValue, PiecewiseBezier, Gradient, etc.) and can be extracted for any system needing random or procedural value generation with initialisation and update phases.
Defines the EmitterShape interface with getParticlePosition/Direction methods. Concrete implementations (PointEmitter, SphereEmitter, ConeEmitter, DonutEmitter, etc.) follow a clean strategy pattern. Could be reused in any particle or spawn system requiring spatial emission distributions.
Abstract base class for particle behaviors with initialize/update/updateParticle/frameUpdate hooks and a static behavior type map. Demonstrates a clean extensibility pattern; custom behaviors can be registered via loadPlugin. The lifecycle methods are well-defined for composable per-frame updates.
Base compiler class for node-graph VFX. Subclasses (WebGPUCompiler, Interpreter) implement target-specific compilation, enabling CPU or GPU execution from the same graph definition. The pattern separates graph traversal from code generation, making it reusable for any visual programming DSL targeting multiple backends.
Central renderer that groups VFXBatch instances by material/pipeline and updates them each frame. Manages batch lifecycle (add/remove/update/render) and supports device pixel ratio scaling. The batching pattern is generic for any instanced rendering system and could be extracted for other three.js batch effects.
React hook that converts component props to ParticleSystemParameters, creates a BatchedRenderer effect, registers it with a React context, and handles cleanup on unmount. Demonstrates a robust pattern for integrating imperative 3D libraries with React's declarative model, including support for effect reuse and suspension.