🚀 I'm launching r3f-webgpu-perf today!
"npm i r3f-webgpu-perf"
One thing I missed while working with WebGPU in React Three Fiber was a performance monitor similar to r3f-perf. The existing tool is fantastic, but it doesn’t support the WebGPU renderer yet.
So I decided to build one.
✅ Supports both WebGL and WebGPU
✅ Modern and customizable UI
✅ Lightweight and easy to integrate
✅ Built specifically for React Three Fiber
My goal is to turn r3f-webgpu-perf into more than just a metrics dashboard. I want it to become a learning tool that provides real-time optimization suggestions based on the techniques I’ve developed while building hundreds of interactive 3D projects over the last two decades. A vanilla Three.js version is also planned.
If you’re building with Three.js, React Three Fiber, or WebGPU, I’d love for you to try it and share your feedback.
⭐ GitHub: https://t.co/dyvf057Irt
📦 NPM: https://t.co/qEs2g23ekm
Every GitHub star helps make the tool better for the entire community.
#threejs #creativecoding #webgpu #r3f
Since using probes is a very technical subject and difficult to understand without visual examples, I decided to create a video with an exaggerated example to show the incredible results that @mrdoob 's work with probes can provide.
As you can see in the video, the hybrid solution of probes with SSGI blends the best of both worlds: projected lights when the objects emitting the color are in the scene, and indirect light provided by the probes when they are not.
Of course, nobody is going to use red and green walls at home lol. This is just a visual example to exaggerate the use and demonstrate how the technology works from a creative point of view.
I hope it helps someone 🤗.
#threejs #threejsJourney #creativecoding #webgpu
🚨 Three.js Roadmap is having a Memorial Day Sale through 5/25!
Use the code SPRING30 at checkout and get 30% OFF Water Pro and all of my courses.
https://t.co/ST1ygolQ3k
Últimamente siento que la IA me hace programar más rápido… pero pensar menos.
A veces ya estoy pegando código antes de razonar el problema.
Por eso construí Consoly: retos diarios para practicar lógica y mantener activo el músculo programador.
Free 👉 https://t.co/6Lsa4CWKvu
Pro tip 💫
Ask your AI to use the Chrome DevTools MCP to profile a few frames of your game/app.
Then ask it to look for potential performance optimizations.