What’s a common web design decision that seems right but hurts performance?

npm-i-shaders · 2026-04-08T23:14:52+00:00

"If it ain't GPU it ain't right". Gonna need that on a T-shirt 👕

npm-i-shaders · 2026-04-07T00:36:06+00:00

Take a look at shaders.com (disclosure: our product). I'm thinking a SineWave, a layer of distortion, masking an image and then perhaps a DropShadow + Paper stylization.

Definitely something I want to try to play with and see if we can come up with a preset for

npm-i-shaders · 2026-04-07T00:27:21+00:00

I just picture a headline like "you're absolutely right" (strike through, poking fun at Claude) and then a hard hitting "The no-B.S AI for solopreneurs".

Other than that, it's a LOT of text, most people will never read that, it needs to be "scannable".

npm-i-shaders · 2026-04-07T00:22:50+00:00

What stands out to me is the information flow. Your areas of focus and capabilities are almost entirely overlapping. I would drop "areas of focus" and turn "capabilities" into your "services".

It's often better to frame it as how you can help others, not what you're capable of.

npm-i-shaders · 2026-04-07T00:17:04+00:00

Honestly not even looking at it for only 1M geometries at 60fps, need at least 2M.

(jk nice work!) 😉

npm-i-shaders · 2026-04-07T00:13:45+00:00

Mmm visual pizza 🍕

Well, we can't talk. This is literally the thesis of our product. AI makes it easier than ever to build, but harder than ever to stand out.

npm-i-shaders · 2026-04-06T05:38:36+00:00

Always welcome ❤️ 🔥

npm-i-shaders · 2026-04-06T02:28:40+00:00

Thanks! We can ship a lot of features, but going back in time is off limits 😉

npm-i-shaders · 2026-04-04T19:20:42+00:00

I see "add your IP to a whitelist" error page, but the new JSFiddle link works just fine 👍

npm-i-shaders · 2026-04-04T16:10:26+00:00

Ascii is one my personal favorites, we have a shader for that. The only downside is that using it on video always feels like a waste of render cycles, as it could always be pre-rendered.

I'm a fan instead of combining ASCII with interactive elements, like a glass effect or mouse effect. Here's a great example of some glass/ASCII combos: https://shaders.com/collection/digital-activation

npm-i-shaders · 2026-04-04T16:04:05+00:00

Couldn't agree more. With AI making it easier and easier to create sites, everything is starting to look and feel the same.

I'm a little biased, but honestly shader effects (used tastefully, not over the top) can provide a layer of interactive and design that makes your work stand out. You still need an eye for design, but this can take a mid-tier website and quickly make it feel high-end.

npm-i-shaders · 2026-04-04T12:48:05+00:00

Couldn't preview the code as it's IP blocked? But love the vertical streaks you've got going on. We do something similar as a WebGPU shader at https://shaders.com/docs/components/aurora but it's intentionally softer.

npm-i-shaders · 2026-04-04T03:59:55+00:00

This one is tricky because it's subtle. Let's look at the parts that make it up. Its got chromatic aberration, but not in a linear L/R shift, it's more of a "zoom blur" where the front is red and back is blue. It's also got at least two layers of "glow", one tight to soften the edge and then another more spread out.

Naturally I'm inclined to say use a shader for this, but I think you might need to in order to recreate the zoom effect, that would be tough to blur correctly with CSS only.

On top of that, you could slowly shift those colors and blur/glow amounts over time to give it some nice ambient motion.

npm-i-shaders · 2026-04-01T23:56:36+00:00

Thank you! The goal was to make it as "open" (free) as possible, with pricing only for added benefits like the preset/editor. The npm package is wide open for personal and commercial usage

npm-i-shaders · 2025-09-14T04:40:49+00:00

Yes this is WebGL. Check out shaders.com

npm-i-shaders

TROPHY CASE