Shaders, WebGPU Components for React, Vue, Svelte, Solid, JavaScript and Framer

I am on a $3k Macbook and scrolling on shaders.com yielded a few frames of blank screen jank before the rest of the page rendered. This is unacceptable performance for serious websites, but I appreciate the new heights that webshit attains each year.

I'm genuinely curious — do people really prefer this HTML-style syntax like

  <LinearGradient colorA="#0f172a" colorB="#7c3aed" />
  <CursorTrail />

  <a-scene>
      <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box>
      <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere>
  </a-scene>

20 years ago front-end devs really took that "front-end is not real programming" statement personally...

All of this could have been avoided had we just gotten a "good job" and a pat on the back when we showed our jquery scripts!

Jokes aside, looks impressive!

The overuse of abstract decorative shaders is a great example of where LLMs work well to implement a previously niche and inaccessible form of programming where the results can be imperfect yet good enough and then easily fine-tuned with dials by a non-expert.

These are the new signature of an LLM generated SaaS product landing page, bonus points for the visualization subtly changing based on your mouse position.

I do love shaders, but not on my web pages where I usually just want to read some text.

Sites with these things inevitably turn into a massive jank fest unless you're running the latest supercomputer, and even then that can sometimes not be enough.

It's unclear where the boundary is between the open source repo and the paid product. Which is which and can the repo be used without the product?

[flagged]