Migration Guide: v0.7 to v0.8

Before migrating, make sure to run rustup update.

Sycamore v0.8 relies heavily on the “non-lexical lifetimes” (NLL) feature that was recently stabilized. As a result, the Minimum Supported Rust Version (MSRV) has been updated from 1.53 to 1.63.

The major changes introduced in v0.8 are described below. There are many further small changes that are not described here.

Reactivity

Reactivity has been completely overhauled to be more ergonomic. Check out Reactivity in the updated book and the Reactivity v2 blog post for more information.

Components

#[component] macro

The #[component] macro no longer takes the name of the component as a parameter. Instead, the name of the component is the function itself. As such, it is now idiomatic to name component functions in PascalCase.

// Old v0.7 syntax.
#[component(MyComponent<G>)]
fn my_component(props: MyProps) -> View<G> { ... }

// New v0.8 syntax.
#[component]
fn MyComponent<G: Html>(props: MyProps) -> View<G> { ... }

Component arguments and children

Component arguments and children should now be passed using the same syntax as elements.

// Old v0.7 syntax.
view! {
    MyComponent(MyProps {
        foo: true,
        bar: "abc",
        children: view! { ... }
    })
}

// New v0.8 syntax.
view! { cx,
    MyComponent(foo=true, bar="abc") {
        ...
    }
}

Empty elements

Empty elements must now be followed by an empty block.

// Old v0.7 syntax.
view! {
    br
}

// New v0.8 syntax.
view! { cx,
    br {}
}

Builder API

The builder API has been rebuilt from the ground up. Check out the book for more information on migrating.

Keyed and Indexed props

The template prop has been renamed to view.

// Old v0.7 syntax.
Keyed(KeyedProps {
    iterable: count.handle(),
    template: |x| view! {
        li { (x) }
    },
    key: |x| *x,
})

// New 0.8 syntax.
Keyed(
    iterable=count,
    view=|cx, x| view! { cx,
        li { (x) }
    },
    key=|x| *x,
)

Feature Flags

Some of the feature flags have been removed/renamed:

• experimental-builder-agnostic and experimental-builder-html has been removed since they are available by default.
• experimental-hydrate is now hydrate.
• dom is now web.
• futures is now suspense.

Be sure to make the according changes to your Cargo.toml.