DEV Community: DDW-X

you dared me to reverse ijewel3d yesterday, so i cloned it

DDW-X — Sat, 12 Sep 2026 18:29:09 +0000

yesterday someone challenged me to break down ijewel3d.com.

done. full 1:1 rebuild with working diamond shaders, refraction, and live configurator:

demo: https://ijewel3d.vercel.app

code: https://github.com/DDW-X/ijewel3d.com

everything is reverse-engineered and documented in the repo. inspect the pipeline, steal the shader logic, have fun.

What high-end WebGL/WebGPU sites should I reverse-engineer next?

DDW-X — Fri, 11 Sep 2026 15:39:39 +0000

Hey everyone,

Over the past few weeks, I’ve been tearing down complex production runtimes to document their graphics pipelines and write 1:1 functional clones.

I’ve already completed and documented deep dives for both Lusion (lusion.co) and Active Theory (activetheory.net)—covering their GPGPU fluid passes, zero-allocation render loops, and DOM projection layers. The full source code and technical documentation for both are already up and available. If there are any specific shaders, post-processing passes, or mechanics from either of those two sites that you want me to expand on or dissect further, just let me know and I'll add them to the writeups.

That said, I'm looking for the next challenging project to tackle.

What are some websites with insane WebGL, WebGPU, or shader engineering that you've always wanted to see reverse-engineered and broken down to the math and memory profiles?

Drop the URLs below and mention which specific effect caught your eye!

Deconstructing Lusion.co: How I Reverse-Engineered the Most Awarded WebGL Site on the Internet

DDW-X — Sun, 06 Sep 2026 23:31:09 +0000

If you have ever visited Lusion.co, you know it feels like magic. The fluid interactions, the flawless 120FPS performance, and the liquid glass aesthetics are an industry benchmark.

But how does it actually work under the hood?

As a systems architect and cybersecurity researcher (DDW-X), I don't like magic. I like source code, memory profiles, and mathematics. So, I spent the last few weeks decompiling their production bundles, instrumenting their V8 heap, and extracting their GLSL optical shaders to understand their exact architecture.

Here are the core engineering secrets driving Lusion:

The Liquid Glass Shader: It fuses Snell's Law vector refraction with wavelength-dependent Cauchy dispersion inside a single raw GLSL fragment kernel.

Eliminating Layout Thrashing: They completely decouple the DOM from the WebGL canvas using a closed-form arithmetic layout engine (ScrollDomRange), offloading CSS mutations directly to the GPU compositor thread.

Cinematic 6-Channel fBm: The organic camera movement isn't a simple sine wave; it uses 3 octaves of Fractal Brownian Motion across 6 degrees of freedom.

I didn't just write about it—I rebuilt it. You can explore the exact mathematical derivations and the functional clone below.

Live Interactive Clone: lusion-1to1.vercel.app

Deep-Dive Documentation: Read the full systems analysis here

Source Code: GitHub / DDW-X

Dive into the docs and let me know which subsystem blew your mind the most.

Decompiling activetheory.net: Zero-GC Memory Management & GPGPU Particle Systems

DDW-X — Sun, 06 Sep 2026 19:17:23 +0000

Architectural deep-dives of high-end WebGL engines rarely surface in production quality due to proprietary bundling and obfuscation. Over the past several months, I conducted an end-to-end systems deconstruction and 1:1 architectural reverse engineering of the runtime driving activetheory.net.

Instead of surface-level de-minification, this research focuses on the mechanics of zero-allocation memory footprints in V8, Eulerian Navier-Stokes particle advection, and offscreen floating-point GPGPU pipelines.

1. Eliminating the V8 Garbage Collector: Zero-GC Runtime

The primary bottleneck in sustained 120 FPS WebGL rendering is JavaScript Heap fragmentation and transient object allocation inside the frame loop. When minor Garbage Collection sweeps trigger, the browser thread drops frames.

Classic WebGL Loop:
Render Frame -> new Vector3() -> Nursery Allocation -> GC Minor Pause (3-8ms) -> Frame Drop

Active Theory Architecture:
Render Frame -> Static Scratchpad Pools (_v1, _v2) -> Mutate in-place -> Flat Heap Line (0 KB churn)

The runtime enforces a strict allocation invariant:

Pre-allocated Scratchpads: Scratch math structures (_v1, _m1) handle all coordinate spaces and matrix multiplications without ephemeral instantiations.
Monomorphic Shapes: Object structures are populated in fixed constructor orders, preventing V8 hidden class (Map) transitions and de-optimizations.
TypedArray Direct Transfer: Uniform buffers and attribute updates bypass JavaScript wrappers entirely, mapping contiguous memory straight to WebGL vertex attributes.

2. Antimatter: Offscreen GPGPU Particle Pipeline

Rather than computing particle physics on the CPU and uploading buffers per-frame, the engine employs the Antimatter GPGPU subsystem:

Triple-Buffered FBO Topology: Particles exist entirely as pixels in 32-bit floating-point textures (OES_texture_float).
Vertex-Fetch Physics: In the vertex shader pass, point primitives sample their world coordinates directly from the updated FBO render targets using texture2D(u_positionTexture, uv).
Zero CPU Overhead: The main thread's only role is binding ping-pong textures and submitting draw commands, decoupling physics overhead from CPU clock availability.

3. Real-Time Fluid Coupling: Eulerian Navier-Stokes

Pointer-driven particle interaction uses an offscreen Eulerian grid to simulate fluid currents:

Velocity Advection: Semi-Lagrangian back-tracing transports velocity across an FBO grid.
Impulse Injection: Pointer deltas are translated into localized directional splats injected directly into the velocity buffer.
Jacobi Pressure Projection: A 6-pass Jacobi relaxation solver computes the pressure Poisson equation, subtracting the gradient to enforce $\nabla \cdot \mathbf{u} = 0$ (incompressibility).
Advection Feedback: The resulting velocity vector field is sampled inside the Antimatter compute pass, dragging millions of particles along fluid streamlines.

Telemetry & Technical Documentation

The complete architectural teardown, including mathematical proofs, GLSL noise kernel deconstructions, and V8 heap flatline verification traces, has been documented in detail:

Source Repository: github.com/DDW-X/activetheory.net
Interactive Documentation Portal: ddw-x.github.io/activetheory.net
Academic Reference: Citation File Format v1.2.0 is established in the root repository.

Critique, engine profiling observations, and low-level graphics discussions are welcome in the comments.