Rendered at 23:33:07 GMT+0000 (Coordinated Universal Time) with Cloudflare Workers.
Benjamin_Dobell 13 hours ago [-]
Professional looking product / page. However, the shaders themselves are extremely odd. They're just swirling patterns. I think the creator of this would do well to look at games for inspiration. Games use shaders for all sorts of effects, for a reason.
In particular, I'd expect there to be shaders making use of textures. I was expecting buttons with a laser finished metallic look that actually changes with lighting on the page. Or hero images that combine photography with masks to produce interesting effects highlighting products with auras etc. These all appear to be screensavers.
392 14 hours ago [-]
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.
pjmlp 12 hours ago [-]
The history of Web 3D APIs since their inception, regardless of the platform.
As the websites have no control what the browser does, it is a guessing game on how they actually perform on the client side, versus native applications that can work around possible bugs or various kinds of available hardware.
11 hours ago [-]
afavour 11 hours ago [-]
Personally (on Safari) I see the whole page load then the shaders appear after a short delay. Not ideal and I imagine possible to mitigate with loading a static image in the HTML then replacing it once the JS kicks in.
DJBunnies 8 hours ago [-]
A few frames?
The horrors.
samstress 15 hours ago [-]
I'm genuinely curious — do people really prefer this HTML-style syntax like
I appreciate that React & Co. have established it as a standard. I've used A-Frame lately, which lets you build WebVR components, and even there you declare your scene as
and I feel this is getting a bit much. Wouldn't it be better to have a JS API that lets you define objects and properties and compose your shader / scene etc. programmatically? (I've seen that Shaders offers that too — just asking in principle.)
drawfloat 14 hours ago [-]
Personally I don't mind it, but would say the main advantages offered by JSX for this kind of work (see: React Three Fiber) are more in its ease of composition and structuring larger projects.
Often in R3F projects you'll end up running per frame animations via the normal declarative property API in the useFrame hook anyway, as adjusting props in a loop is not great for performance. The JSX instead becomes a way to easily understand the hierarchy and nesting of objects, as well as quickly mount/unmount new elements.
mejutoco 13 hours ago [-]
It would be nice to (additionally) be able to load json in html without javascript (I am aware it is js object notation) for the same data. This way you could see it in a clean data structure and not serialized. Maybe using https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/... or similar?
afavour 11 hours ago [-]
I personally find it to be more readable, it gets rid of repeated syntax, adding children to parents, etc etc. But I think it's really a matter of personal preference.
LtdJorge 13 hours ago [-]
I prefer it to be declarative
jackb4040 9 hours ago [-]
I do hobby work in Three.js and have always felt more comfortable using the declarative scene.add()-style API to manage my scene vs fiber / reactive stuff. But I imagine I'd feel differently if I were making 3d components tightly integrated with the state of the rest of a normal react app, rather than a fully immersive game scene.
I'm glad both apis exist.
monocasa 13 hours ago [-]
> Used on thousands of websites by 16,000+ design engineers.
With a repo who's initial commit was a week ago?
Gisbitus 13 hours ago [-]
Reading their landing page, the product was only recently open-sourced, so I believe that explains the mismatch.
jackb4040 9 hours ago [-]
Open sourced by whom? Was this a standalone company or a spinoff of Figma or something? I imagine they must have been making serious money to afford that domain.
soltanov 11 hours ago [-]
Screensavers dont fix boring products. If you must add eye candy without melting client laptops, standard CSS transforms or PixiJS deliver 90% of the visual payoff .
Zopieux 10 hours ago [-]
Thank you.
dabinat 14 hours ago [-]
These are very cool visually but I’m honestly struggling to imagine ways to use this without it being a gimmick.
totetsu 14 hours ago [-]
When you want to so something visually intensive, its a much less computationally intense to use shaders than do everything in vanilla JS, so you can get faster render times or realtime performance.
for example I was playing around with visualizations of Turing patterns and Drost images.
tommica 16 hours ago [-]
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!
preommr 12 hours ago [-]
It feels like I am one of the last people without WebGPU.
I am on linux/chrome and it still isn't enabled by default yet.
exceptione 14 hours ago [-]
If the demos don't work, your browser works as it should because it is blocking third-party cookies and the site does not serve valid CORS headers for ev.shaders.com.
mavbo 17 hours ago [-]
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.
m00dy 17 hours ago [-]
how about wasting gpu and cpu ?
asdf88990 16 hours ago [-]
I hate aislop as much as the next graybears but beauty and design matters, and just as important is respecting, if not understanding, that subjective nature of it.
CPU and GPU in the service of visuals are far more well spent than bombing and spying on people, for example
nottorp 12 hours ago [-]
> CPU and GPU in the service of visuals are far more well spent
... thank you for not caring about my battery.
bschwindHN 15 hours ago [-]
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.
etienne_l 15 hours ago [-]
[flagged]
11 hours ago [-]
11 hours ago [-]
popalchemist 18 hours ago [-]
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?
Gisbitus 13 hours ago [-]
I'm not 100% sure, but I think that the entire toolbox is open source, whereas some presets and pre-made components are still behind the paywall.
So, in theory, nothing is stopping you from recreating them from scratch.
In particular, I'd expect there to be shaders making use of textures. I was expecting buttons with a laser finished metallic look that actually changes with lighting on the page. Or hero images that combine photography with masks to produce interesting effects highlighting products with auras etc. These all appear to be screensavers.
As the websites have no control what the browser does, it is a guessing game on how they actually perform on the client side, versus native applications that can work around possible bugs or various kinds of available hardware.
The horrors.
Often in R3F projects you'll end up running per frame animations via the normal declarative property API in the useFrame hook anyway, as adjusting props in a loop is not great for performance. The JSX instead becomes a way to easily understand the hierarchy and nesting of objects, as well as quickly mount/unmount new elements.
I'm glad both apis exist.
With a repo who's initial commit was a week ago?
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!
I am on linux/chrome and it still isn't enabled by default yet.
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.
CPU and GPU in the service of visuals are far more well spent than bombing and spying on people, for example
... thank you for not caring about my battery.
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.
So, in theory, nothing is stopping you from recreating them from scratch.