dioxus/packages/core/src/diff.rs

1649 lines
64 KiB
Rust
Raw Normal View History

2021-06-16 15:19:37 +00:00
//! This module contains the stateful DiffMachine and all methods to diff VNodes, their properties, and their children.
//! The DiffMachine calculates the diffs between the old and new frames, updates the new nodes, and modifies the real dom.
2021-06-16 15:19:37 +00:00
//!
2021-07-12 06:23:46 +00:00
//! ## Notice:
2021-06-27 02:13:57 +00:00
//! The inspiration and code for this module was originally taken from Dodrio (@fitzgen) and then modified to support
//! Components, Fragments, Suspense, SubTree memoization, and additional batching operations.
2021-06-16 15:19:37 +00:00
//!
//! ## Implementation Details:
//!
//! ### IDs for elements
2021-07-12 06:23:46 +00:00
//! --------------------
//! All nodes are addressed by their IDs. The RealDom provides an imperative interface for making changes to these nodes.
2021-06-27 02:13:57 +00:00
//! We don't necessarily require that DOM changes happen instnatly during the diffing process, so the implementor may choose
//! to batch nodes if it is more performant for their application. The expectation is that renderers use a Slotmap for nodes
//! whose keys can be converted to u64 on FFI boundaries.
//!
//! When new nodes are created through `render`, they won't know which real node they correspond to. During diffing, we
//! always make sure to copy over the ID. If we don't do this properly, the ElementId will be populated incorrectly and
//! brick the user's page.
//!
2021-07-29 22:04:09 +00:00
//! ### Fragment Support
//!
//! Fragments (nodes without a parent) are supported through a combination of "replace with" and anchor vnodes. Fragments
//! can be particularly challenging when they are empty, so the placeholder node lets us "reserve" a spot for the empty
//! fragment to be replaced with when it is no longer empty. This is guaranteed by logic in the NodeFactory - it is
//! impossible to craft a fragment with 0 elements - they must always have at least a single placeholder element. This is
//! slightly inefficient, but represents a such an uncommon use case that it is not worth optimizing.
//!
//! ## Subtree Memoization
2021-07-12 06:23:46 +00:00
//! -----------------------
//! We also employ "subtree memoization" which saves us from having to check trees which take no dynamic content. We can
//! detect if a subtree is "static" by checking if its children are "static". Since we dive into the tree depth-first, the
//! calls to "create" propogate this information upwards. Structures like the one below are entirely static:
//! ```rust
//! rsx!( div { class: "hello world", "this node is entirely static" } )
//! ```
//! Because the subtrees won't be diffed, their "real node" data will be stale (invalid), so its up to the reconciler to
//! track nodes created in a scope and clean up all relevant data. Support for this is currently WIP
//!
2021-07-12 06:23:46 +00:00
//! ## Bloom Filter and Heuristics
//! ------------------------------
//! For all components, we employ some basic heuristics to speed up allocations and pre-size bump arenas. The heuristics are
//! currently very rough, but will get better as time goes on. For FFI, we recommend using a bloom filter to cache strings.
//!
//!
2021-07-12 06:23:46 +00:00
//! ## Garbage Collection
//! ---------------------
2021-07-23 21:03:51 +00:00
//! Dioxus uses a passive garbage collection system to clean up old nodes once the work has been completed. This garabge
//! collection is done internally once the main diffing work is complete. After the "garbage" is collected, Dioxus will then
//! start to re-use old keys for new nodes. This results in a passive memory management system that is very efficient.
2021-02-15 04:39:46 +00:00
//!
//! The IDs used by the key/map are just an index into a vec. This means that Dioxus will drive the key allocation strategy
//! so the client only needs to maintain a simple list of nodes. By default, Dioxus will not manually clean up old nodes
//! for the client. As new nodes are created, old nodes will be over-written.
2021-02-15 04:39:46 +00:00
//!
2021-07-29 22:04:09 +00:00
//! HEADS-UP:
//! For now, deferred garabge collection is disabled. The code-paths are almost wired up, but it's quite complex to
//! get working safely and efficiently. For now, garabge is collected immediately during diffing. This adds extra
//! overhead, but is faster to implement in the short term.
//!
2021-06-16 15:19:37 +00:00
//! Further Reading and Thoughts
//! ----------------------------
2021-03-03 07:27:26 +00:00
//! There are more ways of increasing diff performance here that are currently not implemented.
//! More info on how to improve this diffing algorithm:
//! - https://hacks.mozilla.org/2019/03/fast-bump-allocated-virtual-doms-with-rust-and-wasm/
2021-06-16 15:19:37 +00:00
use crate::{arena::SharedResources, innerlude::*};
2021-08-06 02:23:41 +00:00
use futures_util::Future;
2021-07-30 20:07:42 +00:00
use fxhash::{FxBuildHasher, FxHashMap, FxHashSet};
2021-07-21 21:05:48 +00:00
use smallvec::{smallvec, SmallVec};
2021-03-11 17:27:01 +00:00
2021-08-08 19:15:16 +00:00
use std::{any::Any, cell::Cell, cmp::Ordering, marker::PhantomData, pin::Pin};
2021-07-29 04:04:59 +00:00
use DomEdit::*;
2021-03-03 07:27:26 +00:00
2021-08-06 02:23:41 +00:00
pub struct DiffMachine<'r, 'bump> {
pub vdom: &'bump SharedResources,
2021-08-08 19:15:16 +00:00
pub edits: Mutations<'bump>,
2021-07-29 22:04:09 +00:00
pub scope_stack: SmallVec<[ScopeId; 5]>,
2021-02-12 21:11:33 +00:00
pub diffed: FxHashSet<ScopeId>,
2021-07-26 16:14:48 +00:00
2021-07-29 22:04:09 +00:00
// will be used later for garbage collection
// we check every seen node and then schedule its eventual deletion
pub seen_scopes: FxHashSet<ScopeId>,
2021-08-08 19:15:16 +00:00
_r: PhantomData<&'r ()>,
}
2021-08-06 02:23:41 +00:00
impl<'r, 'bump> DiffMachine<'r, 'bump> {
2021-07-29 22:04:09 +00:00
pub(crate) fn new(
2021-08-08 19:15:16 +00:00
edits: Mutations<'bump>,
2021-07-29 22:04:09 +00:00
cur_scope: ScopeId,
shared: &'bump SharedResources,
2021-06-20 06:16:42 +00:00
) -> Self {
2021-02-15 04:39:46 +00:00
Self {
2021-07-29 04:04:59 +00:00
edits,
2021-07-29 22:04:09 +00:00
scope_stack: smallvec![cur_scope],
vdom: shared,
2021-02-15 04:39:46 +00:00
diffed: FxHashSet::default(),
2021-07-29 22:04:09 +00:00
seen_scopes: FxHashSet::default(),
2021-08-08 19:15:16 +00:00
_r: PhantomData,
2021-07-29 22:04:09 +00:00
}
}
/// Allows the creation of a diff machine without the concept of scopes or a virtualdom
/// this is mostly useful for testing
///
/// This will PANIC if any component elements are passed in.
pub fn new_headless(
2021-08-08 19:15:16 +00:00
// edits: &'r mut Vec<DomEdit<'bump>>,
2021-07-29 22:04:09 +00:00
shared: &'bump SharedResources,
) -> Self {
Self {
2021-08-08 19:15:16 +00:00
edits: Mutations { edits: Vec::new() },
2021-07-29 22:04:09 +00:00
scope_stack: smallvec![ScopeId(0)],
vdom: shared,
diffed: FxHashSet::default(),
seen_scopes: FxHashSet::default(),
2021-08-08 19:15:16 +00:00
_r: PhantomData,
}
}
2021-07-12 06:23:46 +00:00
2021-08-06 02:23:41 +00:00
//
pub fn diff_scope(&mut self, id: ScopeId) -> Result<()> {
let component = self.get_scope_mut(&id).ok_or_else(|| Error::NotMounted)?;
let (old, new) = (component.frames.wip_head(), component.frames.fin_head());
self.diff_node(old, new);
Ok(())
}
// Diff the `old` node with the `new` node. Emits instructions to modify a
// physical DOM node that reflects `old` into something that reflects `new`.
//
2021-07-12 06:23:46 +00:00
// the real stack should be what it is coming in and out of this function (ideally empty)
//
2021-07-12 06:23:46 +00:00
// each function call assumes the stack is fresh (empty).
pub fn diff_node(&mut self, old_node: &'bump VNode<'bump>, new_node: &'bump VNode<'bump>) {
2021-07-12 22:19:27 +00:00
match (&old_node.kind, &new_node.kind) {
2021-07-05 05:11:49 +00:00
// Handle the "sane" cases first.
// The rsx and html macros strongly discourage dynamic lists not encapsulated by a "Fragment".
// So the sane (and fast!) cases are where the virtual structure stays the same and is easily diffable.
2021-07-12 22:19:27 +00:00
(VNodeKind::Text(old), VNodeKind::Text(new)) => {
2021-07-29 22:04:09 +00:00
let root = old_node.direct_id();
2021-07-26 16:14:48 +00:00
2021-07-05 05:11:49 +00:00
if old.text != new.text {
2021-07-29 22:04:09 +00:00
self.edit_push_root(root);
self.edit_set_text(new.text);
self.edit_pop();
2021-03-14 00:11:06 +00:00
}
2021-07-13 03:44:20 +00:00
2021-07-29 22:04:09 +00:00
new.dom_id.set(Some(root));
2021-07-05 05:11:49 +00:00
}
2021-03-05 20:02:36 +00:00
2021-07-12 22:19:27 +00:00
(VNodeKind::Element(old), VNodeKind::Element(new)) => {
2021-07-29 22:04:09 +00:00
let root = old_node.direct_id();
2021-07-26 16:14:48 +00:00
2021-07-05 05:11:49 +00:00
// If the element type is completely different, the element needs to be re-rendered completely
// This is an optimization React makes due to how users structure their code
//
// This case is rather rare (typically only in non-keyed lists)
2021-07-05 05:11:49 +00:00
if new.tag_name != old.tag_name || new.namespace != old.namespace {
2021-07-29 22:04:09 +00:00
self.replace_node_with_node(root, old_node, new_node);
2021-07-05 05:11:49 +00:00
return;
}
2021-06-07 18:14:49 +00:00
2021-07-29 22:04:09 +00:00
new.dom_id.set(Some(root));
2021-07-12 06:23:46 +00:00
// Don't push the root if we don't have to
2021-07-26 16:14:48 +00:00
let mut has_comitted = false;
2021-07-29 04:04:59 +00:00
let mut please_commit = |edits: &mut Vec<DomEdit>| {
if !has_comitted {
has_comitted = true;
2021-07-29 04:04:59 +00:00
edits.push(PushRoot { id: root.as_u64() });
}
};
// Diff Attributes
//
// It's extraordinarily rare to have the number/order of attributes change
// In these cases, we just completely erase the old set and make a new set
//
// TODO: take a more efficient path than this
if old.attributes.len() == new.attributes.len() {
for (old_attr, new_attr) in old.attributes.iter().zip(new.attributes.iter()) {
if old_attr.value != new_attr.value {
2021-08-08 19:15:16 +00:00
please_commit(&mut self.edits.edits);
2021-07-29 22:04:09 +00:00
self.edit_set_attribute(new_attr);
}
}
} else {
// TODO: provide some sort of report on how "good" the diffing was
2021-08-08 19:15:16 +00:00
please_commit(&mut self.edits.edits);
for attribute in old.attributes {
2021-07-29 22:04:09 +00:00
self.edit_remove_attribute(attribute);
}
for attribute in new.attributes {
2021-07-29 22:04:09 +00:00
self.edit_set_attribute(attribute)
}
}
// Diff listeners
//
// It's extraordinarily rare to have the number/order of listeners change
// In the cases where the listeners change, we completely wipe the data attributes and add new ones
//
2021-07-30 20:07:42 +00:00
// We also need to make sure that all listeners are properly attached to the parent scope (fix_listener)
//
// TODO: take a more efficient path than this
2021-07-29 22:04:09 +00:00
let cur_scope: ScopeId = self.scope_stack.last().unwrap().clone();
if old.listeners.len() == new.listeners.len() {
for (old_l, new_l) in old.listeners.iter().zip(new.listeners.iter()) {
if old_l.event != new_l.event {
2021-08-08 19:15:16 +00:00
please_commit(&mut self.edits.edits);
2021-07-29 22:04:09 +00:00
self.edit_remove_event_listener(old_l.event);
self.edit_new_event_listener(new_l, cur_scope);
}
new_l.mounted_node.set(old_l.mounted_node.get());
2021-07-29 22:04:09 +00:00
self.fix_listener(new_l);
}
} else {
2021-08-08 19:15:16 +00:00
please_commit(&mut self.edits.edits);
for listener in old.listeners {
2021-07-29 22:04:09 +00:00
self.edit_remove_event_listener(listener.event);
}
for listener in new.listeners {
listener.mounted_node.set(Some(root));
2021-07-29 22:04:09 +00:00
self.edit_new_event_listener(listener, cur_scope);
// Make sure the listener gets attached to the scope list
self.fix_listener(listener);
}
}
if has_comitted {
2021-07-29 22:04:09 +00:00
self.edit_pop();
}
2021-07-29 22:04:09 +00:00
self.diff_children(old.children, new.children);
2021-07-05 05:11:49 +00:00
}
2021-03-03 07:27:26 +00:00
2021-07-12 22:19:27 +00:00
(VNodeKind::Component(old), VNodeKind::Component(new)) => {
let scope_addr = old.ass_scope.get().unwrap();
// Make sure we're dealing with the same component (by function pointer)
2021-07-05 05:11:49 +00:00
if old.user_fc == new.user_fc {
//
2021-07-29 22:04:09 +00:00
self.scope_stack.push(scope_addr);
2021-07-05 05:11:49 +00:00
// Make sure the new component vnode is referencing the right scope id
new.ass_scope.set(Some(scope_addr));
2021-07-05 05:11:49 +00:00
// make sure the component's caller function is up to date
let scope = self.get_scope_mut(&scope_addr).unwrap();
scope
.update_scope_dependencies(new.caller.clone(), ScopeChildren(new.children));
2021-07-05 05:11:49 +00:00
// React doesn't automatically memoize, but we do.
let compare = old.comparator.unwrap();
match compare(new) {
true => {
// the props are the same...
}
false => {
// the props are different...
scope.run_scope().unwrap();
self.diff_node(scope.frames.wip_head(), scope.frames.fin_head());
}
}
2021-07-29 22:04:09 +00:00
self.scope_stack.pop();
2021-07-29 22:04:09 +00:00
self.seen_scopes.insert(scope_addr);
2021-07-05 05:11:49 +00:00
} else {
let mut old_iter = RealChildIterator::new(old_node, &self.vdom);
let first = old_iter
.next()
.expect("Components should generate a placeholder root");
// remove any leftovers
for to_remove in old_iter {
2021-07-29 22:04:09 +00:00
self.edit_push_root(to_remove.direct_id());
self.edit_remove();
}
2021-06-03 14:42:28 +00:00
// seems like we could combine this into a single instruction....
2021-07-29 22:04:09 +00:00
self.replace_node_with_node(first.direct_id(), old_node, new_node);
2021-07-05 05:11:49 +00:00
// Wipe the old one and plant the new one
let old_scope = old.ass_scope.get().unwrap();
self.destroy_scopes(old_scope);
2021-06-26 07:06:29 +00:00
}
2021-07-05 05:11:49 +00:00
}
2021-07-12 22:19:27 +00:00
(VNodeKind::Fragment(old), VNodeKind::Fragment(new)) => {
2021-07-05 05:11:49 +00:00
// This is the case where options or direct vnodes might be used.
// In this case, it's faster to just skip ahead to their diff
if old.children.len() == 1 && new.children.len() == 1 {
self.diff_node(&old.children[0], &new.children[0]);
2021-07-05 05:11:49 +00:00
return;
}
2021-06-16 15:19:37 +00:00
2021-07-29 22:04:09 +00:00
self.diff_children(old.children, new.children);
}
(VNodeKind::Anchor(old), VNodeKind::Anchor(new)) => {
new.dom_id.set(old.dom_id.get());
2021-06-03 14:42:28 +00:00
}
2021-07-12 06:23:46 +00:00
// The strategy here is to pick the first possible node from the previous set and use that as our replace with root
//
2021-07-12 06:23:46 +00:00
// We also walk the "real node" list to make sure all latent roots are claened up
// This covers the case any time a fragment or component shows up with pretty much anything else
//
// This likely isn't the fastest way to go about replacing one node with a virtual node, but the "insane" cases
// are pretty rare. IE replacing a list (component or fragment) with a single node.
2021-07-12 06:23:46 +00:00
(
2021-07-12 22:19:27 +00:00
VNodeKind::Component(_)
| VNodeKind::Fragment(_)
| VNodeKind::Text(_)
2021-07-29 22:04:09 +00:00
| VNodeKind::Element(_)
| VNodeKind::Anchor(_),
2021-07-12 22:19:27 +00:00
VNodeKind::Component(_)
| VNodeKind::Fragment(_)
| VNodeKind::Text(_)
2021-07-29 22:04:09 +00:00
| VNodeKind::Element(_)
| VNodeKind::Anchor(_),
2021-07-12 06:23:46 +00:00
) => {
2021-07-30 20:07:42 +00:00
self.replace_and_create_many_with_many([old_node], [new_node]);
}
2021-07-12 06:23:46 +00:00
// TODO
2021-07-31 02:14:06 +00:00
(VNodeKind::Suspended(old), new) => {
//
self.replace_and_create_many_with_many([old_node], [new_node]);
}
2021-07-29 22:56:09 +00:00
// a node that was once real is now suspended
2021-07-31 02:14:06 +00:00
(old, VNodeKind::Suspended(_)) => {
//
self.replace_and_create_many_with_many([old_node], [new_node]);
}
}
2021-03-03 07:27:26 +00:00
}
// Emit instructions to create the given virtual node.
//
// The change list stack may have any shape upon entering this function:
//
// [...]
//
// When this function returns, the new node is on top of the change list stack:
//
// [... node]
2021-07-29 22:04:09 +00:00
pub fn create_vnode(&mut self, node: &'bump VNode<'bump>) -> CreateMeta {
2021-07-12 22:19:27 +00:00
match &node.kind {
VNodeKind::Text(text) => {
let real_id = self.vdom.reserve_node();
2021-07-29 22:04:09 +00:00
self.edit_create_text_node(text.text, real_id);
text.dom_id.set(Some(real_id));
2021-07-13 20:48:11 +00:00
CreateMeta::new(text.is_static, 1)
2021-03-11 17:27:01 +00:00
}
2021-07-29 22:04:09 +00:00
VNodeKind::Anchor(anchor) => {
let real_id = self.vdom.reserve_node();
self.edit_create_placeholder(real_id);
anchor.dom_id.set(Some(real_id));
CreateMeta::new(false, 1)
}
2021-07-12 22:19:27 +00:00
VNodeKind::Element(el) => {
// we have the potential to completely eliminate working on this node in the future(!)
//
// This can only be done if all of the elements properties (attrs, children, listeners, etc) are static
// While creating these things, keep track if we can memoize this element.
// At the end, we'll set this flag on the element to skip it
let mut is_static: bool = true;
let VElement {
tag_name,
listeners,
attributes,
children,
namespace,
2021-07-13 20:48:47 +00:00
static_attrs: _,
static_children: _,
static_listeners: _,
2021-07-29 22:04:09 +00:00
dom_id,
} = el;
let real_id = self.vdom.reserve_node();
2021-08-06 02:23:41 +00:00
self.edit_create_element(tag_name, *namespace, real_id);
2021-07-29 22:04:09 +00:00
dom_id.set(Some(real_id));
2021-03-11 17:27:01 +00:00
2021-07-29 22:04:09 +00:00
let cur_scope = self.current_scope().unwrap();
2021-08-08 19:15:16 +00:00
listeners.iter().for_each(|listener| {
2021-07-29 22:04:09 +00:00
self.fix_listener(listener);
listener.mounted_node.set(Some(real_id));
2021-07-29 22:04:09 +00:00
self.edit_new_event_listener(listener, cur_scope.clone());
// if the node has an event listener, then it must be visited ?
is_static = false;
2021-03-11 17:27:01 +00:00
});
for attr in *attributes {
is_static = is_static && attr.is_static;
2021-07-29 22:04:09 +00:00
self.edit_set_attribute(attr);
2021-03-11 17:27:01 +00:00
}
// Fast path: if there is a single text child, it is faster to
// create-and-append the text node all at once via setting the
// parent's `textContent` in a single change list instruction than
// to emit three instructions to (1) create a text node, (2) set its
// text content, and finally (3) append the text node to this
// parent.
2021-06-27 02:13:57 +00:00
//
// Notice: this is a web-specific optimization and may be changed in the future
//
// TODO move over
// if children.len() == 1 {
// if let VNodeKind::Text(text) = &children[0].kind {
2021-07-29 04:04:59 +00:00
// self.set_text(text.text);
// return CreateMeta::new(is_static, 1);
// }
// }
2021-03-11 17:27:01 +00:00
for child in *children {
2021-07-29 22:04:09 +00:00
let child_meta = self.create_vnode(child);
is_static = is_static && child_meta.is_static;
// append whatever children were generated by this call
2021-07-29 22:04:09 +00:00
self.edit_append_children(child_meta.added_to_stack);
2021-03-11 17:27:01 +00:00
}
CreateMeta::new(is_static, 1)
}
2021-06-07 18:14:49 +00:00
2021-07-12 22:19:27 +00:00
VNodeKind::Component(vcomponent) => {
let caller = vcomponent.caller.clone();
2021-06-07 18:14:49 +00:00
2021-07-29 22:04:09 +00:00
let parent_idx = self.scope_stack.last().unwrap().clone();
2021-06-08 18:00:29 +00:00
2021-06-07 18:14:49 +00:00
// Insert a new scope into our component list
let new_idx = self.vdom.insert_scope_with_key(|new_idx| {
let parent_scope = self.get_scope(&parent_idx).unwrap();
let height = parent_scope.height + 1;
Scope::new(
caller,
new_idx,
Some(parent_idx),
height,
2021-07-26 16:14:48 +00:00
ScopeChildren(vcomponent.children),
self.vdom.clone(),
)
});
2021-06-07 18:14:49 +00:00
// Actually initialize the caller's slot with the right address
2021-07-21 21:05:48 +00:00
vcomponent.ass_scope.set(Some(new_idx));
2021-06-07 18:14:49 +00:00
2021-08-08 19:15:16 +00:00
if !vcomponent.can_memoize {
let cur_scope = self.get_scope_mut(&parent_idx).unwrap();
let extended = *vcomponent as *const VComponent;
let extended: *const VComponent<'static> =
unsafe { std::mem::transmute(extended) };
cur_scope.borrowed_props.borrow_mut().push(extended);
}
2021-07-30 20:07:42 +00:00
// TODO:
2021-08-08 19:15:16 +00:00
// add noderefs to current noderef list Noderefs
// add effects to current effect list Effects
2021-07-30 20:07:42 +00:00
let new_component = self.get_scope_mut(&new_idx).unwrap();
2021-06-07 18:14:49 +00:00
// Run the scope for one iteration to initialize it
2021-07-30 20:07:42 +00:00
match new_component.run_scope() {
Ok(_) => {
// all good, new nodes exist
}
Err(err) => {
// failed to run. this is the first time the component ran, and it failed
// we manually set its head node to an empty fragment
panic!("failing components not yet implemented");
}
}
2021-06-07 18:14:49 +00:00
2021-07-29 22:04:09 +00:00
// Take the node that was just generated from running the component
2021-07-26 16:14:48 +00:00
let nextnode = new_component.frames.fin_head();
2021-06-07 18:14:49 +00:00
2021-07-29 22:04:09 +00:00
// Push the new scope onto the stack
self.scope_stack.push(new_idx);
// Run the creation algorithm with this scope on the stack
let meta = self.create_vnode(nextnode);
// pop the scope off the stack
self.scope_stack.pop();
if meta.added_to_stack == 0 {
2021-07-30 20:07:42 +00:00
panic!("Components should *always* generate nodes - even if they fail");
2021-07-29 22:04:09 +00:00
}
// Finally, insert this scope as a seen node.
self.seen_scopes.insert(new_idx);
2021-07-12 06:23:46 +00:00
CreateMeta::new(vcomponent.is_static, meta.added_to_stack)
2021-03-11 17:27:01 +00:00
}
2021-06-07 18:14:49 +00:00
// Fragments are the only nodes that can contain dynamic content (IE through curlies or iterators).
// We can never ignore their contents, so the prescence of a fragment indicates that we need always diff them.
2021-07-12 06:23:46 +00:00
// Fragments will just put all their nodes onto the stack after creation
2021-07-29 22:04:09 +00:00
VNodeKind::Fragment(frag) => self.create_children(frag.children),
VNodeKind::Suspended(VSuspended { node: real_node }) => {
2021-07-31 02:14:06 +00:00
let id = self.vdom.reserve_node();
self.edit_create_placeholder(id);
real_node.set(Some(id));
CreateMeta::new(false, 1)
2021-06-03 14:42:28 +00:00
}
2021-03-11 17:27:01 +00:00
}
}
fn create_children(&mut self, children: &'bump [VNode<'bump>]) -> CreateMeta {
let mut is_static = true;
let mut added_to_stack = 0;
2021-07-30 21:04:04 +00:00
// add them backwards
for child in children.iter().rev() {
2021-07-29 22:04:09 +00:00
let child_meta = self.create_vnode(child);
is_static = is_static && child_meta.is_static;
added_to_stack += child_meta.added_to_stack;
}
CreateMeta {
is_static,
added_to_stack,
}
}
2021-06-07 18:14:49 +00:00
/// Destroy a scope and all of its descendents.
///
/// Calling this will run the destuctors on all hooks in the tree.
/// It will also add the destroyed nodes to the `seen_nodes` cache to prevent them from being renderered.
fn destroy_scopes(&mut self, old_scope: ScopeId) {
2021-06-07 18:14:49 +00:00
let mut nodes_to_delete = vec![old_scope];
let mut scopes_to_explore = vec![old_scope];
// explore the scope tree breadth first
while let Some(scope_id) = scopes_to_explore.pop() {
// If we're planning on deleting this node, then we don't need to both rendering it
2021-07-29 22:04:09 +00:00
self.seen_scopes.insert(scope_id);
let scope = self.get_scope(&scope_id).unwrap();
2021-06-07 18:14:49 +00:00
for child in scope.descendents.borrow().iter() {
// Add this node to be explored
scopes_to_explore.push(child.clone());
// Also add it for deletion
nodes_to_delete.push(child.clone());
}
}
// Delete all scopes that we found as part of this subtree
for node in nodes_to_delete {
log::debug!("Removing scope {:#?}", node);
let _scope = self.vdom.try_remove(node).unwrap();
2021-06-07 18:14:49 +00:00
// do anything we need to do to delete the scope
// I think we need to run the destructors on the hooks
// TODO
}
}
2021-03-03 07:27:26 +00:00
// Diff the given set of old and new children.
//
// The parent must be on top of the change list stack when this function is
// entered:
//
// [... parent]
//
// the change list stack is in the same state when this function returns.
//
// If old no anchors are provided, then it's assumed that we can freely append to the parent.
//
// Remember, non-empty lists does not mean that there are real elements, just that there are virtual elements.
2021-07-29 22:04:09 +00:00
fn diff_children(&mut self, old: &'bump [VNode<'bump>], new: &'bump [VNode<'bump>]) {
const IS_EMPTY: bool = true;
const IS_NOT_EMPTY: bool = false;
2021-07-29 22:04:09 +00:00
match (old.is_empty(), new.is_empty()) {
(IS_EMPTY, IS_EMPTY) => {}
// Completely adding new nodes, removing any placeholder if it exists
2021-07-29 22:04:09 +00:00
(IS_EMPTY, IS_NOT_EMPTY) => {
2021-07-29 04:04:59 +00:00
let meta = self.create_children(new);
2021-07-29 22:04:09 +00:00
self.edit_append_children(meta.added_to_stack);
2021-07-29 04:04:59 +00:00
}
// Completely removing old nodes and putting an anchor in its place
// no anchor (old has nodes) and the new is empty
// remove all the old nodes
2021-07-29 22:04:09 +00:00
(IS_NOT_EMPTY, IS_EMPTY) => {
for node in old {
self.remove_vnode(node);
}
}
2021-07-29 22:04:09 +00:00
(IS_NOT_EMPTY, IS_NOT_EMPTY) => {
let first_old = &old[0];
let first_new = &new[0];
2021-07-29 22:04:09 +00:00
match (&first_old.kind, &first_new.kind) {
2021-07-29 22:56:09 +00:00
// Anchors can only appear in empty fragments
2021-07-29 22:04:09 +00:00
(VNodeKind::Anchor(old_anchor), VNodeKind::Anchor(new_anchor)) => {
old_anchor.dom_id.set(new_anchor.dom_id.get());
}
2021-07-29 22:56:09 +00:00
// Replace the anchor with whatever new nodes are coming down the pipe
2021-07-29 22:04:09 +00:00
(VNodeKind::Anchor(anchor), _) => {
2021-07-29 22:56:09 +00:00
self.edit_push_root(anchor.dom_id.get().unwrap());
let mut added = 0;
for el in new {
let meta = self.create_vnode(el);
added += meta.added_to_stack;
}
self.edit_replace_with(1, added);
2021-07-29 22:04:09 +00:00
}
2021-07-29 22:56:09 +00:00
// Replace whatever nodes are sitting there with the anchor
2021-07-29 22:04:09 +00:00
(_, VNodeKind::Anchor(anchor)) => {
2021-07-30 20:07:42 +00:00
self.replace_and_create_many_with_many(old, [first_new]);
2021-07-29 22:04:09 +00:00
}
2021-07-29 22:56:09 +00:00
// Use the complex diff algorithm to diff the nodes
2021-07-29 22:04:09 +00:00
_ => {
let new_is_keyed = new[0].key.is_some();
let old_is_keyed = old[0].key.is_some();
debug_assert!(
new.iter().all(|n| n.key.is_some() == new_is_keyed),
"all siblings must be keyed or all siblings must be non-keyed"
);
debug_assert!(
old.iter().all(|o| o.key.is_some() == old_is_keyed),
"all siblings must be keyed or all siblings must be non-keyed"
);
if new_is_keyed && old_is_keyed {
self.diff_keyed_children(old, new);
} else {
self.diff_non_keyed_children(old, new);
}
}
}
}
}
}
2021-03-03 07:27:26 +00:00
// Diffing "keyed" children.
//
// With keyed children, we care about whether we delete, move, or create nodes
// versus mutate existing nodes in place. Presumably there is some sort of CSS
// transition animation that makes the virtual DOM diffing algorithm
// observable. By specifying keys for nodes, we know which virtual DOM nodes
// must reuse (or not reuse) the same physical DOM nodes.
//
// This is loosely based on Inferno's keyed patching implementation. However, we
// have to modify the algorithm since we are compiling the diff down into change
// list instructions that will be executed later, rather than applying the
// changes to the DOM directly as we compare virtual DOMs.
//
// https://github.com/infernojs/inferno/blob/36fd96/packages/inferno/src/DOM/patching.ts#L530-L739
//
2021-07-30 20:07:42 +00:00
// The stack is empty upon entry.
2021-07-23 21:03:51 +00:00
fn diff_keyed_children(&mut self, old: &'bump [VNode<'bump>], new: &'bump [VNode<'bump>]) {
2021-06-27 02:13:57 +00:00
if cfg!(debug_assertions) {
let mut keys = fxhash::FxHashSet::default();
let mut assert_unique_keys = |children: &'bump [VNode<'bump>]| {
2021-06-27 02:13:57 +00:00
keys.clear();
for child in children {
2021-07-12 22:19:27 +00:00
let key = child.key;
2021-06-27 02:13:57 +00:00
debug_assert!(
key.is_some(),
"if any sibling is keyed, all siblings must be keyed"
);
keys.insert(key);
}
debug_assert_eq!(
children.len(),
keys.len(),
"keyed siblings must each have a unique key"
);
};
assert_unique_keys(old);
assert_unique_keys(new);
}
2021-03-03 07:27:26 +00:00
// First up, we diff all the nodes with the same key at the beginning of the
// children.
//
// `shared_prefix_count` is the count of how many nodes at the start of
// `new` and `old` share the same keys.
2021-07-30 20:07:42 +00:00
//
// TODO: just inline this
2021-03-03 07:27:26 +00:00
let shared_prefix_count = match self.diff_keyed_prefix(old, new) {
KeyedPrefixResult::Finished => return,
KeyedPrefixResult::MoreWorkToDo(count) => count,
};
// Next, we find out how many of the nodes at the end of the children have
// the same key. We do _not_ diff them yet, since we want to emit the change
// list instructions such that they can be applied in a single pass over the
// DOM. Instead, we just save this information for later.
//
// `shared_suffix_count` is the count of how many nodes at the end of `new`
// and `old` share the same keys.
let shared_suffix_count = old[shared_prefix_count..]
.iter()
.rev()
.zip(new[shared_prefix_count..].iter().rev())
2021-07-12 22:19:27 +00:00
.take_while(|&(old, new)| old.key == new.key)
2021-03-03 07:27:26 +00:00
.count();
let old_shared_suffix_start = old.len() - shared_suffix_count;
let new_shared_suffix_start = new.len() - shared_suffix_count;
// Ok, we now hopefully have a smaller range of children in the middle
// within which to re-order nodes with the same keys, remove old nodes with
// now-unused keys, and create new nodes with fresh keys.
self.diff_keyed_middle(
&old[shared_prefix_count..old_shared_suffix_start],
&new[shared_prefix_count..new_shared_suffix_start],
shared_prefix_count,
shared_suffix_count,
old_shared_suffix_start,
);
// Finally, diff the nodes at the end of `old` and `new` that share keys.
let old_suffix = &old[old_shared_suffix_start..];
let new_suffix = &new[new_shared_suffix_start..];
debug_assert_eq!(old_suffix.len(), new_suffix.len());
if !old_suffix.is_empty() {
self.diff_keyed_suffix(old_suffix, new_suffix, new_shared_suffix_start)
}
}
2021-03-03 07:27:26 +00:00
// Diff the prefix of children in `new` and `old` that share the same keys in
// the same order.
//
2021-07-30 20:07:42 +00:00
// The stack is empty upon entry.
fn diff_keyed_prefix(
2021-07-23 21:03:51 +00:00
&mut self,
old: &'bump [VNode<'bump>],
new: &'bump [VNode<'bump>],
) -> KeyedPrefixResult {
2021-07-23 21:03:51 +00:00
let mut shared_prefix_count = 0;
2021-07-30 14:35:47 +00:00
for (old, new) in old.iter().zip(new.iter()) {
2021-07-23 21:03:51 +00:00
// abort early if we finally run into nodes with different keys
if old.key() != new.key() {
break;
}
self.diff_node(old, new);
shared_prefix_count += 1;
}
2021-07-23 21:03:51 +00:00
// If that was all of the old children, then create and append the remaining
// new children and we're finished.
if shared_prefix_count == old.len() {
2021-07-30 20:07:42 +00:00
// Load the last element
let last_node = self.find_last_element(new.last().unwrap()).direct_id();
self.edit_push_root(last_node);
// Create the new children and insert them after
let meta = self.create_children(&new[shared_prefix_count..]);
self.edit_insert_after(meta.added_to_stack);
2021-07-23 21:03:51 +00:00
return KeyedPrefixResult::Finished;
}
2021-07-23 21:03:51 +00:00
// And if that was all of the new children, then remove all of the remaining
// old children and we're finished.
if shared_prefix_count == new.len() {
2021-07-30 20:07:42 +00:00
self.remove_children(&old[shared_prefix_count..]);
2021-07-23 21:03:51 +00:00
return KeyedPrefixResult::Finished;
}
2021-07-29 22:04:09 +00:00
KeyedPrefixResult::MoreWorkToDo(shared_prefix_count)
2021-07-12 06:23:46 +00:00
}
// Create the given children and append them to the parent node.
//
// The parent node must currently be on top of the change list stack:
//
// [... parent]
//
// When this function returns, the change list stack is in the same state.
pub fn create_and_append_children(&mut self, new: &'bump [VNode<'bump>]) {
for child in new {
2021-07-29 22:04:09 +00:00
let meta = self.create_vnode(child);
self.edit_append_children(meta.added_to_stack);
2021-07-12 06:23:46 +00:00
}
}
2021-03-03 07:27:26 +00:00
// The most-general, expensive code path for keyed children diffing.
//
// We find the longest subsequence within `old` of children that are relatively
// ordered the same way in `new` (via finding a longest-increasing-subsequence
// of the old child's index within `new`). The children that are elements of
// this subsequence will remain in place, minimizing the number of DOM moves we
// will have to do.
//
2021-07-30 14:35:47 +00:00
// Upon entry to this function, the change list stack must be empty.
2021-03-03 07:27:26 +00:00
//
2021-07-30 14:35:47 +00:00
// This function will load the appropriate nodes onto the stack and do diffing in place.
2021-03-03 07:27:26 +00:00
//
// Upon exit from this function, it will be restored to that same state.
2021-06-20 06:16:42 +00:00
fn diff_keyed_middle(
2021-07-29 22:04:09 +00:00
&mut self,
old: &'bump [VNode<'bump>],
2021-07-30 14:35:47 +00:00
mut new: &'bump [VNode<'bump>],
2021-07-23 21:03:51 +00:00
shared_prefix_count: usize,
shared_suffix_count: usize,
old_shared_suffix_start: usize,
2021-03-03 07:27:26 +00:00
) {
2021-07-29 22:04:09 +00:00
// Should have already diffed the shared-key prefixes and suffixes.
debug_assert_ne!(new.first().map(|n| n.key()), old.first().map(|o| o.key()));
debug_assert_ne!(new.last().map(|n| n.key()), old.last().map(|o| o.key()));
2021-07-30 20:07:42 +00:00
// // The algorithm below relies upon using `u32::MAX` as a sentinel
// // value, so if we have that many new nodes, it won't work. This
// // check is a bit academic (hence only enabled in debug), since
// // wasm32 doesn't have enough address space to hold that many nodes
// // in memory.
// debug_assert!(new.len() < u32::MAX as usize);
2021-07-29 22:04:09 +00:00
// Map from each `old` node's key to its index within `old`.
// IE if the keys were A B C, then we would have (A, 1) (B, 2) (C, 3).
let mut old_key_to_old_index = old
.iter()
.enumerate()
2021-07-30 20:07:42 +00:00
.map(|(i, o)| (o.key().unwrap(), i))
2021-07-29 22:04:09 +00:00
.collect::<FxHashMap<_, _>>();
2021-07-29 22:04:09 +00:00
// The set of shared keys between `new` and `old`.
let mut shared_keys = FxHashSet::default();
2021-07-30 20:07:42 +00:00
// let mut to_remove = FxHashSet::default();
let mut to_add = FxHashSet::default();
2021-07-29 22:04:09 +00:00
// Map from each index in `new` to the index of the node in `old` that
// has the same key.
let mut new_index_to_old_index = new
.iter()
.map(|n| {
2021-07-30 20:07:42 +00:00
let key = n.key().unwrap();
match old_key_to_old_index.get(&key) {
Some(&index) => {
shared_keys.insert(key);
index
}
None => {
//
to_add.insert(key);
u32::MAX as usize
}
2021-07-29 22:04:09 +00:00
}
})
.collect::<Vec<_>>();
2021-07-30 20:07:42 +00:00
dbg!(&shared_keys);
dbg!(&to_add);
2021-07-29 22:04:09 +00:00
// If none of the old keys are reused by the new children, then we
// remove all the remaining old children and create the new children
// afresh.
if shared_suffix_count == 0 && shared_keys.is_empty() {
2021-07-30 20:07:42 +00:00
self.replace_and_create_many_with_many(old, new);
2021-07-29 22:04:09 +00:00
return;
}
2021-07-30 20:07:42 +00:00
// // Remove any old children whose keys were not reused in the new
// // children. Remove from the end first so that we don't mess up indices.
// for old_child in old.iter().rev() {
// if !shared_keys.contains(&old_child.key()) {
// self.remove_child(old_child);
// }
// }
2021-03-03 07:27:26 +00:00
2021-07-30 20:07:42 +00:00
// let old_keyds = old.iter().map(|f| f.key()).collect::<Vec<_>>();
// let new_keyds = new.iter().map(|f| f.key()).collect::<Vec<_>>();
// dbg!(old_keyds);
// dbg!(new_keyds);
2021-07-30 14:35:47 +00:00
2021-07-30 20:07:42 +00:00
// // If there aren't any more new children, then we are done!
// if new.is_empty() {
// return;
// }
2021-07-30 14:35:47 +00:00
// The longest increasing subsequence within `new_index_to_old_index`. This
// is the longest sequence on DOM nodes in `old` that are relatively ordered
// correctly within `new`. We will leave these nodes in place in the DOM,
// and only move nodes that are not part of the LIS. This results in the
// maximum number of DOM nodes left in place, AKA the minimum number of DOM
// nodes moved.
let mut new_index_is_in_lis = FxHashSet::default();
new_index_is_in_lis.reserve(new_index_to_old_index.len());
2021-07-30 20:07:42 +00:00
2021-07-30 14:35:47 +00:00
let mut predecessors = vec![0; new_index_to_old_index.len()];
let mut starts = vec![0; new_index_to_old_index.len()];
2021-07-30 20:07:42 +00:00
2021-07-30 14:35:47 +00:00
longest_increasing_subsequence::lis_with(
&new_index_to_old_index,
&mut new_index_is_in_lis,
|a, b| a < b,
&mut predecessors,
&mut starts,
);
2021-07-30 20:07:42 +00:00
dbg!(&new_index_is_in_lis);
// use the old nodes to navigate the new nodes
2021-07-30 14:35:47 +00:00
2021-07-30 20:07:42 +00:00
let mut lis_in_order = new_index_is_in_lis.into_iter().collect::<Vec<_>>();
lis_in_order.sort_unstable();
dbg!(&lis_in_order);
// we walk front to back, creating the head node
// diff the shared, in-place nodes first
// this makes sure we can rely on their first/last nodes being correct later on
for id in &lis_in_order {
let new_node = &new[*id];
let key = new_node.key().unwrap();
let old_index = old_key_to_old_index.get(&key).unwrap();
let old_node = &old[*old_index];
self.diff_node(old_node, new_node);
}
// return the old node from the key
let load_old_node_from_lsi = |key| -> &VNode {
let old_index = old_key_to_old_index.get(key).unwrap();
let old_node = &old[*old_index];
old_node
};
2021-07-30 14:35:47 +00:00
2021-07-30 20:07:42 +00:00
let mut root = None;
let mut new_iter = new.iter().enumerate();
for lis_id in &lis_in_order {
eprintln!("tracking {:?}", lis_id);
// this is the next milestone node we are working up to
let new_anchor = &new[*lis_id];
root = Some(new_anchor);
let anchor_el = self.find_first_element(new_anchor);
self.edit_push_root(anchor_el.direct_id());
// let mut pushed = false;
'inner: loop {
let (next_id, next_new) = new_iter.next().unwrap();
if next_id == *lis_id {
// we've reached the milestone, break this loop so we can step to the next milestone
// remember: we already diffed this node
eprintln!("breaking {:?}", next_id);
break 'inner;
2021-07-30 14:35:47 +00:00
} else {
2021-07-30 20:07:42 +00:00
let key = next_new.key().unwrap();
eprintln!("found key {:?}", key);
if shared_keys.contains(&key) {
eprintln!("key is contained {:?}", key);
shared_keys.remove(key);
// diff the two nodes
let old_node = load_old_node_from_lsi(key);
self.diff_node(old_node, next_new);
// now move all the nodes into the right spot
for child in RealChildIterator::new(next_new, self.vdom) {
let el = child.direct_id();
self.edit_push_root(el);
self.edit_insert_before(1);
}
} else {
eprintln!("key is not contained {:?}", key);
// new node needs to be created
// insert it before the current milestone
let meta = self.create_vnode(next_new);
self.edit_insert_before(meta.added_to_stack);
}
2021-07-30 14:35:47 +00:00
}
}
2021-07-30 20:07:42 +00:00
self.edit_pop();
2021-07-30 14:35:47 +00:00
}
2021-07-30 20:07:42 +00:00
let final_lis_node = root.unwrap();
let final_el_node = self.find_last_element(final_lis_node);
let final_el = final_el_node.direct_id();
self.edit_push_root(final_el);
let mut last_iter = new.iter().rev().enumerate();
let last_key = final_lis_node.key().unwrap();
loop {
let (last_id, last_node) = last_iter.next().unwrap();
let key = last_node.key().unwrap();
eprintln!("checking final nodes {:?}", key);
2021-07-30 14:35:47 +00:00
2021-07-30 20:07:42 +00:00
if last_key == key {
eprintln!("breaking final nodes");
break;
}
if shared_keys.contains(&key) {
eprintln!("key is contained {:?}", key);
shared_keys.remove(key);
// diff the two nodes
let old_node = load_old_node_from_lsi(key);
self.diff_node(old_node, last_node);
// now move all the nodes into the right spot
for child in RealChildIterator::new(last_node, self.vdom) {
let el = child.direct_id();
self.edit_push_root(el);
self.edit_insert_after(1);
}
} else {
eprintln!("key is not contained {:?}", key);
// new node needs to be created
// insert it before the current milestone
let meta = self.create_vnode(last_node);
self.edit_insert_after(meta.added_to_stack);
2021-07-30 14:35:47 +00:00
}
}
2021-07-30 20:07:42 +00:00
self.edit_pop();
}
2021-03-03 07:27:26 +00:00
// Diff the suffix of keyed children that share the same keys in the same order.
//
// The parent must be on the change list stack when we enter this function:
//
// [... parent]
//
// When this function exits, the change list stack remains the same.
2021-06-20 06:16:42 +00:00
fn diff_keyed_suffix(
2021-07-23 21:03:51 +00:00
&mut self,
old: &'bump [VNode<'bump>],
new: &'bump [VNode<'bump>],
new_shared_suffix_start: usize,
) {
2021-07-23 21:03:51 +00:00
debug_assert_eq!(old.len(), new.len());
debug_assert!(!old.is_empty());
2021-03-03 07:27:26 +00:00
2021-07-30 20:07:42 +00:00
for (old_child, new_child) in old.iter().zip(new.iter()) {
2021-07-23 21:03:51 +00:00
self.diff_node(old_child, new_child);
}
2021-03-03 07:27:26 +00:00
}
2021-03-03 07:27:26 +00:00
// Diff children that are not keyed.
//
// The parent must be on the top of the change list stack when entering this
// function:
//
// [... parent]
//
// the change list stack is in the same state when this function returns.
fn diff_non_keyed_children(&mut self, old: &'bump [VNode<'bump>], new: &'bump [VNode<'bump>]) {
2021-03-03 07:27:26 +00:00
// Handled these cases in `diff_children` before calling this function.
2021-07-27 04:27:07 +00:00
//
2021-07-30 14:35:47 +00:00
debug_assert!(!new.is_empty());
debug_assert!(!old.is_empty());
2021-03-03 07:27:26 +00:00
2021-07-27 04:27:07 +00:00
match old.len().cmp(&new.len()) {
// old.len > new.len -> removing some nodes
Ordering::Greater => {
2021-07-30 14:35:47 +00:00
// diff them together
for (new_child, old_child) in new.iter().zip(old.iter()) {
self.diff_node(old_child, new_child);
}
// todo: we would emit fewer instructions if we just did a replace many
// remove whatever is still dangling
2021-07-27 04:27:07 +00:00
for item in &old[new.len()..] {
for i in RealChildIterator::new(item, self.vdom) {
2021-07-29 22:04:09 +00:00
self.edit_push_root(i.direct_id());
self.edit_remove();
2021-07-27 04:27:07 +00:00
}
}
}
2021-07-30 14:35:47 +00:00
2021-07-27 04:27:07 +00:00
// old.len < new.len -> adding some nodes
2021-07-30 14:35:47 +00:00
// this is wrong in the case where we're diffing fragments
//
// we need to save the last old element and then replace it with all the new ones
2021-07-27 04:27:07 +00:00
Ordering::Less => {
2021-07-30 14:35:47 +00:00
// Add the new elements to the last old element while it still exists
let last = self.find_last_element(old.last().unwrap());
self.edit_push_root(last.direct_id());
// create the rest and insert them
let meta = self.create_children(&new[old.len()..]);
self.edit_insert_after(meta.added_to_stack);
self.edit_pop();
// diff the rest
new.iter()
.zip(old.iter())
.for_each(|(new_child, old_child)| self.diff_node(old_child, new_child));
}
// old.len == new.len -> no nodes added/removed, but perhaps changed
Ordering::Equal => {
for (new_child, old_child) in new.iter().zip(old.iter()) {
self.diff_node(old_child, new_child);
}
2021-07-27 04:27:07 +00:00
}
}
2021-03-03 07:27:26 +00:00
}
// ======================
// Support methods
// ======================
2021-07-29 22:04:09 +00:00
// Remove all of a node's children.
//
// The change list stack must have this shape upon entry to this function:
//
// [... parent]
//
// When this function returns, the change list stack is in the same state.
fn remove_all_children(&mut self, old: &'bump [VNode<'bump>]) {
// debug_assert!(self.traversal_is_committed());
log::debug!("REMOVING CHILDREN");
for _child in old {
// registry.remove_subtree(child);
}
// Fast way to remove all children: set the node's textContent to an empty
// string.
todo!()
// self.set_inner_text("");
}
2021-03-03 07:27:26 +00:00
// Remove the current child and all of its following siblings.
//
// The change list stack must have this shape upon entry to this function:
//
// [... parent child]
//
// After the function returns, the child is no longer on the change list stack:
//
// [... parent]
2021-07-30 20:07:42 +00:00
fn remove_children(&mut self, old: &'bump [VNode<'bump>]) {
self.replace_and_create_many_with_many(old, None)
}
2021-07-30 14:35:47 +00:00
fn find_last_element(&mut self, vnode: &'bump VNode<'bump>) -> &'bump VNode<'bump> {
let mut search_node = Some(vnode);
loop {
let node = search_node.take().unwrap();
match &node.kind {
// the ones that have a direct id
VNodeKind::Text(_)
| VNodeKind::Element(_)
| VNodeKind::Anchor(_)
| VNodeKind::Suspended(_) => break node,
VNodeKind::Fragment(frag) => {
search_node = frag.children.last();
}
VNodeKind::Component(el) => {
let scope_id = el.ass_scope.get().unwrap();
let scope = self.get_scope(&scope_id).unwrap();
search_node = Some(scope.root());
}
}
}
}
fn find_first_element(&mut self, vnode: &'bump VNode<'bump>) -> &'bump VNode<'bump> {
let mut search_node = Some(vnode);
loop {
let node = search_node.take().unwrap();
match &node.kind {
// the ones that have a direct id
VNodeKind::Text(_)
| VNodeKind::Element(_)
| VNodeKind::Anchor(_)
| VNodeKind::Suspended(_) => break node,
VNodeKind::Fragment(frag) => {
search_node = Some(&frag.children[0]);
}
VNodeKind::Component(el) => {
let scope_id = el.ass_scope.get().unwrap();
let scope = self.get_scope(&scope_id).unwrap();
search_node = Some(scope.root());
}
}
}
}
2021-07-30 20:07:42 +00:00
fn remove_child(&mut self, node: &'bump VNode<'bump>) {
self.replace_and_create_many_with_many(Some(node), None);
}
/// Remove all the old nodes and replace them with newly created new nodes.
///
/// The new nodes *will* be created - don't create them yourself!
fn replace_and_create_many_with_many(
2021-07-29 22:56:09 +00:00
&mut self,
2021-07-30 20:07:42 +00:00
old_nodes: impl IntoIterator<Item = &'bump VNode<'bump>>,
new_nodes: impl IntoIterator<Item = &'bump VNode<'bump>>,
2021-07-29 22:56:09 +00:00
) {
let mut nodes_to_replace = Vec::new();
2021-07-30 20:07:42 +00:00
let mut nodes_to_search = old_nodes.into_iter().collect::<Vec<_>>();
2021-07-29 22:56:09 +00:00
let mut scopes_obliterated = Vec::new();
while let Some(node) = nodes_to_search.pop() {
match &node.kind {
2021-07-30 20:07:42 +00:00
// the ones that have a direct id return immediately
2021-07-29 22:56:09 +00:00
VNodeKind::Text(el) => nodes_to_replace.push(el.dom_id.get().unwrap()),
VNodeKind::Element(el) => nodes_to_replace.push(el.dom_id.get().unwrap()),
VNodeKind::Anchor(el) => nodes_to_replace.push(el.dom_id.get().unwrap()),
VNodeKind::Suspended(el) => nodes_to_replace.push(el.node.get().unwrap()),
2021-07-30 20:07:42 +00:00
// Fragments will either have a single anchor or a list of children
2021-07-29 22:56:09 +00:00
VNodeKind::Fragment(frag) => {
for child in frag.children {
nodes_to_search.push(child);
}
}
2021-07-30 20:07:42 +00:00
// Components can be any of the nodes above
// However, we do need to track which components need to be removed
2021-07-29 22:56:09 +00:00
VNodeKind::Component(el) => {
let scope_id = el.ass_scope.get().unwrap();
let scope = self.get_scope(&scope_id).unwrap();
let root = scope.root();
nodes_to_search.push(root);
scopes_obliterated.push(scope_id);
}
}
2021-07-30 20:07:42 +00:00
// TODO: enable internal garabge collection
// self.create_garbage(node);
2021-07-29 22:56:09 +00:00
}
let n = nodes_to_replace.len();
for node in nodes_to_replace {
self.edit_push_root(node);
}
2021-07-30 14:35:47 +00:00
let mut nodes_created = 0;
2021-07-30 20:07:42 +00:00
for node in new_nodes {
2021-07-30 14:35:47 +00:00
let meta = self.create_vnode(node);
nodes_created += meta.added_to_stack;
}
2021-07-29 22:56:09 +00:00
2021-07-30 20:07:42 +00:00
// if 0 nodes are created, then it gets interperted as a deletion
2021-07-30 14:35:47 +00:00
self.edit_replace_with(n as u32, nodes_created);
2021-07-29 22:56:09 +00:00
// obliterate!
for scope in scopes_obliterated {
self.destroy_scopes(scope);
}
}
2021-07-29 22:04:09 +00:00
fn create_garbage(&mut self, node: &'bump VNode<'bump>) {
2021-07-30 14:35:47 +00:00
match self.current_scope().and_then(|id| self.get_scope(&id)) {
Some(scope) => {
let garbage: &'bump VNode<'static> = unsafe { std::mem::transmute(node) };
scope.pending_garbage.borrow_mut().push(garbage);
}
None => {
log::info!("No scope to collect garbage into")
}
}
2021-07-29 22:04:09 +00:00
}
fn immediately_dispose_garabage(&mut self, node: ElementId) {
self.vdom.collect_garbage(node)
}
fn replace_node_with_node(
&mut self,
anchor: ElementId,
old_node: &'bump VNode<'bump>,
new_node: &'bump VNode<'bump>,
) {
self.edit_push_root(anchor);
let meta = self.create_vnode(new_node);
2021-07-29 22:56:09 +00:00
self.edit_replace_with(1, meta.added_to_stack);
2021-07-29 22:04:09 +00:00
self.create_garbage(old_node);
self.edit_pop();
}
fn remove_vnode(&mut self, node: &'bump VNode<'bump>) {
match &node.kind {
VNodeKind::Text(el) => self.immediately_dispose_garabage(node.direct_id()),
VNodeKind::Element(el) => {
self.immediately_dispose_garabage(node.direct_id());
for child in el.children {
self.remove_vnode(&child);
}
}
VNodeKind::Anchor(a) => {
//
}
VNodeKind::Fragment(frag) => {
for child in frag.children {
self.remove_vnode(&child);
}
}
VNodeKind::Component(el) => {
//
// self.destroy_scopes(old_scope)
}
VNodeKind::Suspended(_) => todo!(),
}
}
fn current_scope(&self) -> Option<ScopeId> {
self.scope_stack.last().map(|f| f.clone())
}
fn fix_listener<'a>(&mut self, listener: &'a Listener<'a>) {
let scope_id = self.current_scope();
if let Some(scope_id) = scope_id {
let scope = self.get_scope(&scope_id).unwrap();
let mut queue = scope.listeners.borrow_mut();
let long_listener: &'a Listener<'static> = unsafe { std::mem::transmute(listener) };
queue.push(long_listener as *const _)
}
}
pub fn get_scope_mut(&mut self, id: &ScopeId) -> Option<&'bump mut Scope> {
// ensure we haven't seen this scope before
// if we have, then we're trying to alias it, which is not allowed
2021-07-29 22:04:09 +00:00
debug_assert!(!self.seen_scopes.contains(id));
unsafe { self.vdom.get_scope_mut(*id) }
}
pub fn get_scope(&mut self, id: &ScopeId) -> Option<&'bump Scope> {
// ensure we haven't seen this scope before
// if we have, then we're trying to alias it, which is not allowed
unsafe { self.vdom.get_scope(*id) }
}
2021-07-29 04:04:59 +00:00
// Navigation
2021-07-29 22:04:09 +00:00
pub(crate) fn edit_push_root(&mut self, root: ElementId) {
2021-07-29 04:04:59 +00:00
let id = root.as_u64();
2021-08-08 19:15:16 +00:00
self.edits.edits.push(PushRoot { id });
2021-07-29 04:04:59 +00:00
}
2021-07-29 22:04:09 +00:00
pub(crate) fn edit_pop(&mut self) {
2021-08-08 19:15:16 +00:00
self.edits.edits.push(PopRoot {});
2021-07-29 04:04:59 +00:00
}
// Add Nodes to the dom
// add m nodes from the stack
2021-07-29 22:04:09 +00:00
pub(crate) fn edit_append_children(&mut self, many: u32) {
2021-08-08 19:15:16 +00:00
self.edits.edits.push(AppendChildren { many });
2021-07-29 04:04:59 +00:00
}
// replace the n-m node on the stack with the m nodes
// ends with the last element of the chain on the top of the stack
2021-07-29 22:56:09 +00:00
pub(crate) fn edit_replace_with(&mut self, n: u32, m: u32) {
2021-08-08 19:15:16 +00:00
self.edits.edits.push(ReplaceWith { n, m });
2021-07-29 04:04:59 +00:00
}
2021-07-30 14:35:47 +00:00
pub(crate) fn edit_insert_after(&mut self, n: u32) {
2021-08-08 19:15:16 +00:00
self.edits.edits.push(InsertAfter { n });
2021-07-30 14:35:47 +00:00
}
2021-07-30 20:07:42 +00:00
pub(crate) fn edit_insert_before(&mut self, n: u32) {
2021-08-08 19:15:16 +00:00
self.edits.edits.push(InsertBefore { n });
2021-07-30 20:07:42 +00:00
}
2021-07-29 04:04:59 +00:00
// Remove Nodesfrom the dom
2021-07-29 22:04:09 +00:00
pub(crate) fn edit_remove(&mut self) {
2021-08-08 19:15:16 +00:00
self.edits.edits.push(Remove);
2021-07-29 04:04:59 +00:00
}
// Create
2021-07-29 22:04:09 +00:00
pub(crate) fn edit_create_text_node(&mut self, text: &'bump str, id: ElementId) {
2021-07-29 04:04:59 +00:00
let id = id.as_u64();
2021-08-08 19:15:16 +00:00
self.edits.edits.push(CreateTextNode { text, id });
2021-07-29 04:04:59 +00:00
}
2021-07-29 22:04:09 +00:00
pub(crate) fn edit_create_element(
2021-07-29 04:04:59 +00:00
&mut self,
tag: &'static str,
ns: Option<&'static str>,
id: ElementId,
) {
let id = id.as_u64();
match ns {
2021-08-08 19:15:16 +00:00
Some(ns) => self.edits.edits.push(CreateElementNs { id, ns, tag }),
None => self.edits.edits.push(CreateElement { id, tag }),
2021-07-29 04:04:59 +00:00
}
}
// placeholders are nodes that don't get rendered but still exist as an "anchor" in the real dom
2021-07-29 22:04:09 +00:00
pub(crate) fn edit_create_placeholder(&mut self, id: ElementId) {
2021-07-29 04:04:59 +00:00
let id = id.as_u64();
2021-08-08 19:15:16 +00:00
self.edits.edits.push(CreatePlaceholder { id });
2021-07-29 04:04:59 +00:00
}
// events
2021-07-29 22:04:09 +00:00
pub(crate) fn edit_new_event_listener(&mut self, listener: &Listener, scope: ScopeId) {
2021-07-29 04:04:59 +00:00
let Listener {
event,
mounted_node,
..
} = listener;
let element_id = mounted_node.get().unwrap().as_u64();
2021-08-08 19:15:16 +00:00
self.edits.edits.push(NewEventListener {
2021-07-29 22:04:09 +00:00
scope,
2021-07-29 04:04:59 +00:00
event_name: event,
mounted_node_id: element_id,
});
}
2021-07-29 22:04:09 +00:00
pub(crate) fn edit_remove_event_listener(&mut self, event: &'static str) {
2021-08-08 19:15:16 +00:00
self.edits.edits.push(RemoveEventListener { event });
2021-07-29 04:04:59 +00:00
}
// modify
2021-07-29 22:04:09 +00:00
pub(crate) fn edit_set_text(&mut self, text: &'bump str) {
2021-08-08 19:15:16 +00:00
self.edits.edits.push(SetText { text });
2021-07-29 04:04:59 +00:00
}
2021-07-29 22:04:09 +00:00
pub(crate) fn edit_set_attribute(&mut self, attribute: &'bump Attribute) {
2021-07-29 04:04:59 +00:00
let Attribute {
name,
value,
is_static,
is_volatile,
namespace,
} = attribute;
// field: &'static str,
// value: &'bump str,
// ns: Option<&'static str>,
2021-08-08 19:15:16 +00:00
self.edits.edits.push(SetAttribute {
2021-07-29 04:04:59 +00:00
field: name,
value,
ns: *namespace,
});
}
2021-08-06 02:23:41 +00:00
pub(crate) fn edit_set_attribute_ns(
&mut self,
attribute: &'bump Attribute,
namespace: &'bump str,
) {
let Attribute {
name,
value,
is_static,
is_volatile,
// namespace,
..
} = attribute;
// field: &'static str,
// value: &'bump str,
// ns: Option<&'static str>,
2021-08-08 19:15:16 +00:00
self.edits.edits.push(SetAttribute {
2021-08-06 02:23:41 +00:00
field: name,
value,
ns: Some(namespace),
});
}
2021-07-29 22:04:09 +00:00
pub(crate) fn edit_remove_attribute(&mut self, attribute: &Attribute) {
2021-07-29 04:04:59 +00:00
let name = attribute.name;
2021-08-08 19:15:16 +00:00
self.edits.edits.push(RemoveAttribute { name });
2021-07-29 04:04:59 +00:00
}
}
// When we create new nodes, we need to propagate some information back up the call chain.
// This gives the caller some information on how to handle things like insertins, appending, and subtree discarding.
2021-07-30 14:35:47 +00:00
#[derive(Debug)]
pub struct CreateMeta {
pub is_static: bool,
pub added_to_stack: u32,
}
impl CreateMeta {
fn new(is_static: bool, added_to_tack: u32) -> Self {
Self {
is_static,
added_to_stack: added_to_tack,
}
}
}
2021-03-03 07:27:26 +00:00
enum KeyedPrefixResult {
// Fast path: we finished diffing all the children just by looking at the
// prefix of shared keys!
Finished,
// There is more diffing work to do. Here is a count of how many children at
// the beginning of `new` and `old` we already processed.
MoreWorkToDo(usize),
}
2021-07-12 06:23:46 +00:00
fn find_first_real_node<'a>(
2021-07-29 04:04:59 +00:00
nodes: impl IntoIterator<Item = &'a VNode<'a>>,
scopes: &'a SharedResources,
) -> Option<&'a VNode<'a>> {
for node in nodes {
2021-07-29 04:04:59 +00:00
let mut iter = RealChildIterator::new(node, scopes);
if let Some(node) = iter.next() {
return Some(node);
}
}
None
}
2021-07-30 20:07:42 +00:00
/// This iterator iterates through a list of virtual children and only returns real children (Elements, Text, Anchors).
2021-07-12 06:23:46 +00:00
///
/// This iterator is useful when it's important to load the next real root onto the top of the stack for operations like
/// "InsertBefore".
2021-07-29 22:04:09 +00:00
pub struct RealChildIterator<'a> {
scopes: &'a SharedResources,
2021-07-12 06:23:46 +00:00
// Heuristcally we should never bleed into 4 completely nested fragments/components
2021-07-12 06:23:46 +00:00
// Smallvec lets us stack allocate our little stack machine so the vast majority of cases are sane
// TODO: use const generics instead of the 4 estimation
stack: smallvec::SmallVec<[(u16, &'a VNode<'a>); 4]>,
2021-07-12 06:23:46 +00:00
}
impl<'a> RealChildIterator<'a> {
2021-07-29 22:04:09 +00:00
pub fn new(starter: &'a VNode<'a>, scopes: &'a SharedResources) -> Self {
2021-07-12 06:23:46 +00:00
Self {
scopes,
stack: smallvec::smallvec![(0, starter)],
}
}
2021-07-30 20:07:42 +00:00
// keep the memory around
pub fn reset_with(&mut self, node: &'a VNode<'a>) {
self.stack.clear();
self.stack.push((0, node));
}
2021-07-12 06:23:46 +00:00
}
impl<'a> Iterator for RealChildIterator<'a> {
2021-07-23 21:03:51 +00:00
type Item = &'a VNode<'a>;
2021-07-12 06:23:46 +00:00
2021-07-23 21:03:51 +00:00
fn next(&mut self) -> Option<&'a VNode<'a>> {
2021-07-12 06:23:46 +00:00
let mut should_pop = false;
2021-07-23 21:03:51 +00:00
let mut returned_node: Option<&'a VNode<'a>> = None;
2021-07-12 06:23:46 +00:00
let mut should_push = None;
while returned_node.is_none() {
if let Some((count, node)) = self.stack.last_mut() {
2021-07-12 22:19:27 +00:00
match &node.kind {
2021-07-12 06:23:46 +00:00
// We can only exit our looping when we get "real" nodes
// This includes fragments and components when they're empty (have a single root)
2021-07-12 22:19:27 +00:00
VNodeKind::Element(_) | VNodeKind::Text(_) => {
2021-07-12 06:23:46 +00:00
// We've recursed INTO an element/text
// We need to recurse *out* of it and move forward to the next
should_pop = true;
2021-07-23 21:03:51 +00:00
returned_node = Some(&*node);
2021-07-12 06:23:46 +00:00
}
// If we get a fragment we push the next child
2021-07-12 22:19:27 +00:00
VNodeKind::Fragment(frag) => {
2021-07-12 06:23:46 +00:00
let subcount = *count as usize;
if frag.children.len() == 0 {
should_pop = true;
2021-07-23 21:03:51 +00:00
returned_node = Some(&*node);
2021-07-12 06:23:46 +00:00
}
if subcount >= frag.children.len() {
should_pop = true;
} else {
should_push = Some(&frag.children[subcount]);
}
}
2021-07-29 22:04:09 +00:00
// // If we get a fragment we push the next child
// VNodeKind::Fragment(frag) => {
// let subcount = *count as usize;
// if frag.children.len() == 0 {
// should_pop = true;
// returned_node = Some(&*node);
// }
// if subcount >= frag.children.len() {
// should_pop = true;
// } else {
// should_push = Some(&frag.children[subcount]);
// }
// }
2021-07-12 06:23:46 +00:00
// Immediately abort suspended nodes - can't do anything with them yet
2021-07-29 22:04:09 +00:00
VNodeKind::Suspended(node) => {
// VNodeKind::Suspended => should_pop = true,
todo!()
}
VNodeKind::Anchor(a) => {
todo!()
}
2021-07-12 06:23:46 +00:00
// For components, we load their root and push them onto the stack
2021-07-12 22:19:27 +00:00
VNodeKind::Component(sc) => {
let scope =
unsafe { self.scopes.get_scope(sc.ass_scope.get().unwrap()) }.unwrap();
// let scope = self.scopes.get(sc.ass_scope.get().unwrap()).unwrap();
2021-07-12 06:23:46 +00:00
// Simply swap the current node on the stack with the root of the component
2021-07-26 16:14:48 +00:00
*node = scope.frames.fin_head();
2021-07-12 06:23:46 +00:00
}
}
} else {
// If there's no more items on the stack, we're done!
return None;
}
if should_pop {
self.stack.pop();
if let Some((id, _)) = self.stack.last_mut() {
*id += 1;
}
should_pop = false;
}
if let Some(push) = should_push {
self.stack.push((0, push));
should_push = None;
}
}
returned_node
}
}
2021-07-13 19:34:12 +00:00
fn compare_strs(a: &str, b: &str) -> bool {
// Check by pointer, optimizing for static strs
if !std::ptr::eq(a, b) {
// If the pointers are different then check by value
a == b
} else {
true
}
}