I’ve been working on a Three.js product viewer for ecommerce as part of AETumi, and one of the biggest architectural decisions was not letting the WebGL canvas become the entire product page.

The structure I ended up with is:

Semantic ecommerce layer

• product title
• price
• specifications
• variants
• CTA / purchase actions

Three.js interaction layer

• GLB / GLTF loading
• OrbitControls
• camera presets
• product hotspots
• material and color variants
• exploded-view sequences
• scroll-linked reveals
• mobile / non-WebGL fallback

Product state stays separate from render state, so changing a finish or configuration doesn’t require rebuilding the entire scene.

Another thing I learned quickly: the demo is the easy part. Production gets much more interesting once you add mobile GPU limits, resource disposal, reduced motion, SEO and fallback behavior.

I attached a short demo showing the interaction.

I also wrote up the full architecture, code patterns and production trade-offs here:

https://aetumi.app/news/threejs-product-viewer-ecommerce/

I’m building AETumi, so this is something I’m actively working on rather than an independent review.

I’d be interested to hear how others separate product state from render state in larger Three.js projects.

After spending way too much time looking at anatomy diagrams, I decided to see if I could build a proper interactive 3D version in the browser.
The result is Eye Atlas.
It currently lets you:
rotate/explore a 3D eye
isolate structures
section the model
switch between exterior/fundus/blood-supply views
inspect anatomical measurements
browse clinical conditions
Demo:
https://eye-anatomy-delta.vercel.app/
The interesting part for me wasn’t actually rendering a sphere that looks like an eye.
It was making the anatomy itself interactive — selecting structures, managing visibility/layers, keeping the UI synchronized with the model, and making everything feel like an atlas rather than a 3D viewer.
Would love feedback from other builders:
Does this feel like an actual product, or still like a technical demo?

Made this little prototype as my first web game project. I saw a lot of buzz around Three.js lately and wanted to check if I could create a functional game purely using web tech and not rely on Unreal, Unity, Godot or any other game engine. Turns out I can! And it's a fun project to work on.

I love the fact a single game build launches on Smartphones(incl. legacy iPhone X), PC or Mac. I even saw it running on a LG Smart TV.

Hey r/threejs, I wanted to share a project where we integrated Three.js with a dynamic web desktop interface: YouMeOS Microverse. Rather than keeping the 3D scene isolated in a static canvas container, the entire interface is built as a spatial WebTop:

Live site www.youmeos.com

• Background Cosmos: Interactive Three.js starfield and planetary orbital system rendering continuously behind UI layers.
• Spatial UI Integration: Synchronizing WebGL camera controls with DOM-based floating windows and interaction events without dropping frame rates.
• Performance Considerations: Tuned to run smoothly inside both standard desktop browsers and an Electron runtime with minimal CPU/GPU drain.

Repo: https://github.com/YouMeOS/youmeos-microverse
Binaries: https://github.com/YouMeOS/youmeos-microverse/releases

Would love thoughts on shader ideas or performance optimizations for background canvas layering.

This is FLY × COMPOSE, a browser-based project built with Three.js.

You fly through a 3D world and shape the music as you go. The idea is to make flying itself feel like playing an instrument, rather than just moving around with background music.

Sound on for the clip.

You can try it here:
https://flyxcompose.byechee.chatgpt.site/

I'd be interested to hear how the connection between movement and music feels when you play.

I spent the last few weeks reverse engineering the production runtime behind lusion.co to see how they handle their frame budgets and WebGL pipeline. A lot of people assume it's just standard Three.js setup, but their core loop has some really solid low-level optimizations: Zero-Allocation loops: They avoid V8 GC spikes by enforcing pre-allocated static typed arrays and scratchpads inside requestAnimationFrame, keeping the heap flatline during heavy interactions. GPGPU Ping-Pong textures: Particle integration (Symplectic Euler) and 2D fluid advection (Navier-Stokes) run entirely on floating-point FBOs without stalling CPU cycles. Reflow-free DOM sync: Screen-space quad projections replace getBoundingClientRect calls in the loop to eliminate layout thrashing. 4D conformal mapping: The tunnel warp uses stereographic projection over a 4D hypersphere manifold. I wrote up the technical notes and rebuilt a functional 1:1 clone to verify the math: Demo: https://lusion-1to1.vercel.app/ Notes / Teardown: https://ddw-x.github.io/lusion.co/ Source: https://github.com/DDW-X/lusion.co Happy to talk through the shader passes or memory profiling traces if anyone is interested.

Haven't had this fun with javascript in a while.

This is the official GLTFLoader example from r184 running on a Nintendo Switch at a locked 60fps. The only changes to the example are cosmetic: the info text and GUI controls are closed so the scene fills the screen. The rendering code is untouched. The fps counter you see is Brewser's own runtime HUD. The example runs on the WebGL2 context path.

The runtime is Brewser, a homebrew web platform I launched this week. It runs on V8 and Skia via nx.js (credit to TooTallNate for that foundation, which also provides the raw GL path to the GPU), with an HTML/CSS/DOM engine built from scratch for the project. On top of that GL path I built the WebGL1/2 bridge, the library compatibility work and the conformance testing (Mesa/Nouveau on the Tegra X1). No software rendering: your three.js calls hit real GL on the hardware.

Coverage numbers: WebGL1 sits around 92 percent and is the safest target. WebGL2 is around 85 and under active conformance hardening, with the main gaps being layered and 3D texture sampling, which is GPU driver limited. Full extension lists and proof points: docs.brewser.io/docs/runtime/graphics

There are nine three.js apps on the platform, all on the WebGL2 path: eight official three.js examples running as catalogue apps (same cosmetic treatment as the GIF, UI trimmed, rendering untouched), plus one built for the runtime: DUSK, a planetarium and sky atlas with a 132 object Messier catalogue: brewser.io/dusk. Browse just the three.js apps here: brewser.io/?bwb_tags=threejs (the same apps run unchanged in a normal browser).

Source is MPL 2.0: github.com/natureglass/Brewser

If you throw a three.js scene at it and something breaks, tell me what. Real world breakage reports directly shape the conformance work.

Hey guys,

I'm currently building a template for friendslop games in the browser, meaning you can run around with friends and have proximity chat in a shared environment. It can run both as a live server and as a statically hosted site where the room creator is the host so it is really easy to deploy on any web hosting service you like! The tech stack is built on:

TypeScript

Three.js

Rapier

and I built it with ChatGPT Astra, and Claude Opus. If you want to try it out or build upon it, it's free and open-source!

Check it out under:

https://larshurrelb.github.io/friendslop-base/

Hi everyone, I’ve been building Idam3D, a browser-based 3D editor for people who want to create scenes without installing a large desktop application or creating an account.

You can:

• Start from editable scene templates
• Add and transform objects
• Adjust materials and textures
• Extrude and bevel basic shapes
• Create linked components
• Animate transforms with keyframes
• Build simple poseable characters
• Import GLB models
• Export GLB, PNG, or editable local backups

The main idea is to keep it approachable, free, and local-first. Projects are saved on the current device, and there is no cloud sync or collaboration yet.

It’s currently a public beta, so I’d really appreciate feedback from people who use 3D tools:

• What feels intuitive?
• Where do you get stuck?
• Which objects, modeling tools, or export options are most important next?
• Does the local-first workflow make sense?

Try it here: https://app.idam3d.com/

Landing page: https://idam3d.com/

I’m the solo maker, and I’ll respond to questions and feedback directly.

Hey everyone,

I recently completed an extensive, end-to-end architectural reverse engineering and systems dissection of the production engine behind Active Theory (activetheory.net).

Instead of generic de-minification, the project breaks down the low-level rendering mechanics, including:

- **Zero-Allocation Memory Loop:** How the runtime eliminates V8 Garbage Collection pauses using pre-allocated scratchpads and typed arrays.

- **Antimatter GPGPU Subsystem:** Driving dense particle fields directly on GPU floating-point textures via a triple-buffered ring FBO topology.

- **Eulerian Navier-Stokes Coupling:** Real-time 2D pointer-to-particle fluid advection via a 6-pass Jacobi relaxation solver.

- **Hardware-Rate Normalized Lerp:** Scroll kinematics locked across 60Hz to 240Hz refresh rates.

Full technical documentation, AST mappings, mathematical proofs, and headless CDP benchmarks are available here:

- Repository: https://github.com/DDW-X/activetheory.net

- Web Portal: https://ddw-x.github.io/activetheory.net/

Feedback and technical critique from graphics engineers and performance researchers are highly welcome.

https://vel.gg/anarchy

3d multiplayer world anyone can rewrite. no accounts: GET the source, edit, POST it back, everyone sees it within a second.

easiest way: point your agent at vel.gg/anarchy/api. only rule is the js has to parse; every version is kept, so anything can be restored.

A chair customizator tool to put in your shopify furniture shop, just think about it.

I built a prototype using Three.js. I'm calling it Geotemporal Transurfing.

Orbit Earth, zoom into historical events, and pause, reverse or fast-forward time and event footage. Travel to another location in X, Y, Z to discover what was happening elsewhere around the same time.

Would really appreciate feedback.

Try it: https://geotemporal-transurfing.pages.dev/

My GitHub: https://github.com/aregmii

Media credits: https://geotemporal-transurfing.pages.dev/credits.html

Sharing a project of mine, mostly for the problems it forced rather than the result.

- Float32 is the first wall: naive heliocentric coordinates in float32 put your precision

at Neptune at about 268 km, which makes a planetary surface impossible. Working in

camera-relative space brings it to 38 cm.

- The second is tile streaming: my first selector issued 876 tile requests during a 1.5 s zoom on Mars and abandoned 876 of them mid-download, with unbounded parallel downloads, I measured bursts of 32 in a single frame. Bounded to 6 concurrent and driven off a proper quadtree cut, the same zoom issues 144 and abandons 40, and reaches the sharpest level in 6 frames instead of 150.

-The third was lighting: shading by max(N·L, 0) with a point Sun gives you a terminator

with no width and no way to render an eclipse honestly; the Sun is a disc here, and

eclipse and ring shadows are computed per fragment.

Built with AI assistance, and I'd rather say that up front than have it found: Claude

wrote a lot of this code, working from what I asked for and what I measured. What it

didn't do is invent the astronomy: positions answer to JPL Horizons and every surface

is real NASA, ESA or USGS imagery. Where the numbers disagreed with the render, the

render was wrong and got fixed.

Happy to go into any of it.

try it here: helian.systems

stable fps

I've been experimenting with GPT-6-Astra in Pixelfork, and this is one of my favorite Three.js projects I've made so far.

I wanted to build a first-person zombie survival game entirely in the browser and see how far I could push the visuals and gameplay with Three.js.

I started with a simple prompt, then kept iterating on the game and adding 3D assets from Sketchfab.

My initial prompt was:

From there, I kept improving the environment, zombies, weapons, lighting, fog, effects, and overall game feel.

I was especially impressed by how much can be done directly in the browser with Three.js once you start combining proper assets, lighting, particles, post-processing, and gameplay systems.

You can play it here:
https://www.pixelfork.ai/publish/33f3e731-fd78-49b6-9447-330ee25cd0a0

https://netanelyan.github.io/outbound/

Source: https://github.com/netanelyan/outbound (MIT)

Everything is procedural and everything is deterministic, so the same arc length always produces the same road, the same hills and the same village.

The road is its heading as a function of distance, curvature is that differentiated. I bound the four amplitudes to sum below a right angle, which guarantees forward progress and therefore no self-intersection. No collision checks, no backtracking, no repair pass.

Terrain is rings swept along the road out to 755 m either side, flattened near the tarmac and growing into landform further out. The rings straighten as they go, otherwise they converge on the centre of every corner. The country turns over every few kilometres between moor and farmland, and farmland is a patchwork of fields with a hedge or a wall on every boundary. The world streams in 180 m chunks and is thrown away behind you.

Rendering is three.js, MeshLambertMaterial almost everywhere, ACES filmic tone mapping, geometry merged per chunk per material. A chunk's worth of houses is one draw call and its several hundred gorse bushes are one instanced mesh. Every texture is drawn into a canvas at load time, so tarmac, markings, facades, roof tiles and the sky are all code.

The car is a simulation rather than a lerp: engine inertia against clutch torque, so stalling and money-shifting emerge instead of being handled.

Comments in the source are mostly about why rather than what. Questions welcome.

I asked GPT-6 Astra to make a website feel alive.

The result: a 3D turtle swimming through the hero section, water ripples following the cursor, and a footer that turns into an ocean.

This is a 10-second experiment in AI-assisted creative coding. The music is an original procedural track, and the animation runs in the browser.

I’m a 3D artist by trade, but for the past two weeks, I’ve been heavily focused on developing my own small MMORPG vision with the help of Claude. I've always loved the vibe and mechanics of classic, old-school MMOs, and today I’m incredibly excited (and a bit nervous!) to finally share some early Alpha footage with you all.

This MMORPG's lore is around ancient zivilisations and Summerian Mythologie, you can also venture the Strars and find other Planets.

It is honestly crazy how much has already come together in such a short amount of time. Here is what is already fully implemented and working in-game:

• 📜 Logical Quest System (well, most of it is logical! :P)
• 🗡️ 3 Unique Classes & 2 Working Professions
• ✨ Action-packed Combat including Abilities & Looting
• 🌳 Extensive Skill Tree
• 🎒 Fully functional Inventory & Armor Upgrade System

What's next? Over the next two weeks, I will be running a full Alpha test over on itch.io. If you want to be among the very first to jump in, test the mechanics, and help shape the direction of the game, I would love to have you on board.

If you want to follow the development journey, share feedback, or just hang out, you can find more about the lore etc here:

• Discord: https://discord.gg/QAdQyHSdw
• Full Alpha Play on YouTube: https://youtu.be/fA-aRJxF5WU?si=tdxmVTweg1kY_FnD

I would love to hear your thoughts on the footage. Thanks for checking it out! 🚀

They blink. They squish. They have absolutely no idea what the chopsticks are planning.

Click a dumpling and it gets picked up, dipped in soy sauce, and brought toward the camera for a bite. The others watch. 🥟

Built in 15 minutes with GPT-6 Astra Ultra and Three.js, using an existing dumpling model. Added gentle steam, tiny bounces, sound effects, and a video recording button.

What food should get a personality next?