Do we need to use closures for reactivity?

[allurefx]

Guys, thanks for Leptos, I think it's evolving into a great framework option for Rust folks. I'm currently re-doing an app and trying to decide between Sycamore and Leptos. I prefer Leptos (seemingly better performance, JSX syntax, no lifetime/pointers for signals, props without having explicitly define them as struct, etc.). However, there is one feature of Sycamore that seems cleaner, and that WRT reactivity is using just the signal rather than having to use closures. I'm brand new to both, so could you please confirm I must use closures if I want reactivity, like in the example below? If yes, is it possible for you to remove that requirement because that would improve the dev experience? I also posted this in Reddit. Thanks!

Oh, also, why do we need that extra div to enclose the code snippet? I don't need it in Sycamore, but if I remove it in Leptos, I get an error. Could you be newbie error though.

Leptos version

    mount_to_body(|cx| {
        let login = create_rw_signal(cx, false);
        let ready = create_memo(cx, move |_| login.get());
        view! {cx,
            <div>
                {move || {
                    if ready.get() {
                        view! {cx, <Setup/>}
                    } else {
                        view! {cx, <Login login=login/>}
                    }
                }}
            </div>
        }
    })

Sycamore version

    sycamore::render(|cx| {
        let login = create_signal(cx, false);
        let ready = create_selector(cx, || *login.get());
        view! {cx,
            (if *ready.get() {
                view! {cx, Setup()}
            } else {
                view! {cx, Login(login=login)}
            })
        }
    });

[gbj]

If I understand correctly, Sycamore adds a special extra syntax of "wrap something in parentheses for it to be reactive." If you look at your code example, you'll see that the thing that's wrapped in a closure in Leptos is wrapped in parentheses in Sycamore.

The "needing to wrap in a <div>" thing is a limitation of the 0.0 versions that will go away in 0.1.0, which is currently in alpha (you can find it on crates.io as 0.1.0-alpha)

If you use Discord, we do have a Discord server (see link in the Readme). I do read the Rust Reddit occasionally but won't see help requests like this on Reddit.

[allurefx]

OK, thanks for the reply. My question was on having to use the extra closure specifically, which Sycamore doesn't need. I.e., could we do something like below in Leptos (without the extra closure to enclose the code snippet)?

        view! {cx,
                {
                    if ready.get() {
                        view! {cx, <Setup/>}
                    } else {
                        view! {cx, <Login login=login/>}
                    }
                }
        }

instead of

        view! {cx,
                {move || {
                    if ready.get() {
                        view! {cx, <Setup/>}
                    } else {
                        view! {cx, <Login login=login/>}
                    }
                }}
        }

[gbj]

I understand your question.

A component, in either Sycamore or Leptos, only runs once. So if you remove the extra closure in Leptos, it will run your code once, and not update reactively. The closure says "here is something—a function—that can run multiple times. Rerun it reactively." The view macro doesn't actually need a closure in particular — it will create reactive changes for any function — a closure is just the way to define a function inline like this.

Sycamore is doing the same exact thing, but by introducing its own special syntax to define a closure that will rerun by wrapping in parentheses ( ... ), rather than using normal Rust closure syntax move || { ... }

Do you see what I mean?

[allurefx]

Yeah, that's what I figured, thanks for confirming. I guess my question was if Leptos can simplify the syntax like Sycamore does so we don't need to use closures to get reactivity. IMO it gets a bit tedious and busy if we need closures just to identify a reactive section. Just a thought and suggestion, I like Leptos and wanted to give input as a dev. I may also be able to help out with this or other features a bit, I think you have a great thing going here with a lot of potential. I'll definitely try out the 0.1 alpha.