Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Shader School - An introduction to GLSL shaders that runs in your web browser

github.com

Post reply on HN
Print view View original

31–40 of 49 posts

Re: Shader School - An introduction to GLSL shaders that runs in your web browser

#31

Post by pdkl95 »

sydthrowaway wrote: post #15

Very sad that none of the fragment shader experts have written a book focusing on generative art. The Book of Shaders is very basic. How to create something like this (including sound!) while thinking on a per color x,y basis is mind boggling. https://www.shadertoy.com/view/XsfXD2

Thinking about designing a scene in a fragment shader is already mind boggling. Writing a new shader from scratch live in front of an audience within a 25 minute deadline is insane. The demoscene calls this a "Shader Showdown" competition, and they are amazing to watch.

A good example is the Revision 2021 semi-finals[1]. The entire video is worth watching, but I especially recommend watching the last half of evvvil-vs-flopine (from about 43:00); the last few minutes (from ~56:00) fundamentally changed my understanding of what is possible in a fragment shader. Ray marching into a hand crafted signed distance field is such a bizarre way of thinking about a scene.

[1] https://www.youtube.com/watch?v=NBdRfFwuP40

edit: corrected 'last few minutes' time

Re: Shader School - An introduction to GLSL shaders that runs in your web browser

#32

Post by Impossible »

thrower123 wrote: post #4

It seems really odd to me that GLSL and HLSL never unified into a common language.

Vulkan supports both officially, although GLSL support is better. To be fair Vulkan kind of assumes the game engine shader compiler does most of the heavy lifting and using either glsl or hlsl directly in a small Vulkan application is a pain compared to OpenGL or DirectX.

Re: Shader School - An introduction to GLSL shaders that runs in your web browser

#33

Post by billti »

Agentlien wrote: post #9
rectang wrote: post #8

Earlier quoted context omitted.

As an outsider, it's really hard to discern what I might choose to learn amongst graphics tech. I've tried to invest my learning in subjects and technologies that aren't going anywhere and where my knowledge will pay off over decades — computer science fundamentals, math, SQL, C, vanilla JavaScript, HTML, CSS, LaTeX, Git, Python, etc. It looks like everybody's still fighting it out in graphics though.

Honestly, if you learn hlsl or glsl it's not much work to learn the other. I originally learned opengl in school and after a few years of working with it I transitioned to a job where we primarily used Direct3D. I guess I had passively picked up enough bits and pieces along the way because I never really thought about the shift. I briefly looked at Vulkan when it first came out, but I haven't had the time to get into…

This. I wrestled with the same topic a couple years ago. Not only which to use, but once you choose a “common” one (say OpenGL), then actually getting pixels in a window is still different across platforms (hence things like SDL and GLFW).

For me I settled on: 1) Learn WebGL in the browser. It’s a pretty good subset of OpenGL [ES] and an easy environment to experiment in. Then 2) learn a more “native” approach with good tooling support, such as Direct3D 11. (I wouldn’t get into D3D12 or Vulkan until you learn the basics pretty well).

As others have mentioned, while the landscape is confusing, the concepts across them are pretty similar once you get a foothold.

Re: Shader School - An introduction to GLSL shaders that runs in your web browser

#34

Post by Impossible »

mhh__ wrote: post #12
pjmlp wrote: post #6

Earlier quoted context omitted.

Because neither Nintendo nor Sony consoles use any of them, so in practice there are five major shading languages. You forgot MSL. And for WebGPU, it seems like C++, Rust and HLSL had a baby named WGSL. Finally, GLSL on desktop, GL ES, WebGL and Vulkan isn't the same language anyway, just close enough to port most shaders.

FWIW A engine Dev at a Sony owned studio tells me they do have HLSL in their pipeline for their compute shaders

Playstation uses PSSL, which is basically HLSL with some slightly different semantics. It's possible to compile hlsl as pssl with a single (small) header file with some preprocessor defines in it. PSSL and HLSL are not developed in lock step though so all valid PSSL is not valid HLSL and vice a versa even without defines. It's not possible to actually get into details without breaking NDA and I haven't actively done Sony development since PS4 days (5-6 years ago)

Re: Shader School - An introduction to GLSL shaders that runs in your web browser

#35

Post by pjmlp »

dahart wrote: post #29
pjmlp wrote: post #22

Earlier quoted context omitted.

The irony is that native game development and server side rendering is where all the 3D programming fun is nowadays. Even when WebGPU eventually comes out into stable Chrome, it will take again 10 years to similar adoption, and it won't be anything more than a plain 1.0 MVP, short of many things that Vulkan, Metal and DirectX 12 Ultimate are capable of in 2021. Enjoy your pyrrhic victory.

Safari, made by Apple, was the lone holdout for WebGL2. You’re familiar with Apple’s relationship to Flash. No I won’t be surprised at all if Safari holds out on WebGPU, and it will be precisely because it offers functionality that Metal already has. > Enjoy your pyrrhic victory. I don’t understand why you’re repeatedly spending time on WebGL threads sharing sour grapes about Flash. They don’t compete. At all. WebGL…

As if WebGL and WebAssembly protect anything against abusive content creators.

Worse, they can't be be turned off, can be used for tracking analytics as well and it isn't as if shaders can't be used for mining.

Re: Shader School - An introduction to GLSL shaders that runs in your web browser

#36

Post by greggman3 »

poniko wrote: post #21
modeless wrote: post #11

Maybe this is a good place to note that with the release of Safari 15 now every major browser has WebGL 2 enabled. It's finally possible to rely on WebGL 2 without excluding iOS users. For GLSL that means you can upgrade to a new major version of the language. Some limitations on loops have been lifted, bitwise integer operations are available, as well as many other things: https://webgl2fundamentals.org/webgl/lesson…

And with the latest release of Chrome/Edge you can now tinker with WebGPU stable release.

I must be misunderstood your comment but WebGPU is has not shipped yet except behind flags and or origin trials. the specs are still changing and not done

Re: Shader School - An introduction to GLSL shaders that runs in your web browser

#37

Post by jedimastert »

sydthrowaway wrote: post #15

Very sad that none of the fragment shader experts have written a book focusing on generative art. The Book of Shaders is very basic. How to create something like this (including sound!) while thinking on a per color x,y basis is mind boggling. https://www.shadertoy.com/view/XsfXD2

Also not a book, but Sebastian Lague has some absolutely beautiful generative art

https://www.youtube.com/user/Cercopithecan

Re: Shader School - An introduction to GLSL shaders that runs in your web browser

#38

Post by doctorhandshake »

CodeArtisan wrote: post #7

https://thebookofshaders.com Still incomplete but browsable online and has its own interactive shader editor (try to click on values like floats or vectors) https://thebookofshaders.com/edit.php?log=161127202429

For anyone looking to pick up shaders for the first time, I recommend not beginning with the book of shaders. It’s an excellent introduction to a particularly heady slice of shader programming that, in my opinion, is a blind alley for folks new to shaders. I think focusing on fragment shaders rendering as full-screen quads makes the process feel more arcane and mind-shattering than it does when you consider the frag shader’s role in a 3D rendering pipeline. In the latter context, the simultaneous invocation of every frag doesn’t feel like a puzzle to solve but a reasonable part of getting pixels onscreen as part of a 3D render. For that reason I recommend newbies work on using fragments in the context of materials that include vertex and potentially compute shaders to manipulate geometry and to replicate things like phong shading or a shader-based particle system first.

Re: Shader School - An introduction to GLSL shaders that runs in your web browser

#39

Post by poniko »

greggman3 wrote: post #36
poniko wrote: post #21

Earlier quoted context omitted.

And with the latest release of Chrome/Edge you can now tinker with WebGPU stable release.

I must be misunderstood your comment but WebGPU is has not shipped yet except behind flags and or origin trials. the specs are still changing and not done

My bad it's in origin and available for tinkering nothing else, that was what I was going for.

Re: Shader School - An introduction to GLSL shaders that runs in your web browser

#40

Post by trollied »

sydthrowaway wrote: post #15

Very sad that none of the fragment shader experts have written a book focusing on generative art. The Book of Shaders is very basic. How to create something like this (including sound!) while thinking on a per color x,y basis is mind boggling. https://www.shadertoy.com/view/XsfXD2

This is the one that blew my mind: https://www.shadertoy.com/view/3lsSzf

5 hour video of its creation: https://www.youtube.com/watch?v=Cfe5UQ-1L9Q

Utterly amazing.

Post reply on HN