sokmastr

If the animation engine is capable of smoothly changing a value in JS, I think it would already integrate very well with Svader.

The way the reactive rerendering works, is that every time a change in the input parameters is detected it queues a requestAnimationFrame, so yes, it follows the browser refresh rate.

Since Svelte 5 is automatically able to track changes in values, both by reassignment as well as object mutation, anything that changes a value -- no matter if it's designed for Svelte or not -- should be able to integrate smoothly.

Yeah, I've been made aware that the examples don't work on iOS. I'm guessing there's a single underlying error that's messing with the navigation etc. since I believe SvelteKit does some JS-based optimizations around navigation. I'll have to look into this. Thanks for reporting!

That's weird since this very much is a completely plain <ul>. What OS and browser are you using? Which example is slow?

I haven't thought about it, but I'm open to the idea. What kind of animation engines do you have in mind?

Yes, the absence of 3D is very much a choice. I believe this need is already covered pretty well by existing libraries like three.js and threlte etc. These are relatively large and complex to use, because you essentially have to adopt the mental model of having a whole 3D scene or something like that. With Svader, the mental model is just that you have a canvas with an attached fragment shader, which paints the canvas with respect to some input parameters.

Talking about the slider specifically, I'm of course not advocating for going out and rewriting all sliders using shaders.

This is just an example of a place where you can use a shader to create a cool, interactive visual effect.

On the example site I've implemented the slider as a regular HTML slider element, and using a canvas to replace its visual appearance. Doing something like this, I don't believe there's anything in the way of getting all the accessibility benefits of a regular slider element, though I could be wrong, I'm no expert by any means.

Really cool idea with doing it as a web component.

There's also Pocket Shader which is pure JS: https://github.com/braebo/pocket-shader

Strange. I'll have to look into this.

Thanks for letting me know!

Even the the example at svader.vercel.app/hello-world/webgl/? Testing on the Safari browsers is currently a TODO, and the library is in general still experimental when it comes to wider browser support, but I would have expected at least the standard WebGL examples to work. Does it at least display the "WebGL not supported" message?