Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

Working on an ultra-fast SDF Texts. Instance culling via compute shader & indirect-draw is just a drop-in piece. Everything reuses and connects. Made with TSL, Threejs Plus will bring a whole new level of performance into the Web that wasn't possible before WebGPU! Stay tuned!

onirenaud's profile picture

Renaud

9,684 subscribers

22,151 Aufrufe • vor 9 Monaten •via X (Twitter)

Wissenschaft & TechnologieGamingBildung
LIVE

Anya Rossi• Live Now

Private livecam show

0 Kommentare

Keine Kommentare verfügbar

Kommentare vom Original-Post werden hier angezeigt

Ähnliche Videos

🧮 Physics that never leaves the graphics card. Kevin Levron's (Kevin Levron) Three.js WebGPU demo runs the whole simulation in a compute pass, written in TSL, then draws thousands of bodies as one instanced mesh. 🔗 #WebGPU #ThreeJS #TSL #ComputeShaders #CreativeCoding
0:54

🧮 Physics that never leaves the graphics card. Kevin Levron's (Kevin Levron) Three.js WebGPU demo runs the whole simulation in a compute pass, written in TSL, then draws thousands of bodies as one instanced mesh. 🔗 #WebGPU #ThreeJS #TSL #ComputeShaders #CreativeCoding

WebGL / WebGPU

13,401 Aufrufe • vor 1 Monat

After spending some time in the Virgin Islands, I was inspired to create a WebGPU-based water shader with TSL and compute shaders 🌊 Lots left to do, but it's finally starting to look decent! #threejs #webgl #webgpu #shaders
0:51

After spending some time in the Virgin Islands, I was inspired to create a WebGPU-based water shader with TSL and compute shaders 🌊 Lots left to do, but it's finally starting to look decent! #threejs #webgl #webgpu #shaders

Dan Greenheck

28,002 Aufrufe • vor 7 Monaten

STOP everything you're doing, and go try WebGPU and TSL. I wanted to give a shot to TSL and see how it's working today, and wow. in short, it's great Sunag, mrdoob and all the TSL contributors made an awesome job making it as easy as possible #threejsjourney #r3f #threejs details below ⬇️
0:35

STOP everything you're doing, and go try WebGPU and TSL. I wanted to give a shot to TSL and see how it's working today, and wow. in short, it's great Sunag, mrdoob and all the TSL contributors made an awesome job making it as easy as possible #threejsjourney #r3f #threejs details below ⬇️

Alex

84,323 Aufrufe • vor 6 Monaten

First test with #webgpu #threejs #tsl : InstancedMesh, node material, compute shaders and psrdnoise. Demo : Source :
0:36

First test with #webgpu #threejs #tsl : InstancedMesh, node material, compute shaders and psrdnoise. Demo : Source :

Kevin Levron

19,378 Aufrufe • vor 1 Jahr

Folding image transition. Made with #threejs #tsl #webgpu.
0:24

Folding image transition. Made with #threejs #tsl #webgpu.

Seyi

11,639 Aufrufe • vor 11 Tagen

Building Three.js shaders is about to get a whole lot easier! 👍 Introducing Three.js Shader Graph — visual node-based editing for TSL. 🖱️Drag & drop nodes 📺Real-time 3D preview 🔄Auto-generate TSL code in realtime Join the waitlist 👉🏻 #threejs #webgl #webgpu #shaders
1:46

Building Three.js shaders is about to get a whole lot easier! 👍 Introducing Three.js Shader Graph — visual node-based editing for TSL. 🖱️Drag & drop nodes 📺Real-time 3D preview 🔄Auto-generate TSL code in realtime Join the waitlist 👉🏻 #threejs #webgl #webgpu #shaders

Dan Greenheck

35,464 Aufrufe • vor 7 Monaten

Today, MJ breaks down False Earth, an incredible WebGPU-powered world where the heavy lifting happens on the GPU: procedural grass, VAT animation, compute shaders, indirect draw, LOD, and GPU-driven culling. Go behind the scenes:
0:25

Today, MJ breaks down False Earth, an incredible WebGPU-powered world where the heavy lifting happens on the GPU: procedural grass, VAT animation, compute shaders, indirect draw, LOD, and GPU-driven culling. Go behind the scenes:

Codrops

21,581 Aufrufe • vor 2 Monaten

Quick exploration. Moving images along paths. Made with #threejs #tsl #webgpu.
0:21

Quick exploration. Moving images along paths. Made with #threejs #tsl #webgpu.

Seyi

32,418 Aufrufe • vor 1 Monat

working on adding decent bitmap font support to my crt shader in threejs / webgpu
0:23

working on adding decent bitmap font support to my crt shader in threejs / webgpu

Codetaur

53,691 Aufrufe • vor 4 Monaten

ascii fluid. in threejs / tsl / webgpu
0:48

ascii fluid. in threejs / tsl / webgpu

Codetaur

58,950 Aufrufe • vor 3 Monaten

My new #threejs project is live😍. Lumen Decor features WebGPU SSGI+SSR, showcasing how sunlight can influence decoration. Everything you see renders in real-time and weighs 4MB. #creativecoding #webgpu #tsl
2:47

My new #threejs project is live😍. Lumen Decor features WebGPU SSGI+SSR, showcasing how sunlight can influence decoration. Everything you see renders in real-time and weighs 4MB. #creativecoding #webgpu #tsl

Anderson Mancini

68,187 Aufrufe • vor 8 Monaten

Two new #threejs projects on the way 😍 Working on my own gem renderer with a custom refraction material in TSL for #WebGPU, combining Screen Space Reflections + SSGTAO for superior results, as this allows diamonds to generate reflections on the metal mesh. The performance is incredible, even on gems with over 200 diamonds. This time, without any additional libraries. Just React Three Fiber and a lot of magic with custom shaders in TSL. GemGPU™ will also come with a very minimalist gem and metal customization panel that hides and lets the jewelry be the star. I also created a beautiful new stats panel that completely hides in the scene when not needed. It provides relevant optimization information, a performance gauge, summary and expanded modes, and day/night toggle. In the video, you can also see SSGI in action, with a pearl that reflects, in real time, all the objects in the scene, just as the objects in the scene reflect the pearl. It's magical. There are still a few things to fix, but I'll share the live link soon. Stay tuned.
3:43

Two new #threejs projects on the way 😍 Working on my own gem renderer with a custom refraction material in TSL for #WebGPU, combining Screen Space Reflections + SSGTAO for superior results, as this allows diamonds to generate reflections on the metal mesh. The performance is incredible, even on gems with over 200 diamonds. This time, without any additional libraries. Just React Three Fiber and a lot of magic with custom shaders in TSL. GemGPU™ will also come with a very minimalist gem and metal customization panel that hides and lets the jewelry be the star. I also created a beautiful new stats panel that completely hides in the scene when not needed. It provides relevant optimization information, a performance gauge, summary and expanded modes, and day/night toggle. In the video, you can also see SSGI in action, with a pearl that reflects, in real time, all the objects in the scene, just as the objects in the scene reflect the pearl. It's magical. There are still a few things to fix, but I'll share the live link soon. Stay tuned.

Anderson Mancini

12,113 Aufrufe • vor 5 Monaten

Following ☄︎ work, I'm experimenting with some react three fiber with #threejs webGPU. We no longer need an EffectComposer to use post-processing effects in #r3f. Now, everything is done by composing TSL nodes. I created a small component that helps in rendering post-processing effects. All you need to do is import the effects you want and add them to the final composition. I will share the link to the demo and source code on Monday 😍. Another thing I want to highlight is how amazing the Screen Space Reflection effect is. It generates reflections not only on the ground, as we had before in r3f in webgl. It is able to calculate the reflections between the meshes. Look how beautiful the reflection of the lightsaber on Darth Vader's mask is. This is not something that is easy to calculate and this is exactly where WebGPU in threejs shines! Congratulations to everyone on the threejs team. I am increasingly impressed with WebGPU and TSL.
1:41

Following ☄︎ work, I'm experimenting with some react three fiber with #threejs webGPU. We no longer need an EffectComposer to use post-processing effects in #r3f. Now, everything is done by composing TSL nodes. I created a small component that helps in rendering post-processing effects. All you need to do is import the effects you want and add them to the final composition. I will share the link to the demo and source code on Monday 😍. Another thing I want to highlight is how amazing the Screen Space Reflection effect is. It generates reflections not only on the ground, as we had before in r3f in webgl. It is able to calculate the reflections between the meshes. Look how beautiful the reflection of the lightsaber on Darth Vader's mask is. This is not something that is easy to calculate and this is exactly where WebGPU in threejs shines! Congratulations to everyone on the threejs team. I am increasingly impressed with WebGPU and TSL.

Anderson Mancini

26,339 Aufrufe • vor 1 Jahr

Three.js WebGPU TSL grass now available in ✨ TSLFX. #threejs #r3f #webgpu
0:26

Three.js WebGPU TSL grass now available in ✨ TSLFX. #threejs #r3f #webgpu

Verekia 🔮 ManaBlade.com

12,061 Aufrufe • vor 1 Jahr

I’ve opened up many of the TSL exercises to everyone! Try out some WebGPU shaders and fiddle with them, all in the browser. Pick an exercise and see if you can match the output. Link: #threejs #webgpu
0:30

I’ve opened up many of the TSL exercises to everyone! Try out some WebGPU shaders and fiddle with them, all in the browser. Pick an exercise and see if you can match the output. Link: #threejs #webgpu

Simon

11,063 Aufrufe • vor 8 Monaten

Yuta vs. Madara: The Culling Game just reached a whole new level. When the Queen of Curses meets the Ghost of the Uchiha. Made with Seedance 2.0
2:46

Yuta vs. Madara: The Culling Game just reached a whole new level. When the Queen of Curses meets the Ghost of the Uchiha. Made with Seedance 2.0

Yaseen Khan Gul

83,773 Aufrufe • vor 2 Monaten

SDF raytracing in a browser. WebGPU, SDF is 256x256x256, the build is done on the GPU using 2-level BVH (TLAS+BLAS).
0:59

SDF raytracing in a browser. WebGPU, SDF is 256x256x256, the build is done on the GPU using 2-level BVH (TLAS+BLAS).

Alex Goldring

31,256 Aufrufe • vor 5 Monaten

moving shader controls inside the CRT's ui. built with threejs / webgpu
0:51

moving shader controls inside the CRT's ui. built with threejs / webgpu

Codetaur

20,803 Aufrufe • vor 28 Tagen

Aurelia by holtsetio Completely procedural jellyfish, with verlet physics and fake volumetric lighting. Rendered in WebGPU and TSL.
0:30

Aurelia by holtsetio Completely procedural jellyfish, with verlet physics and fake volumetric lighting. Rendered in WebGPU and TSL.

Three.js

48,571 Aufrufe • vor 1 Jahr

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
0:34

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

Renaud

15,580 Aufrufe • vor 11 Monaten