dioxus/packages/core/src/virtual_dom.rs

342 lines
14 KiB
Rust
Raw Normal View History

2021-05-16 06:06:02 +00:00
//! # VirtualDOM Implementation for Rust
//! This module provides the primary mechanics to create a hook-based, concurrent VDOM for Rust.
//!
//! In this file, multiple items are defined. This file is big, but should be documented well to
//! navigate the innerworkings of the Dom. We try to keep these main mechanics in this file to limit
//! the possible exposed API surface (keep fields private). This particular implementation of VDOM
//! is extremely efficient, but relies on some unsafety under the hood to do things like manage
2021-05-18 05:16:43 +00:00
//! micro-heaps for components. We are currently working on refactoring the safety out into safe(r)
//! abstractions, but current tests (MIRI and otherwise) show no issues with the current implementation.
2021-05-16 06:06:02 +00:00
//!
//! Included is:
//! - The [`VirtualDom`] itself
//! - The [`Scope`] object for mangning component lifecycle
//! - The [`ActiveFrame`] object for managing the Scope`s microheap
//! - The [`Context`] object for exposing VirtualDOM API to components
2021-07-01 18:14:59 +00:00
//! - The [`NodeFactory`] object for lazyily exposing the `Context` API to the nodebuilder API
2021-05-16 06:06:02 +00:00
//! - The [`Hook`] object for exposing state management in components.
//!
//! This module includes just the barebones for a complete VirtualDOM API.
//! Additional functionality is defined in the respective files.
use crate::innerlude::*;
2021-08-15 14:13:03 +00:00
use futures_util::{pin_mut, Future, FutureExt};
use std::{
any::{Any, TypeId},
pin::Pin,
};
2021-07-09 05:36:18 +00:00
2021-02-03 07:26:04 +00:00
/// An integrated virtual node system that progresses events and diffs UI trees.
/// Differences are converted into patches which a renderer can use to draw the UI.
///
///
///
///
///
///
///
pub struct VirtualDom {
2021-02-03 07:26:04 +00:00
/// All mounted components are arena allocated to make additions, removals, and references easy to work with
2021-03-05 04:57:25 +00:00
/// A generational arena is used to re-use slots of deleted scopes without having to resize the underlying arena.
2021-05-15 16:03:08 +00:00
///
/// This is wrapped in an UnsafeCell because we will need to get mutable access to unique values in unique bump arenas
/// and rusts's guartnees cannot prove that this is safe. We will need to maintain the safety guarantees manually.
2021-08-22 21:08:25 +00:00
pub shared: SharedResources,
2021-05-16 06:06:02 +00:00
/// The index of the root component
2021-05-18 05:16:43 +00:00
/// Should always be the first (gen=0, id=0)
2021-08-09 21:09:33 +00:00
base_scope: ScopeId,
2021-03-29 16:31:47 +00:00
scheduler: Scheduler,
2021-08-08 19:15:16 +00:00
// for managing the props that were used to create the dom
#[doc(hidden)]
_root_prop_type: std::any::TypeId,
#[doc(hidden)]
_root_props: std::pin::Pin<Box<dyn std::any::Any>>,
2021-02-03 07:26:04 +00:00
}
impl VirtualDom {
/// Create a new VirtualDOM with a component that does not have special props.
2021-05-16 06:06:02 +00:00
///
/// # Description
2021-05-16 06:06:02 +00:00
///
/// Later, the props can be updated by calling "update" with a new set of props, causing a set of re-renders.
2021-05-16 06:06:02 +00:00
///
/// This is useful when a component tree can be driven by external state (IE SSR) but it would be too expensive
/// to toss out the entire tree.
2021-05-16 06:06:02 +00:00
///
///
/// # Example
/// ```
/// fn Example(cx: Context<SomeProps>) -> VNode {
2021-06-26 01:15:33 +00:00
/// cx.render(rsx!{ div{"hello world"} })
2021-05-16 06:06:02 +00:00
/// }
///
/// let dom = VirtualDom::new(Example);
/// ```
///
/// Note: the VirtualDOM is not progressed, you must either "run_with_deadline" or use "rebuild" to progress it.
2021-06-23 05:44:48 +00:00
pub fn new(root: FC<()>) -> Self {
Self::new_with_props(root, ())
2021-02-03 07:26:04 +00:00
}
/// Create a new VirtualDOM with the given properties for the root component.
///
/// # Description
///
2021-02-03 07:26:04 +00:00
/// Later, the props can be updated by calling "update" with a new set of props, causing a set of re-renders.
///
/// This is useful when a component tree can be driven by external state (IE SSR) but it would be too expensive
/// to toss out the entire tree.
2021-05-16 06:06:02 +00:00
///
///
/// # Example
/// ```
/// fn Example(cx: Context<SomeProps>) -> VNode {
2021-06-26 01:15:33 +00:00
/// cx.render(rsx!{ div{"hello world"} })
2021-05-16 06:06:02 +00:00
/// }
///
/// let dom = VirtualDom::new(Example);
/// ```
///
/// Note: the VirtualDOM is not progressed, you must either "run_with_deadline" or use "rebuild" to progress it.
2021-06-23 05:44:48 +00:00
pub fn new_with_props<P: Properties + 'static>(root: FC<P>, root_props: P) -> Self {
let components = SharedResources::new();
let root_props: Pin<Box<dyn Any>> = Box::pin(root_props);
let props_ptr = root_props.as_ref().downcast_ref::<P>().unwrap() as *const P;
2021-05-16 06:06:02 +00:00
2021-05-18 05:16:43 +00:00
let link = components.clone();
2021-06-07 18:14:49 +00:00
let base_scope = components.insert_scope_with_key(move |myidx| {
let caller = NodeFactory::create_component_caller(root, props_ptr as *const _);
2021-08-22 21:08:25 +00:00
let name = type_name_of(root);
Scope::new(caller, myidx, None, 0, ScopeChildren(&[]), link, name)
});
2021-02-07 22:38:17 +00:00
2021-03-11 17:27:01 +00:00
Self {
2021-05-16 06:06:02 +00:00
base_scope,
_root_props: root_props,
2021-08-10 05:21:13 +00:00
scheduler: Scheduler::new(components.clone()),
shared: components,
2021-03-11 17:27:01 +00:00
_root_prop_type: TypeId::of::<P>(),
}
}
2021-02-03 07:26:04 +00:00
2021-08-06 02:23:41 +00:00
pub fn base_scope(&self) -> &Scope {
2021-08-24 19:12:20 +00:00
self.shared.get_scope(self.base_scope).unwrap()
2021-08-06 02:23:41 +00:00
}
pub fn get_scope(&self, id: ScopeId) -> Option<&Scope> {
2021-08-24 19:12:20 +00:00
self.shared.get_scope(id)
2021-08-06 02:23:41 +00:00
}
2021-05-18 05:16:43 +00:00
/// Performs a *full* rebuild of the virtual dom, returning every edit required to generate the actual dom rom scratch
///
/// The diff machine expects the RealDom's stack to be the root of the application
2021-08-06 02:23:41 +00:00
///
/// Events like garabge collection, application of refs, etc are not handled by this method and can only be progressed
2021-08-22 21:08:25 +00:00
/// through "run". We completely avoid the task scheduler infrastructure.
2021-08-24 19:12:20 +00:00
pub fn rebuild<'s>(&'s mut self) -> Mutations<'s> {
2021-08-22 21:08:25 +00:00
let mut fut = self.rebuild_async().boxed_local();
loop {
if let Some(edits) = (&mut fut).now_or_never() {
break edits;
}
}
}
/// Rebuild the dom from the ground up
2021-08-24 19:12:20 +00:00
///
/// This method is asynchronous to prevent the application from blocking while the dom is being rebuilt. Computing
/// the diff and creating nodes can be expensive, so we provide this method to avoid blocking the main thread. This
/// method can be useful when needing to perform some crucial periodic tasks.
pub async fn rebuild_async<'s>(&'s mut self) -> Mutations<'s> {
2021-08-09 21:09:33 +00:00
let mut diff_machine = DiffMachine::new(Mutations::new(), self.base_scope, &self.shared);
2021-08-23 14:43:49 +00:00
let cur_component = self
.shared
.get_scope_mut(self.base_scope)
.expect("The base scope should never be moved");
2021-06-03 17:57:41 +00:00
2021-08-20 15:39:13 +00:00
// // We run the component. If it succeeds, then we can diff it and add the changes to the dom.
2021-08-21 17:24:47 +00:00
if cur_component.run_scope().is_ok() {
diff_machine
.stack
.create_node(cur_component.frames.fin_head(), MountType::Append);
2021-08-24 19:12:20 +00:00
diff_machine.work().await;
2021-08-21 17:24:47 +00:00
} else {
// todo: should this be a hard error?
log::warn!(
"Component failed to run succesfully during rebuild.
This does not result in a failed rebuild, but indicates a logic failure within your app."
);
}
2021-05-16 06:06:02 +00:00
2021-08-24 19:12:20 +00:00
diff_machine.mutations
}
pub fn diff_sync<'s>(&'s mut self) -> Mutations<'s> {
let mut fut = self.diff_async().boxed_local();
loop {
if let Some(edits) = (&mut fut).now_or_never() {
break edits;
}
}
}
2021-03-05 20:02:36 +00:00
2021-08-24 19:12:20 +00:00
pub async fn diff_async<'s>(&'s mut self) -> Mutations<'s> {
2021-08-21 17:24:47 +00:00
let mut diff_machine = DiffMachine::new(Mutations::new(), self.base_scope, &self.shared);
2021-08-23 14:43:49 +00:00
let cur_component = self
.shared
.get_scope_mut(self.base_scope)
2021-08-21 17:24:47 +00:00
.expect("The base scope should never be moved");
2021-08-22 21:08:25 +00:00
cur_component.run_scope().unwrap();
2021-08-21 17:24:47 +00:00
2021-08-23 14:43:49 +00:00
diff_machine.stack.push(DiffInstruction::DiffNode {
2021-08-22 21:08:25 +00:00
old: cur_component.frames.wip_head(),
new: cur_component.frames.fin_head(),
});
2021-08-24 19:12:20 +00:00
diff_machine.work().await;
2021-08-21 17:24:47 +00:00
2021-08-24 19:12:20 +00:00
diff_machine.mutations
2021-08-21 17:24:47 +00:00
}
2021-08-22 21:08:25 +00:00
2021-08-08 19:15:16 +00:00
/// Runs the virtualdom immediately, not waiting for any suspended nodes to complete.
///
/// This method will not wait for any suspended nodes to complete.
2021-08-24 19:12:20 +00:00
pub fn run_immediate<'s>(&'s mut self) -> Mutations<'s> {
2021-08-18 02:25:09 +00:00
todo!()
// use futures_util::FutureExt;
// let mut is_ready = || false;
// self.run_with_deadline(futures_util::future::ready(()), &mut is_ready)
// .now_or_never()
// .expect("this future will always resolve immediately")
2021-08-08 19:15:16 +00:00
}
2021-08-06 02:23:41 +00:00
2021-08-08 19:15:16 +00:00
/// Runs the virtualdom with no time limit.
///
/// If there are pending tasks, they will be progressed before returning. This is useful when rendering an application
/// that has suspended nodes or suspended tasks. Be warned - any async tasks running forever will prevent this method
/// from completing. Consider using `run` and specifing a deadline.
2021-08-24 20:29:10 +00:00
pub async fn run_unbounded<'s>(&'s mut self) -> Mutations<'s> {
self.run_with_deadline(async {}).await.unwrap()
2021-02-24 08:51:26 +00:00
}
2021-08-09 21:09:33 +00:00
/// Run the virtualdom with a deadline.
2021-08-08 19:15:16 +00:00
///
/// This method will progress async tasks until the deadline is reached. If tasks are completed before the deadline,
/// and no tasks are pending, this method will return immediately. If tasks are still pending, then this method will
/// exhaust the deadline working on them.
///
/// This method is useful when needing to schedule the virtualdom around other tasks on the main thread to prevent
/// "jank". It will try to finish whatever work it has by the deadline to free up time for other work.
///
2021-08-09 17:17:19 +00:00
/// Due to platform differences in how time is handled, this method accepts a future that resolves when the deadline
/// is exceeded. However, the deadline won't be met precisely, so you might want to build some wiggle room into the
/// deadline closure manually.
2021-08-08 19:15:16 +00:00
///
2021-08-09 21:09:33 +00:00
/// The deadline is polled before starting to diff components. This strikes a balance between the overhead of checking
2021-08-08 19:15:16 +00:00
/// the deadline and just completing the work. However, if an individual component takes more than 16ms to render, then
/// the screen will "jank" up. In debug, this will trigger an alert.
///
2021-08-09 17:17:19 +00:00
/// If there are no in-flight fibers when this method is called, it will await any possible tasks, aborting early if
/// the provided deadline future resolves.
///
/// For use in the web, it is expected that this method will be called to be executed during "idle times" and the
/// mutations to be applied during the "paint times" IE "animation frames". With this strategy, it is possible to craft
/// entirely jank-free applications that perform a ton of work.
///
2021-08-08 19:15:16 +00:00
/// # Example
///
/// ```no_run
2021-08-09 17:17:19 +00:00
/// static App: FC<()> = |cx| rsx!(in cx, div {"hello"} );
/// let mut dom = VirtualDom::new(App);
2021-08-08 19:15:16 +00:00
/// loop {
2021-08-09 17:17:19 +00:00
/// let deadline = TimeoutFuture::from_ms(16);
2021-08-08 19:15:16 +00:00
/// let mutations = dom.run_with_deadline(deadline).await;
/// apply_mutations(mutations);
/// }
/// ```
2021-08-09 21:09:33 +00:00
///
/// ## Mutations
///
/// This method returns "mutations" - IE the necessary changes to get the RealDOM to match the VirtualDOM. It also
/// includes a list of NodeRefs that need to be applied and effects that need to be triggered after the RealDOM has
/// applied the edits.
///
/// Mutations are the only link between the RealDOM and the VirtualDOM.
2021-08-08 19:15:16 +00:00
pub async fn run_with_deadline<'s>(
&'s mut self,
2021-08-10 16:16:49 +00:00
deadline: impl Future<Output = ()>,
2021-08-24 20:29:10 +00:00
) -> Option<Mutations<'s>> {
2021-08-15 14:13:03 +00:00
let mut committed_mutations = Mutations::new();
let mut deadline = Box::pin(deadline.fuse());
2021-08-09 06:37:11 +00:00
2021-08-15 14:13:03 +00:00
// TODO:
// the scheduler uses a bunch of different receivers to mimic a "topic" queue system. The futures-channel implementation
// doesn't really have a concept of a "topic" queue, so there's a lot of noise in the hand-rolled scheduler. We should
// explore abstracting the scheduler into a topic-queue channel system - similar to Kafka or something similar.
2021-08-10 05:21:13 +00:00
loop {
2021-08-15 14:13:03 +00:00
// Internalize any pending work since the last time we ran
self.scheduler.manually_poll_events();
2021-08-10 16:16:49 +00:00
2021-08-15 14:13:03 +00:00
// Wait for any new events if we have nothing to do
if !self.scheduler.has_any_work() {
self.scheduler.clean_up_garbage();
2021-08-10 16:16:49 +00:00
let deadline_expired = self.scheduler.wait_for_any_trigger(&mut deadline).await;
2021-08-10 05:21:13 +00:00
2021-08-10 16:16:49 +00:00
if deadline_expired {
2021-08-24 20:29:10 +00:00
return Some(committed_mutations);
2021-08-09 17:17:19 +00:00
}
}
2021-08-09 06:37:11 +00:00
2021-08-15 14:13:03 +00:00
// Create work from the pending event queue
2021-08-24 20:29:10 +00:00
self.scheduler.consume_pending_events();
2021-08-15 14:13:03 +00:00
// Work through the current subtree, and commit the results when it finishes
// When the deadline expires, give back the work
2021-08-18 02:25:09 +00:00
match self.scheduler.work_with_deadline(&mut deadline) {
2021-08-15 14:13:03 +00:00
FiberResult::Done(mut mutations) => {
committed_mutations.extend(&mut mutations);
/*
quick return if there's no work left, so we can commit before the deadline expires
When we loop over again, we'll re-wait for any new work.
I'm not quite sure how this *should* work.
It makes sense to try and progress the DOM faster
*/
if !self.scheduler.has_any_work() {
2021-08-24 20:29:10 +00:00
return Some(committed_mutations);
2021-08-15 14:13:03 +00:00
}
2021-08-10 16:16:49 +00:00
}
2021-08-24 20:29:10 +00:00
FiberResult::Interrupted => return None,
}
}
2021-05-15 16:03:08 +00:00
}
2021-06-15 14:02:46 +00:00
2021-08-06 02:23:41 +00:00
pub fn get_event_sender(&self) -> futures_channel::mpsc::UnboundedSender<EventTrigger> {
self.shared.ui_event_sender.clone()
}
2021-08-24 20:29:10 +00:00
pub fn has_work(&self) -> bool {
true
}
pub async fn wait_for_any_work(&self) {}
2021-04-05 01:47:53 +00:00
}
// TODO!
// These impls are actually wrong. The DOM needs to have a mutex implemented.
unsafe impl Sync for VirtualDom {}
unsafe impl Send for VirtualDom {}