Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

Added a WebGPU morphing engine with post-processing effects to my custom Rust framework, plus lazy loading for GPU assets. Next step: shader-driven text animations, in and out.

AristideBenoist's profile picture

Aristide Benoist

33,427 subscribers

28,671 Aufrufe • vor 2 Tagen •via X (Twitter)

Wissenschaft & Technologie
LIVE

Anya Rossi• Live Now

Private livecam show

0 Kommentare

Keine Kommentare verfügbar

Kommentare vom Original-Post werden hier angezeigt

Ähnliche Videos

Picking added to my WebGPU Engine. Next step, ktx textures. #webgpu
0:11

Picking added to my WebGPU Engine. Next step, ktx textures. #webgpu

Aristide Benoist

82,294 Aufrufe • vor 1 Jahr

My MTSDF generator is ready, built in Rust. The output is highly optimized and plugs directly into my WebGPU engine, using instanced glyphs. Text now aligns perfectly between canvas and HTML, whatever the font used, with accurate position, letter spacing and line height. 🦀 Next step is a particles module: simulation, point cloud, gaussian splatting. 🫧
0:10

My MTSDF generator is ready, built in Rust. The output is highly optimized and plugs directly into my WebGPU engine, using instanced glyphs. Text now aligns perfectly between canvas and HTML, whatever the font used, with accurate position, letter spacing and line height. 🦀 Next step is a particles module: simulation, point cloud, gaussian splatting. 🫧

Aristide Benoist

20,942 Aufrufe • vor 8 Monaten

New webGPU / threeJS rock shader loading!!
0:10

New webGPU / threeJS rock shader loading!!

👁️👁️👁️

27,504 Aufrufe • vor 10 Monaten

You know what’s even cooler than instanced skinning? Full Meshlet Skinning with #WebGPU in the browser. 🦴 10,000 characters. 300M triangles. Per-cluster culling. Zero CPU bottleneck. Carolina Aiazzi and I have spent the last few years building a custom GPU-driven engine for the web. More to come soon!🤫
0:13

You know what’s even cooler than instanced skinning? Full Meshlet Skinning with #WebGPU in the browser. 🦴 10,000 characters. 300M triangles. Per-cluster culling. Zero CPU bottleneck. Carolina Aiazzi and I have spent the last few years building a custom GPU-driven engine for the web. More to come soon!🤫

Etienne Pinchon

25,445 Aufrufe • vor 7 Monaten

A tour of the post-processing features in my WebGPU engine. Chaining global passes like blur, bloom, and pixelate, on top of a disturb pipeline with its own options: distortion, black and white, lighten, darken, noise, RGB split, and more. It also supports layer and plane UV isolation. Planes can have optional shadows and rounded borders. Behind-the-scenes split view shows the raw pass vs final composite. Built from scratch with the WebGPU JavaScript API. Lightweight, minimal code, 0 dependencies, modular custom components 🧩. Next, vertex work and finish the MTSDF generator I’m building in Rust. ✨
0:15

A tour of the post-processing features in my WebGPU engine. Chaining global passes like blur, bloom, and pixelate, on top of a disturb pipeline with its own options: distortion, black and white, lighten, darken, noise, RGB split, and more. It also supports layer and plane UV isolation. Planes can have optional shadows and rounded borders. Behind-the-scenes split view shows the raw pass vs final composite. Built from scratch with the WebGPU JavaScript API. Lightweight, minimal code, 0 dependencies, modular custom components 🧩. Next, vertex work and finish the MTSDF generator I’m building in Rust. ✨

Aristide Benoist

16,364 Aufrufe • vor 8 Monaten

Cursor position and color uniforms are now available to custom shaders in Ghostty, enabling cursor animations (and other effects). Video below is a rough demo of something simple. Can't wait to see what the custom shader community does with this. :) Docs:
0:13

Cursor position and color uniforms are now available to custom shaders in Ghostty, enabling cursor animations (and other effects). Video below is a rough demo of something simple. Can't wait to see what the custom shader community does with this. :) Docs:

Mitchell Hashimoto

70,354 Aufrufe • vor 1 Jahr

Working on simulating sunset, night and fake lights with only post processing and simple shaders. Still very rough, next step is to figure out good solutions for the sky!
0:14

Working on simulating sunset, night and fake lights with only post processing and simple shaders. Still very rough, next step is to figure out good solutions for the sky!

Doot 🪲🪷 Wishlist Milki Delivery 🐮🚲

16,998 Aufrufe • vor 6 Monaten

I built gpu-pii, inspired by Shu's gpu-lexer. A small model, trained from scratch, runs on WebGPU in your browser to detect personal information in any text
0:15

I built gpu-pii, inspired by Shu's gpu-lexer. A small model, trained from scratch, runs on WebGPU in your browser to detect personal information in any text

Duncan

10,488 Aufrufe • vor 1 Monat

Added mipmaps to my WebGPU engine to keep images sharp when I play with layout transitions. Can’t wait to share what’s coming! 📽️
0:13

Added mipmaps to my WebGPU engine to keep images sharp when I play with layout transitions. Can’t wait to share what’s coming! 📽️

Aristide Benoist

41,589 Aufrufe • vor 9 Monaten

Morphing braille loader for async item creation ⊙ Dynamic label preview in header ⊙ Loader powered by 𝚖𝚘𝚝𝚒𝚘𝚗 ⊙ Smooth transition from loading → success state ⊙ Exit animation via <𝙰𝚗𝚒𝚖𝚊𝚝𝚎𝙿𝚛𝚎𝚜𝚎𝚗𝚌𝚎 /> ⊙ Text morphing with 𝚝𝚘𝚛𝚙𝚑 by ؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜lochie
0:11

Morphing braille loader for async item creation ⊙ Dynamic label preview in header ⊙ Loader powered by 𝚖𝚘𝚝𝚒𝚘𝚗 ⊙ Smooth transition from loading → success state ⊙ Exit animation via <𝙰𝚗𝚒𝚖𝚊𝚝𝚎𝙿𝚛𝚎𝚜𝚎𝚗𝚌𝚎 /> ⊙ Text morphing with 𝚝𝚘𝚛𝚙𝚑 by ؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜؜lochie

kian bazza

79,387 Aufrufe • vor 8 Monaten

Scroll-triggered animations are coming to Chrome early next year (and we've been really excited about this one for a bit!) 🥳 Unlike scroll-driven animations (already in Chrome & Safari), this API introduces "timeline-trigger" and "animation-trigger" to start an animation within a specific range, rather than relying on the scroller completion *as* the animation timeline. I got nerd-sniped and wanted to try it out so I built this shape morphing demo to show how you can apply multiple animations to the same element over with different triggers. PRETTY COOL IMO! Bramus has a post with more info ⬇️
0:19

Scroll-triggered animations are coming to Chrome early next year (and we've been really excited about this one for a bit!) 🥳 Unlike scroll-driven animations (already in Chrome & Safari), this API introduces "timeline-trigger" and "animation-trigger" to start an animation within a specific range, rather than relying on the scroller completion *as* the animation timeline. I got nerd-sniped and wanted to try it out so I built this shape morphing demo to show how you can apply multiple animations to the same element over with different triggers. PRETTY COOL IMO! Bramus has a post with more info ⬇️

Una 🇺🇦

38,782 Aufrufe • vor 10 Monaten

A real-time AI motion capture model with 1B parameters. Connects to a 1080P camera or processes uploaded video to generate 3D motion data in real time. Supports Unreal Engine, Unity, and Blender, requiring 8GB of GPU VRAM for real-time processing.
0:13

A real-time AI motion capture model with 1B parameters. Connects to a 1080P camera or processes uploaded video to generate 3D motion data in real time. Supports Unreal Engine, Unity, and Blender, requiring 8GB of GPU VRAM for real-time processing.

CYANPUPPETS

37,070 Aufrufe • vor 7 Monaten

two Ssstanley GIF animations with sound effects added
0:11

two Ssstanley GIF animations with sound effects added

~M(A)cho

22,686 Aufrufe • vor 1 Jahr

Post-Processing Outlines Shader/Math: 🔲 > Generate thick outlines for the entire scene. More code w/ Shader Graph setup in replies. 🧵 #unity3d #gamedev #realtimevfx
0:17

Post-Processing Outlines Shader/Math: 🔲 > Generate thick outlines for the entire scene. More code w/ Shader Graph setup in replies. 🧵 #unity3d #gamedev #realtimevfx

Mirza Beig

39,031 Aufrufe • vor 2 Jahren

Now on Godot WebGPU we have unreal-nanite-style (GPU Driven) rendering like the ThreeJS demo. 🚀 This isn't a shader. This is an actual deep modification to the Godot engine. And the Godot engine native is now ~2x faster for 3D as well (depends on your game). I can push this to almost 300x300 (from 100x100 in the video) and 55fps before it starts having more instances than 16bit integers and the buffer overflows. I can increase it to higher bits but who's gonna have >65k instances? Threejs demo crashed the webpage when I pushed it to above 175x175. This is literally Godot 5. I'm not sure if they'll ever accept these changes any time soon or if I'll keep it as a fork, but over the next few weeks/ months I'll get it production ready either way. Still need to round out the rest of the features, but honestly I could stop here as opaque draw batching on the GPU is the 80/20 of GPU driven rendering. The rest is smaller gains and only matters for ginormous worlds or super high fidelity. Unfortunately the WebGPU spec doesn't support multi-draw-indirect calls which is somewhat the bread and butter of GPU Driven Rendering but this demo only has 2 unique instances so MDI doesn't matter. With 1000s of actual unique instance MDI matters, and that's 100% supported on this Godot fork for native (I'll post a demo later) but not on WebGPU until the WebGPU people implement it. I might have to contribute to WebGPU then too.. I've spent way too much time on this. I want to get transparency and meshlets working too but I need to get back to Shiny Gen development so I can eat. Then I'll get back to Godot development in a couple weeks. (chart is the optimizations over time on a separate rotating cube scene, showing native increasing 2x and webgpu by 1.14x)
0:18

Now on Godot WebGPU we have unreal-nanite-style (GPU Driven) rendering like the ThreeJS demo. 🚀 This isn't a shader. This is an actual deep modification to the Godot engine. And the Godot engine native is now ~2x faster for 3D as well (depends on your game). I can push this to almost 300x300 (from 100x100 in the video) and 55fps before it starts having more instances than 16bit integers and the buffer overflows. I can increase it to higher bits but who's gonna have >65k instances? Threejs demo crashed the webpage when I pushed it to above 175x175. This is literally Godot 5. I'm not sure if they'll ever accept these changes any time soon or if I'll keep it as a fork, but over the next few weeks/ months I'll get it production ready either way. Still need to round out the rest of the features, but honestly I could stop here as opaque draw batching on the GPU is the 80/20 of GPU driven rendering. The rest is smaller gains and only matters for ginormous worlds or super high fidelity. Unfortunately the WebGPU spec doesn't support multi-draw-indirect calls which is somewhat the bread and butter of GPU Driven Rendering but this demo only has 2 unique instances so MDI doesn't matter. With 1000s of actual unique instance MDI matters, and that's 100% supported on this Godot fork for native (I'll post a demo later) but not on WebGPU until the WebGPU people implement it. I might have to contribute to WebGPU then too.. I've spent way too much time on this. I want to get transparency and meshlets working too but I need to get back to Shiny Gen development so I can eat. Then I'll get back to Godot development in a couple weeks. (chart is the optimizations over time on a separate rotating cube scene, showing native increasing 2x and webgpu by 1.14x)

David Walter (Shiny Gen)

27,981 Aufrufe • vor 5 Monaten

Getting a bunch of questions about this! It's a full gpu rendering pipeline with built in shader editor for Rive, which can interleave 2D + 3D. Think WebGPU (minus compute, for now) that runs anywhere, not just the browser. You can implement anything at all. Cell shading. Background blurs. Deformation effects. And yes, even Rive vector components as textures. Shaders are precompiled and ship with your .riv. Minimal runtime size impact. Still WIP.
0:13

Getting a bunch of questions about this! It's a full gpu rendering pipeline with built in shader editor for Rive, which can interleave 2D + 3D. Think WebGPU (minus compute, for now) that runs anywhere, not just the browser. You can implement anything at all. Cell shading. Background blurs. Deformation effects. And yes, even Rive vector components as textures. Shaders are precompiled and ship with your .riv. Minimal runtime size impact. Still WIP.

Guido Rosso

22,346 Aufrufe • vor 7 Monaten

The next version of three-gpu-pathtracer with WebGPU support is published! Drop path tracing into any project for product viz, architectural renders, or generative art. Check it out here & share what you're making ✨ #threejs #webgpu
0:15

The next version of three-gpu-pathtracer with WebGPU support is published! Drop path tracing into any project for product viz, architectural renders, or generative art. Check it out here & share what you're making ✨ #threejs #webgpu

Garrett Johnson

17,457 Aufrufe • vor 27 Tagen

Express yourself with a custom Revolut card. Design yours in-app and show unique flair with added icons and text. Try now ✨
0:15

Express yourself with a custom Revolut card. Design yours in-app and show unique flair with added icons and text. Try now ✨

Revolut

2,678,290 Aufrufe • vor 5 Monaten

honestly never thought about the fact my phone had a GPU until i made it solve the heat equation. video is what happens one thousandth over the stability threshold. implemented in rust wasm with webgpu. find my writeup/tutorial about what i did at
0:13

honestly never thought about the fact my phone had a GPU until i made it solve the heat equation. video is what happens one thousandth over the stability threshold. implemented in rust wasm with webgpu. find my writeup/tutorial about what i did at

clocksSugars

36,996 Aufrufe • vor 9 Monaten