Last week we released SolidJS 1.0. A JavaScript framework built on a foundation of ideas long ago dismissed, that accomplishes what some thought to...
For further actions, you may consider blocking this person and/or reporting abuse
Does solid have a good animation framework? I'm thinking of creating an integration for @okikio/animate.
@okikio/animateis an animation library that uses the Web Animation API (you can read more about it on CSS-Tricks). While going through Solid's docs I remember seeing a demo that used the Web Animation API, so, I thought it might be a good idea. The problem is that I'm rather inexperienced with using reactive frameworks, so, I'm not sure how I should go ahead designing an animation framework for solidjs?This a bit of an aside but solidjs's
createResourcemethod is difficult to use for asynchronous tasks that aren't fetch operations, it was the main reason I had to abandon using solidjs for one my projects, namely bundle.js.org.bundle.js.orghad a web worker to handle building and bundling but I found it difficult to setup an asynchronous loading system for when building and bundling was done within the worker.Just for motivation: I think it would be a great thing if the solidjs ecosystem has a flexible, tailored and capable js animation lib (or bindings) which is at least for me something very important for a mobile-focused pwa.
For the syntax: this is something to explore but I do like framer-motions syntax for the most parts which would translate to e.g. "create_" reactive constructs for interpolation/motions. I'm too new to solid to even have any idea how a good approach would look like and there is probably a ton of other stuff to figure out.
Additionally - I'm no animation expert at all (I guess this became clear in the first two paragraphs). Just someone who has used react with motion for some apps. But I do wonder if/how stuff like
<AnimatePresence />is feasible with solidjs?
I think so, I was discussing @okikio/animate with @mattgperry (the creator of Motion & Framer) yesterday, I'll ask for his opinion on solid js.
I did a quick port of Transition Groups like you find in Vue or React. But I haven't anything nice to that scale. I think currently it is a hole so I'd love to see work done in this area.
Random thought: could it be possible to move animations to dom-expressions, and let people hook into it with different libs (f.e. Tween.js, Anime.js, Green Sock, etc).
Maybe.. but unclear what the hooks are. It's possible with the right understanding we could atleast animate native elements. I just don't know what the right solution would look like.
Should I aim for a react-motion like syntax or aim for a custom one for solid js?
Honestly, I'd defer to anyone who has the experience of using these libraries for what makes the most sense. Animation is a weakspot for me. I've always leveraged mostly manual CSS techniques etc and focused more on the mechanics of features than the polish working on large long running projects. I often delegated animations to other developers on my team. So my opinion on animation wrappers is limited.
Ok, thanks
You can use motion one - motion.dev/solid/quick-start
Hi, do you have a written article on how HMR in Solid.js implemented?
Since Solid component return DOMNode instead of VNode, I wonder if I can borrow some ideas to make HMR works with ECS pattern 🤔 (commonly use in real-time game and simulator)
HMR is quite possibly the most difficult problem Ive come across for the fine-grained approach(yes harder than Suspense and Concurrent Rendering). Its harder than hydration since no expectation of things matching. So I consider the solution incomplete. Solid only preserves state above the change. Even Svelte's HMR which does preserve the state blows out nested elements when I last checked. This is a place where VDOM diffing has an easier time.
Should have asked you about HMR :)
Of course you called your creation "solid". Great job Ryan!
Thanks, Emily. Naming is hard. I went the lazy way the same way I did with my band name.