And here’s a peek behind the scenes. 👀 A minimal Electron app connects to Azure Kinect via Node.js, reconstructs a 3D skeleton with Three.js, and reacts to motion intensity based on the velocity of some key bones. #WebGPU #Threejs

The interaction is finally ready! It was tricky to calibrate, but it now supports up to 6 people, reacting to full-body movement velocity. The more energetic your motion, the stronger the response. During my tests kids loved it. They had a blast jumping around nonstop😄

Can we start a movement to bring back the Kinect? I’ve been playing with it in WebGPU and… it’s ridiculously good. #threejs

Working on the final rendering details of my fluid simulation. This is just the AO and shadow pass in grayscale, sometimes stripping it down shows the most. #WebGPU #threejs

Almost done with the interaction of my WebGPU fluid simulation! After testing BVH geometry and marching cubes with compute shaders, I chose raymarching for hands interaction & rendering. It adapts well with MLS-MPM and enables precise interaction in real-time for <2ms. #threejs

Just finished implementing StorageTexture3D in threejs and added a new example to show how it works! Real-time 3D texture computation is now possible with WebGPU. Super fun to see it running live!

Integrated unified spray, foam, and bubbles into my fluid simulation. Runs in real-time with WebGPU, Three.js, and over 1 million particles!

Real-time AI + WebGPU + WebGL (Three.js) and broadcasted to native, with all inter-process communication handled via shared GPU textures, zero CPU, 100% GPU. Each node runs in its own process and hosts fully editable code: fork it, modify it, or prompt it live with an Agent.

After a long battle with Metal, GPU-to-GPU texture transfer from native to Web is finally working. All my nodes now render IOSurface textures via importExternalTexture in WebGPU. No CPU readback. Next week, I’ll reveal why I did all this with the AI integration.

Native-to-Web API is nearly complete. I built a minimal WebGPU project that listens for incoming nodes and displays the first received texture in the fragment. Each app or site can act as a node, with performance that feels like everything runs in the same tab.🤯🚀

Native → Web pipeline now working on Windows! This one took a while. I had to build my own Node.js C++ library for SpoutDX from scratch. It supports dynamic feed switching and custom formats like r32f, as shown here with the Kinect!

✅ Native → Web pipeline now working on macOS! If resources are wired in the node graph, they are shared directly with the embedded window, ready to use in your web app. I will make a demo with Kinect in Web this weekend! Next up: Windows support. 🪟

Today's update on my one-click, zero-CPU web↔️native app bridge!🚀 I refactored everything into a node-based graph to prep for the upcoming Native->Web Node. Now with persistent state and session restore. Just reopened my project and everything reconnected out of the box!🔌✨

Today's update on my one-click, zero-CPU web<->native app. 🚀 Added offscreen webpage viewer and multi feed per URL. Basic tool nearly done. Next: advanced API for manual control of DXGI/IOSurface texture transfer. Also I'm confident in GPU<->GPU transfer from Native to Web.

Today’s update on my one-click zero-CPU web-to-native rendering app. 🚀 MacOS support is live! IOSurface lets us stream three.js (or any web content) directly from the GPU into TouchDesigner, Unreal, Unity & more. UI’s shaping up nicely 😎 Next: Multi texture per URL. 👀

Building an app that streams web content as GPU texture via DXGI/IOSurface, GPU-to-GPU, no CPU hit.⚡️ One-click to Unity, Unreal, TouchDesigner. 10×4K textures, unlimited FPS. Currently working on multi-FBO per URL with huge potential for WebGPU + AI. Would you buy it? 👀

Introducing a major refactoring for RenderTarget to support Array-Based RenderTarget with a simple option! This applies to all types of textures, which can now be initialized as arrays with a depth parameter > 1. This simplify things and enables advanced MRT Arrays and more!

Weighted Blended Order-Independent Transparency now working in Threejs with WebGPU! No more z-fighting between particles! 🎉 Next I could optimizing performance with a depth pre-pass. Can’t wait to test this on a 120-inch 4K display next month it’s going to look incredible. 🚀

Still working on my fluid sim. Next up: Weighted Blended Order-Independent Transparency (WBOIT). MRT with per-target blending is easy in WebGPU, and thanks to OES_draw_buffers_indexed, it’ll work in WebGL2 fallback too. Time to bring layered blending to Three.js! 🔥

Most of my threejs postprocessing is now in compute shaders using storage textures. But being limited to only red channel for read-write is painful. That’s why the storage-texture-format-tier1 (RGBA!) proposal is so exciting, true read-write means no more ping-pong tricks! 🥳

@utsubo.com is back on Instagram! www.instagram.com/p/DITwRy6MHfe We’ve got a new designer and a new marketing mind on board, and they’re already cooking up some very unserious content. 😄 Follow us to see what’s coming in the next few days!

I'd like to propose a feature @github.com. Who's interested? 👀 #threejs

I don’t usually ask for much despite giving a lot to OSS, but if my work has resonated with you, consider voting for my project Utsubo. It’s what’s helped me bring my best work to threejs, and your support would really help. Vote here:👇❤️ vote.webbyawards.com/PublicVoting...

✨I've launched my GitHub Sponsors page! Focusing on #threejs WebGPU/WebGL integration, advancing tools like stats-gl, r3f-perf, react-three-next & more! 🐙Sponsor: github.com/sponsors/Ren... Deeply appreciate your support, it empowers more time for these exciting projects. ❤️

My work on Tile Shadows has been merged into Three.js and will be available in r176! Baking shadows into your scene can be incredibly powerful. To make this easier, I’m introducing two new methods, allowing you to seamlessly blend static and dynamic shadows in your scene!

🎉 Big news!! Our website is nominated for a #Webbys in Best Mobile Visual Design - Aesthetic! If you like the website, please vote for us! ❤️👉 vote.webbyawards.com/PublicVoting... With the recent Threejs updates, it should now be much faster on mobile than at launch.🚀 utsubo.com

You can now follow the progress of my Tile Shadow work here: github.com/mrdoob/three... WebGPU & WebGL support already implemented. Just a bit of cleanup and a few edge cases left, almost ready to go!

Something huge is coming to Threejs. Today I achieved an N-tile shadow render in a single draw call using RenderBundle, Depth 2D Array FBO, and CameraArray. Basically, here one draw call and one command renders and stores shadows for 16 different parts of the scene.

Made a HUD helper for my TileShadow class in Threejs. Totally could’ve done more simple but node materials are so good, it was too tempting. Just 4 planes with custom vertexNode and outputNode. No extra scene, no QuadMesh tricks. Also finished the WebGL support. PR tomorrow!

Started working on a tile shadow system for threejs. Quickly hit the 16-texture limit when trying to layer in cascaded shadows and VSM, so I added depth texture array support (texture_depth_2d_array/sampler2DArrayShadow) and reworked the shadow nodes. Should be ready soon!

I've written a brief guide for profiling WebGPU commands with XCode's Metal debugger. It's... not exactly easy, but it works! I've got several ideas for how to improve it in the future, too. toji.dev/webgpu-profi...

Just added dynamic rigid bodies via Signed Distance Field to my Three.js fluid simulation. The physics is still super basic but AI will help with buoyancy and all the other physics stuff I haven't figured out yet.

Some progress on the World Expo 2025 experience: Currently working on real-time interactions for passersby using AI (MediaPipe Holistic) to detect silhouettes, capture 2D poses, map to a 3D skeleton, and convert it all to a Signed Distance Field, all in real-time! #threejs

Since the Metal backend still lacks full multidraw support, I'm exploring an alternative approach for BatchedMesh in three.js using basic indirect draw calls. Next, I'll try to offload the BatchedMesh CPU workload to compute shaders with the indirect buffer.

For World Expo 2025, I’m working on an interactive fluid installation built with #threejs and #WebGPU. Initially explored SPH but hit performance limits at ~100k particles, so I switched to MPM. Reached my first milestone and put together a small demo. Link to the demo below! ⬇️

2024 was a steady year: ~70 features and 75 fixes contributed to threejs! Excited to do even better in 2025!

Wrapped up a bunch of updates near a beautiful Japanese temple on a sunny winter afternoon. 🌞🏯 - Performance optimizations - Polished cheetah visuals - Improved scene lighting Link below ⬇️

First Draft: github.com/mrdoob/three... 🚀

Stress-testing the upcoming refactored API for Timestamp Queries in the WebGPURenderer alongside my upcoming article on Spatial Hashing. The new TimestampQueriesPool creates isolated query pools per type (render/compute), each batched, and it's holding up so well. 🥹 #threejs

After years of experimenting, I believe I've finally found a robust way to handle timestamp queries for both WebGPU and WebGL in three.js. Once the work is done, my tools, r3f-perf and stats-gl, will integrate this feature. Unfortunately, I need to prioritize work over OSS for the time being.

The WebGPURenderer is amazing. Today, I built a fat line library that works with all Three.js built-in materials (PBR included), runs super fast as InstancedMesh or BatchedMesh, and only needed one node and a few lines of TSL to make it work.

WGSL adds "let" on top of "const" and "var" from GLSL, bringing immutability and block scoping. Inspired by @sea3dformat's idea, the upcoming node.toConst() in Three.js will now auto-generates let or const, making it seamless for developers. More here: github.com/mrdoob/three...

Had an idea for Threejs: enable asynchronous uploads for DataTexture in WebGL using PBOs to avoid CPU->GPU stalls during multiple texSubImage2D calls. In WebGPU, texture uploads are already inherently asynchronous thanks to staging buffers or mapped memory. github.com/mrdoob/three...

Still a work in progress, but this week I'm adding 3D Render Targets and 2D Array RenderTargets to the WebGPURenderer in threejs! It works on both WebGPU and WebGL backends and supports Multi Render Targets and writing to specific layer/depth OOTB! github.com/mrdoob/three...

Our previous Utsubo website remains accessible at: v1.utsubo.com 🗃️

Our new WebGPU website utsubo.com now live on #FWA and #Awwwards!🤞 I'm so proud of what we've built and can’t wait to keep improving it over time!😊 thefwa.com/live-judging/ www.awwwards.com/sites/utsubo...

A bold new chapter begins at Utsubo. One year crafting with WebGPU. Discover it now at utsubo.com.

Three.js is the best debugging platform for WebGPU 😁 github.com/WebKit/WebKi...

Attempted to implement the WebGPU `chromium-experimental-multi-draw-indirect` feature in Three.js today. Turns out, just requesting the feature breaks all WebGPU examples. I guess that's what the experimental prefix is here for 😅. github.com/gpuweb/gpuwe...