Async Components

[kirillsemyonkin]

If this will be not in Yew, someone should consider making an #[async_component] anyway.

---

Currently, components that support suspensions look the following way:

#[function_component]
pub fn SuspensionComponent() -> HtmlResult {
    let data = use_future(|| async { ... })?;
    Ok(html! { ... })
}

This confuses the concepts of Results and the ? operator with the actual intent of it being an awaiting action. Using that keyword instead, following code can be achieved:

#[function_component]
pub async fn SuspensionComponent() -> Html {
    let data = use_future(|| async { ... }).await;
    html! { ... }
}

This would still mean that the hook is not async and it does some kind of a weird translation from current Result to async/await. It would be much better if the future itself could be used instead:

#[function_component]
pub async fn SuspensionComponent() -> Html {
    let data = async { ... }.await;
    html! { ... }
}

• Consider hooks as well (for projects that would do this not in Yew, this would be #[async_hook]).
• I wonder if this can be solved the way Futures/Tokio solves it (Rust supports any scheduler (or whatever is correct term is) for async/await). This would probably mean that fn would be a Future then though.
• Otherwise, the solution sounds like replacing every await with ?, replacing Html with HtmlResult, replacing the whole ...await with use_future(|| ...)?, and determining that all returns (and last statement of the fn) should be wrapped in Ok.
• use_future_with would be hard to work with?
• I already know it looks like we are doing an async call every render. However, the whole way the function components look with their hooks and html! implies declarative approach, rather than imperative, as if we are connecting pieces inside its body, instead of running each line.

[kirillsemyonkin]

(& comes from the fact that it uses use_future which gives UseFutureHandle, and I just slapped an (&*...) onto it. Not sure if "Copy if possible, otherwise leave as &" is possible currently.)

[futursolo]

The current suspension not being async fn is by-design.

1. Every component when it renders, requires to re-run all hooks from the beginning to make sure the states are up-to-date. However, an await will resume from the point it is being awaited after an await, which could results in outdated states.

2. Suspensions are easily discardable and can be done immediately. Aborting a Future is much harder. Sometimes, we do not wait until an await complete before another render. However, async fn means, when it is awaited, it will continue to hold mutable reference to hook states, which prevents any future rendering triggered by other states.