Particle System

Rare Earth Juejin Tech Community

Mar 31, 2025 · Frontend Development

Advanced Three.js Hero Section with Shaders, Particles, Lighting, and UI

This tutorial walks through building an advanced hero section using Three.js, covering prerequisites, loading and animating a robot model, configuring lighting, creating particle effects, adding UI elements, applying a radial gradient background, implementing parallax interaction, and rendering flowing lines for a polished WebGL experience.

Frontend DevelopmentParticle SystemShader

0 likes · 21 min read

Advanced Three.js Hero Section with Shaders, Particles, Lighting, and UI

Rare Earth Juejin Tech Community

Nov 27, 2024 · Artificial Intelligence

AI‑Driven 3D Firefly Animation with Three.js and Simplex Noise

This article demonstrates how to combine AI algorithms, specifically Simplex Noise, with Three.js to create a dynamic 3D firefly animation, covering project setup, particle system creation, bloom post‑processing, AI‑driven motion, scene optimization, and provides complete runnable code.

AIFrontendParticle System

0 likes · 16 min read

AI‑Driven 3D Firefly Animation with Three.js and Simplex Noise

Python Programming Learning Circle

Oct 25, 2024 · Game Development

Creating a Colorful Fireworks Effect with Python and Pygame

This tutorial walks through building a dazzling fireworks animation in Python using the Pygame library, covering environment setup, installing dependencies via domestic mirrors, defining particle and firework classes, and implementing the main game loop with full source code examples.

GraphicsParticle SystemPygame

0 likes · 8 min read

Creating a Colorful Fireworks Effect with Python and Pygame

Sohu Tech Products

Aug 28, 2024 · Mobile Development

Implementing Firework Like Animation Effect in Android Apps

The article walks through creating a firework‑style animation for Android like buttons by building a custom ParticleDrawingView that renders launch particles and exploding spark groups on a Canvas, using ValueAnimator with configurable durations and interpolators to control four animation phases and particle properties such as position, velocity, alpha, and rotation.

AndroidCanvasInterpolator

0 likes · 10 min read

Implementing Firework Like Animation Effect in Android Apps

NetEase Cloud Music Tech Team

Jul 1, 2024 · Frontend Development

Design and Implementation of Front‑End Animations for NetEase Cloud Music 2023 Annual Listening Report

The 2023 NetEase Cloud Music Annual Listening Report showcases a front‑end animation pipeline where the motion designer codes directly in React, using CSSTransition for page fades, CSS keyframes for text and particle effects, SVG masks for data visualisation, 3D perspective tricks, and extensive device testing to balance visual richness with performance.

3DFront-endParticle System

0 likes · 37 min read

Design and Implementation of Front‑End Animations for NetEase Cloud Music 2023 Annual Listening Report

Rare Earth Juejin Tech Community

May 2, 2024 · Frontend Development

Creating a Pepyaka Shader Effect with Three.js: Sphere, Noise, Particle System, and Text Overlay

This tutorial walks through reproducing the Pepyaka shader effect using Three.js, covering the creation of a central sphere, vertex displacement with GLSL noise, color mapping, spherical particle systems, background firefly particles, animated text, and optional top‑light effects, all with complete source code.

GraphicsJavaScriptParticle System

0 likes · 23 min read

Creating a Pepyaka Shader Effect with Three.js: Sphere, Noise, Particle System, and Text Overlay

Rare Earth Juejin Tech Community

Dec 3, 2023 · Frontend Development

Implementing a Particle Effect with GPGPU in three.js

This article explains how to recreate a complex particle animation using three.js by leveraging GPGPU techniques, custom shaders, and compute shaders to efficiently simulate and render hundreds of thousands of particles in real time.

GPGPUJavaScriptParticle System

0 likes · 10 min read

Implementing a Particle Effect with GPGPU in three.js

ByteFE

Jul 19, 2023 · Frontend Development

Using WebAssembly to Optimize Particle System Performance in Game Engine

This article explores how WebAssembly can be used to optimize the performance of particle system calculations in a game engine, reducing CPU load and improving frame rates by offloading computations to WebAssembly modules.

JavaScriptParticle SystemWebAssembly

0 likes · 14 min read

Using WebAssembly to Optimize Particle System Performance in Game Engine