Julien Sulpis
@jsulpis.dev
💻 Front-end engineer & speaker
💡 I explore ways to make the web more fun and performant for everyone.
#WebGL #WebGPU #JS #CSS
💡 I explore ways to make the web more fun and performant for everyone.
#WebGL #WebGPU #JS #CSS
📣 call for feedback!
I'm having second thoughts about the naming of the functions in my #webGL library.
TL;DR: is it ok to have functions starting with "use" in a vanilla JS library ?
explanation in thread 🧵
I'm having second thoughts about the naming of the functions in my #webGL library.
TL;DR: is it ok to have functions starting with "use" in a vanilla JS library ?
explanation in thread 🧵
October 25, 2025 at 1:52 PM
📣 call for feedback!
I'm having second thoughts about the naming of the functions in my #webGL library.
TL;DR: is it ok to have functions starting with "use" in a vanilla JS library ?
explanation in thread 🧵
I'm having second thoughts about the naming of the functions in my #webGL library.
TL;DR: is it ok to have functions starting with "use" in a vanilla JS library ?
explanation in thread 🧵
October 23, 2025 at 7:44 PM
OK I've finally made some progress, my trails effect works on a transparent background (dark or light), and the bloom effect too.
The trails effect is kind of experimental though, it can produce artifacts in scenes with lots of particles. But I think those two make a great combo !
#WebGL #shaders
The trails effect is kind of experimental though, it can produce artifacts in scenes with lots of particles. But I think those two make a great combo !
#WebGL #shaders
October 22, 2025 at 9:11 PM
I did some tests to fully understand the effect of premultiplied alpha combined with the gamma correction (linear RGB -> sRGB).
It seems that the only right way to blend rgba colors is to mix them in linear RGB with premultiplied alpha, and then convert to sRGB.
However ⬇️
It seems that the only right way to blend rgba colors is to mix them in linear RGB with premultiplied alpha, and then convert to sRGB.
However ⬇️
October 20, 2025 at 11:40 AM
I did some tests to fully understand the effect of premultiplied alpha combined with the gamma correction (linear RGB -> sRGB).
It seems that the only right way to blend rgba colors is to mix them in linear RGB with premultiplied alpha, and then convert to sRGB.
However ⬇️
It seems that the only right way to blend rgba colors is to mix them in linear RGB with premultiplied alpha, and then convert to sRGB.
However ⬇️
As expected the trails effect looks cool with particles !
I still struggle with the blending on semi-transparent surfaces, I need to fix that before shipping the effect
#WebGL #Shaders #buildInPublic
I still struggle with the blending on semi-transparent surfaces, I need to fix that before shipping the effect
#WebGL #Shaders #buildInPublic
October 16, 2025 at 7:47 PM
As expected the trails effect looks cool with particles !
I still struggle with the blending on semi-transparent surfaces, I need to fix that before shipping the effect
#WebGL #Shaders #buildInPublic
I still struggle with the blending on semi-transparent surfaces, I need to fix that before shipping the effect
#WebGL #Shaders #buildInPublic
I've been working on a #WebGL light trail effect lately, and it turns out better than expected !
I just need to refine it a little and make it easy to reuse as a regular post-processing effect, and it should bring particles animations to a new level
#buildInPublic
I just need to refine it a little and make it easy to reuse as a regular post-processing effect, and it should bring particles animations to a new level
#buildInPublic
October 9, 2025 at 8:34 PM
I've been working on a #WebGL light trail effect lately, and it turns out better than expected !
I just need to refine it a little and make it easy to reuse as a regular post-processing effect, and it should bring particles animations to a new level
#buildInPublic
I just need to refine it a little and make it easy to reuse as a regular post-processing effect, and it should bring particles animations to a new level
#buildInPublic
It took me AGES but I finally implemented a decent bloom effect, along with a few tone mapping operators.
You can play with it here:
usegl.vercel.app/examples/post-processing/builtin-bloom/
#webGL #buildInPublic
You can play with it here:
usegl.vercel.app/examples/post-processing/builtin-bloom/
#webGL #buildInPublic
August 26, 2025 at 8:18 PM
It took me AGES but I finally implemented a decent bloom effect, along with a few tone mapping operators.
You can play with it here:
usegl.vercel.app/examples/post-processing/builtin-bloom/
#webGL #buildInPublic
You can play with it here:
usegl.vercel.app/examples/post-processing/builtin-bloom/
#webGL #buildInPublic
Debugging #WebGL shaders is hard, but debugging a multi-pass postprocessing effect, well... that's next level 😅
I spent like 2h checking every texture, render target, sampling algorithm... only to find out that I did not returned the right variable in a shader 🤦♂️
BUT I think I'm almost there !
I spent like 2h checking every texture, render target, sampling algorithm... only to find out that I did not returned the right variable in a shader 🤦♂️
BUT I think I'm almost there !
August 13, 2025 at 8:23 PM
Debugging #WebGL shaders is hard, but debugging a multi-pass postprocessing effect, well... that's next level 😅
I spent like 2h checking every texture, render target, sampling algorithm... only to find out that I did not returned the right variable in a shader 🤦♂️
BUT I think I'm almost there !
I spent like 2h checking every texture, render target, sampling algorithm... only to find out that I did not returned the right variable in a shader 🤦♂️
BUT I think I'm almost there !
I have finished setting up Umami on my home server for my websites analytics ✨
It's oddly satisfying to self-host things ! I'm starting small with a simple public API
It's oddly satisfying to self-host things ! I'm starting small with a simple public API
July 28, 2025 at 8:14 PM
I have finished setting up Umami on my home server for my websites analytics ✨
It's oddly satisfying to self-host things ! I'm starting small with a simple public API
It's oddly satisfying to self-host things ! I'm starting small with a simple public API
I should put something at jsulpis.dev 🤔
It's currently used only for my git email and Bluesky handle.
Anything you would like to see in there ? Talks library, tech demos, blog...
It's currently used only for my git email and Bluesky handle.
Anything you would like to see in there ? Talks library, tech demos, blog...
June 19, 2025 at 6:01 PM
I should put something at jsulpis.dev 🤔
It's currently used only for my git email and Bluesky handle.
Anything you would like to see in there ? Talks library, tech demos, blog...
It's currently used only for my git email and Bluesky handle.
Anything you would like to see in there ? Talks library, tech demos, blog...
I made this planet shader after completing @simondev.bsky.social's shader course, and now he has a new bundle including more advanced techniques and maths ? Let's do this ! 🚀
Give me just 10 years to complete all the courses I bought, and I should come up with interesting stuff...
Give me just 10 years to complete all the courses I bought, and I should come up with interesting stuff...
June 9, 2025 at 4:16 PM
I made this planet shader after completing @simondev.bsky.social's shader course, and now he has a new bundle including more advanced techniques and maths ? Let's do this ! 🚀
Give me just 10 years to complete all the courses I bought, and I should come up with interesting stuff...
Give me just 10 years to complete all the courses I bought, and I should come up with interesting stuff...
Reposted by Julien Sulpis
🎤 Tu te mets combien en responsive CSS ? (Édition 2025) avec @jsulpis.dev et Théo Gianella
C’est la base, non ? Mais entre breakpoints, container queries et unités modernes… on s’y perd un peu. Une session en live-coding pour tout remettre à plat.
👉 mixitconf.org/2025/tu-te-m...
C’est la base, non ? Mais entre breakpoints, container queries et unités modernes… on s’y perd un peu. Une session en live-coding pour tout remettre à plat.
👉 mixitconf.org/2025/tu-te-m...
April 17, 2025 at 7:40 AM
🎤 Tu te mets combien en responsive CSS ? (Édition 2025) avec @jsulpis.dev et Théo Gianella
C’est la base, non ? Mais entre breakpoints, container queries et unités modernes… on s’y perd un peu. Une session en live-coding pour tout remettre à plat.
👉 mixitconf.org/2025/tu-te-m...
C’est la base, non ? Mais entre breakpoints, container queries et unités modernes… on s’y perd un peu. Une session en live-coding pour tout remettre à plat.
👉 mixitconf.org/2025/tu-te-m...
I've been playing with the #WebGPU API recently, it's crazy powerful !
A useGPU lib is right around the corner 😂
PS : I will publish the code soon (vanilla WebGPU, OBJ file loader, compute shader and stuff)
A useGPU lib is right around the corner 😂
PS : I will publish the code soon (vanilla WebGPU, OBJ file loader, compute shader and stuff)
April 2, 2025 at 8:06 PM
I've been playing with the #WebGPU API recently, it's crazy powerful !
A useGPU lib is right around the corner 😂
PS : I will publish the code soon (vanilla WebGPU, OBJ file loader, compute shader and stuff)
A useGPU lib is right around the corner 😂
PS : I will publish the code soon (vanilla WebGPU, OBJ file loader, compute shader and stuff)
Implementing Conway's Game of Life in useGL is relatively easy : I taught Claude the API by feeding it with the boids example, and after a few iterations... you have it, in less than 80 lines of code 😊
Interactive demo : usegl.vercel.app/examples/gpg...
#webGL #buildInPublic #gameOfLife
Interactive demo : usegl.vercel.app/examples/gpg...
#webGL #buildInPublic #gameOfLife
March 6, 2025 at 9:14 PM
Implementing Conway's Game of Life in useGL is relatively easy : I taught Claude the API by feeding it with the boids example, and after a few iterations... you have it, in less than 80 lines of code 😊
Interactive demo : usegl.vercel.app/examples/gpg...
#webGL #buildInPublic #gameOfLife
Interactive demo : usegl.vercel.app/examples/gpg...
#webGL #buildInPublic #gameOfLife
The function to make boids animations, or any other thing using the ping pong FBO technique, is published in usegl !
As always you can play with the interactive example :
usegl.vercel.app/examples/gpg...
#WebGL #buildInPublic #boids
As always you can play with the interactive example :
usegl.vercel.app/examples/gpg...
#WebGL #buildInPublic #boids
March 4, 2025 at 8:21 PM
The function to make boids animations, or any other thing using the ping pong FBO technique, is published in usegl !
As always you can play with the interactive example :
usegl.vercel.app/examples/gpg...
#WebGL #buildInPublic #boids
As always you can play with the interactive example :
usegl.vercel.app/examples/gpg...
#WebGL #buildInPublic #boids
I am thrilled to give my first talk outside of France at @futurefrontend.bsky.social !
Thanks to m4dz.net for the opportunity 🙏🏻
I will be talking with him about Design Systems. Can’t wait !
Thanks to m4dz.net for the opportunity 🙏🏻
I will be talking with him about Design Systems. Can’t wait !
How to develop design systems without tying your hands too much technically? That's something that @jsulpis.dev will explore at #FutureFrontend (27-28.5, Espoo, Finland).
futurefrontend.com/speakers/#ju...
futurefrontend.com/speakers/#ju...
February 19, 2025 at 9:42 AM
I am thrilled to give my first talk outside of France at @futurefrontend.bsky.social !
Thanks to m4dz.net for the opportunity 🙏🏻
I will be talking with him about Design Systems. Can’t wait !
Thanks to m4dz.net for the opportunity 🙏🏻
I will be talking with him about Design Systems. Can’t wait !
It took me a while, but I finally implemented a boids behavior with the ping pong FBO technique.
Still need a bit of time to polish the API and make it straightforward to use, and I will publish that in useGL
Still need a bit of time to polish the API and make it straightforward to use, and I will publish that in useGL
February 11, 2025 at 8:50 PM
It took me a while, but I finally implemented a boids behavior with the ping pong FBO technique.
Still need a bit of time to polish the API and make it straightforward to use, and I will publish that in useGL
Still need a bit of time to polish the API and make it straightforward to use, and I will publish that in useGL
Reposted by Julien Sulpis
Subtle things to make your shaders better:
1) Anti-aliasing - Real life is not limited to pixels so unless you're specifically going for a pixelated style, you should be anti-aliasing everything!
mini.gmshaders.com/p/antialiasing
1) Anti-aliasing - Real life is not limited to pixels so unless you're specifically going for a pixelated style, you should be anti-aliasing everything!
mini.gmshaders.com/p/antialiasing
January 27, 2025 at 5:26 PM
Subtle things to make your shaders better:
1) Anti-aliasing - Real life is not limited to pixels so unless you're specifically going for a pixelated style, you should be anti-aliasing everything!
mini.gmshaders.com/p/antialiasing
1) Anti-aliasing - Real life is not limited to pixels so unless you're specifically going for a pixelated style, you should be anti-aliasing everything!
mini.gmshaders.com/p/antialiasing
Phew, I made an example of a multi-pass bloom effect to showcase the API for creating effect passes and update their uniforms.
You can play with it in the interactive example (without types and autocompletion unfortunately) :
usegl.vercel.app/examples/pos...
#buildInPublic #shaders #WebGL
You can play with it in the interactive example (without types and autocompletion unfortunately) :
usegl.vercel.app/examples/pos...
#buildInPublic #shaders #WebGL
January 22, 2025 at 12:18 PM
Phew, I made an example of a multi-pass bloom effect to showcase the API for creating effect passes and update their uniforms.
You can play with it in the interactive example (without types and autocompletion unfortunately) :
usegl.vercel.app/examples/pos...
#buildInPublic #shaders #WebGL
You can play with it in the interactive example (without types and autocompletion unfortunately) :
usegl.vercel.app/examples/pos...
#buildInPublic #shaders #WebGL
TIL: there is an equivalent of `requestAnimationFrame` for videos : `requestVideoFrameCallback`, called for each video frame.
Could be useful to... automatically re-render a WebGL shader when a video texture is played \o/
Could be useful to... automatically re-render a WebGL shader when a video texture is played \o/
January 17, 2025 at 8:45 PM
TIL: there is an equivalent of `requestAnimationFrame` for videos : `requestVideoFrameCallback`, called for each video frame.
Could be useful to... automatically re-render a WebGL shader when a video texture is played \o/
Could be useful to... automatically re-render a WebGL shader when a video texture is played \o/
Reposted by Julien Sulpis
Il nous a régaler avec des conférences toujours excellentes, gagnant du dernier Code In The Dark, il nous paraissait normal d'inviter @jsulpis.dev pour nous parler cette fois de couleurs.
January 17, 2025 at 1:00 PM
Il nous a régaler avec des conférences toujours excellentes, gagnant du dernier Code In The Dark, il nous paraissait normal d'inviter @jsulpis.dev pour nous parler cette fois de couleurs.
It looks like it's #PortfolioDay !
I'm a front-end engineer currently focusing on making polished UIs and animations with #WebGL.
I'm building a lightweight, reactive WebGL library for working with shaders : usegl.vercel.app (WIP, #buildInPublic)
See you 👋
I'm a front-end engineer currently focusing on making polished UIs and animations with #WebGL.
I'm building a lightweight, reactive WebGL library for working with shaders : usegl.vercel.app (WIP, #buildInPublic)
See you 👋
January 15, 2025 at 12:17 PM
It looks like it's #PortfolioDay !
I'm a front-end engineer currently focusing on making polished UIs and animations with #WebGL.
I'm building a lightweight, reactive WebGL library for working with shaders : usegl.vercel.app (WIP, #buildInPublic)
See you 👋
I'm a front-end engineer currently focusing on making polished UIs and animations with #WebGL.
I'm building a lightweight, reactive WebGL library for working with shaders : usegl.vercel.app (WIP, #buildInPublic)
See you 👋
The migration to VitePress is complete !
I hope you will like it as much as I do 😊
usegl.vercel.app/
(yeah it's missing a preview image)
#buildInPublic #webGL
I hope you will like it as much as I do 😊
usegl.vercel.app/
(yeah it's missing a preview image)
#buildInPublic #webGL
useGL
Lightweight, reactive WebGL library for working with shaders
usegl.vercel.app
January 9, 2025 at 9:02 PM
The migration to VitePress is complete !
I hope you will like it as much as I do 😊
usegl.vercel.app/
(yeah it's missing a preview image)
#buildInPublic #webGL
I hope you will like it as much as I do 😊
usegl.vercel.app/
(yeah it's missing a preview image)
#buildInPublic #webGL
I really like Astro, but for documentation I prefer the UI and UX of VitePress over Starlight 🤔 Also the lack of top navigation bothers me.
I will try to migrate the documentation of useGL 🤞
I will try to migrate the documentation of useGL 🤞
January 7, 2025 at 8:47 PM
I really like Astro, but for documentation I prefer the UI and UX of VitePress over Starlight 🤔 Also the lack of top navigation bothers me.
I will try to migrate the documentation of useGL 🤞
I will try to migrate the documentation of useGL 🤞