diff --git a/packages/core/src/create.rs b/packages/core/src/create.rs index 64196a969..3da568634 100644 --- a/packages/core/src/create.rs +++ b/packages/core/src/create.rs @@ -1,6 +1,4 @@ -use crate::innerlude::{ElementPath, ElementRef, VComponent, VPlaceholder, VText}; -use crate::mutations::Mutation; -use crate::mutations::Mutation::*; +use crate::innerlude::{ElementPath, ElementRef, VComponent, VPlaceholder, VText, WriteMutations}; use crate::nodes::VNode; use crate::nodes::{DynamicNode, TemplateNode}; use crate::virtual_dom::VirtualDom; @@ -64,15 +62,20 @@ impl VirtualDom { /// Create a new template [`VNode`] and write it to the [`Mutations`] buffer. /// /// This method pushes the ScopeID to the internal scopestack and returns the number of nodes created. - pub(crate) fn create_scope(&mut self, scope: ScopeId, template: &VNode) -> usize { + pub(crate) fn create_scope( + &mut self, + scope: ScopeId, + template: &VNode, + to: &mut impl WriteMutations, + ) -> usize { self.runtime.scope_stack.borrow_mut().push(scope); - let nodes = self.create(template); + let nodes = self.create(template, to); self.runtime.scope_stack.borrow_mut().pop(); nodes } /// Create this template and write its mutations - pub(crate) fn create(&mut self, node: &VNode) -> usize { + pub(crate) fn create(&mut self, node: &VNode, to: &mut impl WriteMutations) -> usize { // check for a overriden template #[cfg(debug_assertions)] { @@ -95,12 +98,7 @@ impl VirtualDom { // The best renderers will have templates prehydrated and registered // Just in case, let's create the template using instructions anyways - self.register_template(node.template.get()); - - // we know that this will generate at least one mutation per node - self.mutations - .edits - .reserve(node.template.get().roots.len()); + self.register_template(node.template.get(), to); // Walk the roots, creating nodes and assigning IDs // nodes in an iterator of ((dynamic_node_index, sorted_index), path) @@ -153,30 +151,46 @@ impl VirtualDom { .map(|(idx, root)| match root { DynamicText { id } | Dynamic { id } => { nodes.next().unwrap(); - self.write_dynamic_root(node, *id) + self.write_dynamic_root(node, *id, to) } Element { .. } => { #[cfg(not(debug_assertions))] let id = self.write_element_root(node, idx, &mut attrs, &mut nodes, &[]); #[cfg(debug_assertions)] - let id = - self.write_element_root(node, idx, &mut attrs, &mut nodes, &nodes_sorted); + let id = self.write_element_root( + node, + idx, + &mut attrs, + &mut nodes, + &nodes_sorted, + to, + ); id } - Text { .. } => self.write_static_text_root(node, idx), + Text { .. } => self.write_static_text_root(node, idx, to), }) .sum() } - fn write_static_text_root(&mut self, node: &VNode, idx: usize) -> usize { + fn write_static_text_root( + &mut self, + node: &VNode, + idx: usize, + to: &mut impl WriteMutations, + ) -> usize { // Simply just load the template root, no modifications needed - self.load_template_root(node, idx); + self.load_template_root(node, idx, to); // Text producs just one node on the stack 1 } - fn write_dynamic_root(&mut self, template: &VNode, idx: usize) -> usize { + fn write_dynamic_root( + &mut self, + template: &VNode, + idx: usize, + to: &mut impl WriteMutations, + ) -> usize { use DynamicNode::*; match &template.dynamic_nodes[idx] { node @ Component { .. } | node @ Fragment(_) => { @@ -187,7 +201,7 @@ impl VirtualDom { element: template.clone(), scope: self.runtime.current_scope_id().unwrap_or(ScopeId(0)), }; - self.create_dynamic_node(template_ref, node) + self.create_dynamic_node(template_ref, node, to) } Placeholder(VPlaceholder { id, parent }) => { let template_ref = ElementRef { @@ -199,21 +213,17 @@ impl VirtualDom { }; *parent.borrow_mut() = Some(template_ref); let id = self.set_slot(id); - self.mutations.push(CreatePlaceholder { id }); + to.create_placeholder(id); 1 } Text(VText { id, value }) => { let id = self.set_slot(id); - self.create_static_text(value, id); + to.create_text_node(value, id); 1 } } } - fn create_static_text(&mut self, value: &str, id: ElementId) { - self.mutations.push(CreateTextNode { value, id }); - } - /// We write all the descendent data for this element /// /// Elements can contain other nodes - and those nodes can be dynamic or static @@ -226,15 +236,22 @@ impl VirtualDom { dynamic_attrs: &mut Peekable>, dynamic_nodes_iter: &mut Peekable>, dynamic_nodes: &[(usize, &'static [u8])], + to: &mut impl WriteMutations, ) -> usize { // Load the template root and get the ID for the node on the stack - let root_on_stack = self.load_template_root(template, root_idx); + let root_on_stack = self.load_template_root(template, root_idx, to); // Write all the attributes below this root - self.write_attrs_on_root(dynamic_attrs, root_idx as u8, root_on_stack, template); + self.write_attrs_on_root(dynamic_attrs, root_idx as u8, root_on_stack, template, to); // Load in all of the placeholder or dynamic content under this root too - self.load_placeholders(dynamic_nodes_iter, dynamic_nodes, root_idx as u8, template); + self.load_placeholders( + dynamic_nodes_iter, + dynamic_nodes, + root_idx as u8, + template, + to, + ); 1 } @@ -259,6 +276,7 @@ impl VirtualDom { dynamic_nodes: &[(usize, &'static [u8])], root_idx: u8, template: &VNode, + to: &mut impl WriteMutations, ) { let (start, end) = match collect_dyn_node_range(dynamic_nodes_iter, root_idx) { Some((a, b)) => (a, b), @@ -281,11 +299,11 @@ impl VirtualDom { element: template.clone(), scope: self.runtime.current_scope_id().unwrap_or(ScopeId(0)), }; - let m = self.create_dynamic_node(boundary_ref, &template.dynamic_nodes[idx]); + let m = self.create_dynamic_node(boundary_ref, &template.dynamic_nodes[idx], to); if m > 0 { // The path is one shorter because the top node is the root let path = &template.template.get().node_paths[idx][1..]; - self.mutations.push(ReplacePlaceholder { m, path }); + to.replace_placeholder_with_nodes(path, m); } } } @@ -296,14 +314,15 @@ impl VirtualDom { root_idx: u8, root: ElementId, node: &VNode, + to: &mut impl WriteMutations, ) { while let Some((mut attr_id, path)) = attrs.next_if(|(_, p)| p.first().copied() == Some(root_idx)) { - let id = self.assign_static_node_as_dynamic(path, root); + let id = self.assign_static_node_as_dynamic(path, root, to); loop { - self.write_attribute(node, attr_id, &node.dynamic_attrs[attr_id], id); + self.write_attribute(node, attr_id, &node.dynamic_attrs[attr_id], id, to); // Only push the dynamic attributes forward if they match the current path (same element) match attrs.next_if(|(_, p)| *p == path) { @@ -320,6 +339,7 @@ impl VirtualDom { idx: usize, attribute: &crate::Attribute, id: ElementId, + to: &mut impl WriteMutations, ) { // Make sure we set the attribute's associated id attribute.mounted_element.set(id); @@ -336,35 +356,27 @@ impl VirtualDom { scope: self.runtime.current_scope_id().unwrap_or(ScopeId(0)), }; self.elements[id.0] = Some(element_ref); - self.mutations.push(NewEventListener { - // all listeners start with "on" - name: &unbounded_name[2..], - id, - }) + to.create_event_listener(&unbounded_name[2..], id); } _ => { let unbounded_value = &attribute.value; - self.mutations.push(SetAttribute { - name: unbounded_name, - value: unbounded_value, - ns: attribute.namespace, - id, - }) + to.set_attribute(unbounded_name, attribute.namespace, unbounded_value, id); } } } - fn load_template_root(&mut self, template: &VNode, root_idx: usize) -> ElementId { + fn load_template_root( + &mut self, + template: &VNode, + root_idx: usize, + to: &mut impl WriteMutations, + ) -> ElementId { // Get an ID for this root since it's a real root let this_id = self.next_element(); template.root_ids.borrow_mut()[root_idx] = this_id; - self.mutations.push(LoadTemplate { - name: template.template.get().name, - index: root_idx, - id: this_id, - }); + to.load_template(template.template.get().name, root_idx, this_id); this_id } @@ -380,6 +392,7 @@ impl VirtualDom { &mut self, path: &'static [u8], this_id: ElementId, + to: &mut impl WriteMutations, ) -> ElementId { if path.len() == 1 { return this_id; @@ -389,16 +402,17 @@ impl VirtualDom { // Else, it's deep in the template and we should create a new id for it let id = self.next_element(); - self.mutations.push(Mutation::AssignId { - path: &path[1..], - id, - }); + to.assign_node_id(&path[1..], id); id } /// Insert a new template into the VirtualDom's template registry - pub(crate) fn register_template_first_byte_index(&mut self, mut template: Template<'static>) { + pub(crate) fn register_template_first_byte_index( + &mut self, + mut template: Template<'static>, + to: &mut impl WriteMutations, + ) { // First, make sure we mark the template as seen, regardless if we process it let (path, _) = template.name.rsplit_once(':').unwrap(); if let Some((_, old_template)) = self @@ -421,14 +435,18 @@ impl VirtualDom { // If it's all dynamic nodes, then we don't need to register it if !template.is_completely_dynamic() { - self.mutations.templates.push(template); + to.register_template(template); } } /// Insert a new template into the VirtualDom's template registry // used in conditional compilation #[allow(unused_mut)] - pub(crate) fn register_template(&mut self, mut template: Template<'static>) { + pub(crate) fn register_template( + &mut self, + mut template: Template<'static>, + to: &mut impl WriteMutations, + ) { let (path, byte_index) = template.name.rsplit_once(':').unwrap(); let byte_index = byte_index.parse::().unwrap(); @@ -458,22 +476,32 @@ impl VirtualDom { // If it's all dynamic nodes, then we don't need to register it if !template.is_completely_dynamic() { - self.mutations.templates.push(template); + to.register_template(template) } } } - pub(crate) fn create_dynamic_node(&mut self, parent: ElementRef, node: &DynamicNode) -> usize { + pub(crate) fn create_dynamic_node( + &mut self, + parent: ElementRef, + node: &DynamicNode, + to: &mut impl WriteMutations, + ) -> usize { use DynamicNode::*; match node { - Text(text) => self.create_dynamic_text(parent, text), - Placeholder(place) => self.create_placeholder(place, parent), - Component(component) => self.create_component_node(Some(parent), component), - Fragment(frag) => self.create_children(frag, Some(parent)), + Text(text) => self.create_dynamic_text(parent, text, to), + Placeholder(place) => self.create_placeholder(place, parent, to), + Component(component) => self.create_component_node(Some(parent), component, to), + Fragment(frag) => self.create_children(frag, Some(parent), to), } } - fn create_dynamic_text(&mut self, parent: ElementRef, text: &VText) -> usize { + fn create_dynamic_text( + &mut self, + parent: ElementRef, + text: &VText, + to: &mut impl WriteMutations, + ) -> usize { // Allocate a dynamic element reference for this text node let new_id = self.next_element(); @@ -481,11 +509,7 @@ impl VirtualDom { text.id.set(Some(new_id)); // Add the mutation to the list - self.mutations.push(HydrateText { - id: new_id, - path: &parent.path.path[1..], - value: &text.value, - }); + to.hydrate_text_node(&parent.path.path[1..], &text.value, new_id); // Since we're hydrating an existing node, we don't create any new nodes 0 @@ -495,6 +519,7 @@ impl VirtualDom { &mut self, placeholder: &VPlaceholder, parent: ElementRef, + to: &mut impl WriteMutations, ) -> usize { // Allocate a dynamic element reference for this text node let id = self.next_element(); @@ -506,10 +531,7 @@ impl VirtualDom { *placeholder.parent.borrow_mut() = Some(parent); // Assign the ID to the existing node in the template - self.mutations.push(AssignId { - path: &parent.path.path[1..], - id, - }); + to.assign_node_id(&parent.path.path[1..], id); // Since the placeholder is already in the DOM, we don't create any new nodes 0 @@ -519,11 +541,12 @@ impl VirtualDom { &mut self, parent: Option, component: &VComponent, + to: &mut impl WriteMutations, ) -> usize { use RenderReturn::*; // Load up a ScopeId for this vcomponent - let scope = self.load_scope_from_vcomponent(component); + let scope = self.load_scope_from_vcomponent(component, to); component.scope.set(Some(scope)); @@ -535,14 +558,18 @@ impl VirtualDom { // Create the component's root element Ready(t) => { self.assign_boundary_ref(parent, t); - self.create_scope(scope, t) + self.create_scope(scope, t, to) } - Aborted(t) => self.mount_aborted(t, parent), + Aborted(t) => self.mount_aborted(t, parent, to), } } /// Load a scope from a vcomponent. If the scope id doesn't exist, that means the component is currently "live" - fn load_scope_from_vcomponent(&mut self, component: &VComponent) -> ScopeId { + fn load_scope_from_vcomponent( + &mut self, + component: &VComponent, + to: &mut impl WriteMutations, + ) -> ScopeId { component.scope.get().unwrap_or_else(|| { self.new_scope(component.props.clone(), component.name) .context() @@ -550,9 +577,14 @@ impl VirtualDom { }) } - fn mount_aborted(&mut self, placeholder: &VPlaceholder, parent: Option) -> usize { + fn mount_aborted( + &mut self, + placeholder: &VPlaceholder, + parent: Option, + to: &mut impl WriteMutations, + ) -> usize { let id = self.next_element(); - self.mutations.push(Mutation::CreatePlaceholder { id }); + to.create_placeholder(id); placeholder.id.set(Some(id)); *placeholder.parent.borrow_mut() = parent; diff --git a/packages/core/src/diff.rs b/packages/core/src/diff.rs index 90f2d3d79..385f4a18e 100644 --- a/packages/core/src/diff.rs +++ b/packages/core/src/diff.rs @@ -3,7 +3,9 @@ use std::ops::Deref; use crate::{ any_props::AnyProps, arena::ElementId, - innerlude::{DirtyScope, ElementPath, ElementRef, VComponent, VPlaceholder, VText}, + innerlude::{ + DirtyScope, ElementPath, ElementRef, VComponent, VPlaceholder, VText, WriteMutations, + }, mutations::Mutation, nodes::RenderReturn, nodes::{DynamicNode, VNode}, @@ -16,7 +18,12 @@ use rustc_hash::{FxHashMap, FxHashSet}; use DynamicNode::*; impl VirtualDom { - pub(super) fn diff_scope(&mut self, scope: ScopeId, new_nodes: RenderReturn) { + pub(super) fn diff_scope( + &mut self, + scope: ScopeId, + new_nodes: RenderReturn, + to: &mut impl WriteMutations, + ) { self.runtime.scope_stack.borrow_mut().push(scope); let scope_state = &mut self.scopes[scope.0]; // Load the old and new bump arenas @@ -27,10 +34,10 @@ impl VirtualDom { match (&old, new) { // Normal pathway - (Ready(l), Ready(r)) => self.diff_node(l, r), + (Ready(l), Ready(r)) => self.diff_node(l, r, to), // Unwind the mutations if need be - (Ready(l), Aborted(p)) => self.diff_ok_to_err(l, p), + (Ready(l), Aborted(p)) => self.diff_ok_to_err(l, p, to), // Just move over the placeholder (Aborted(l), Aborted(r)) => { @@ -44,24 +51,19 @@ impl VirtualDom { l, [r], l.parent.borrow().expect("root node should not be none"), + to, ), }; self.runtime.scope_stack.borrow_mut().pop(); } - fn diff_ok_to_err(&mut self, l: &VNode, p: &VPlaceholder) { + fn diff_ok_to_err(&mut self, l: &VNode, p: &VPlaceholder, to: &mut impl WriteMutations) { let id = self.next_element(); p.id.set(Some(id)); *p.parent.borrow_mut() = l.parent.borrow().clone(); - self.mutations.push(Mutation::CreatePlaceholder { id }); + to.create_placeholder(id); - let pre_edits = self.mutations.edits.len(); - - self.remove_node(l, true); - - // We should always have a remove mutation - // Eventually we don't want to generate placeholders, so this might not be true. But it's true today - assert!(self.mutations.edits.len() > pre_edits); + self.remove_node(l, true, to); // We want to optimize the replace case to use one less mutation if possible // Since mutations are done in reverse, the last node removed will be the first in the stack @@ -72,7 +74,12 @@ impl VirtualDom { }; } - fn diff_node(&mut self, left_template: &VNode, right_template: &VNode) { + fn diff_node( + &mut self, + left_template: &VNode, + right_template: &VNode, + to: &mut impl WriteMutations, + ) { // If hot reloading is enabled, we need to make sure we're using the latest template #[cfg(debug_assertions)] { @@ -83,7 +90,7 @@ impl VirtualDom { right_template.template.set(template); if template != left_template.template.get() { let parent = left_template.parent.take(); - return self.replace(left_template, [right_template], parent); + return self.replace(left_template, [right_template], parent, to); } } } @@ -101,7 +108,7 @@ impl VirtualDom { // If the templates are different by name, we need to replace the entire template if templates_are_different(left_template, right_template) { - return self.light_diff_templates(left_template, right_template); + return self.light_diff_templates(left_template, right_template, to); } // If the templates are the same, we can diff the attributes and children @@ -117,7 +124,7 @@ impl VirtualDom { // If the attributes are different (or volatile), we need to update them if left_attr.value != right_attr.value || left_attr.volatile { - self.update_attribute(right_attr, left_attr); + self.update_attribute(right_attr, left_attr, to); } }); @@ -135,7 +142,7 @@ impl VirtualDom { }, scope: self.runtime.scope_stack.borrow().last().copied().unwrap(), }; - self.diff_dynamic_node(left_node, right_node, current_ref); + self.diff_dynamic_node(left_node, right_node, current_ref, to); }); // Make sure the roots get transferred over while we're here @@ -153,30 +160,36 @@ impl VirtualDom { left_node: &DynamicNode, right_node: &DynamicNode, parent: ElementRef, + to: &mut impl WriteMutations, ) { match (left_node, right_node) { - (Text(left), Text(right)) => self.diff_vtext(left, right), - (Fragment(left), Fragment(right)) => self.diff_non_empty_fragment(left, right, parent), + (Text(left), Text(right)) => self.diff_vtext(left, right, to), + (Fragment(left), Fragment(right)) => self.diff_non_empty_fragment(left, right, parent, to), (Placeholder(left), Placeholder(right)) => { right.id.set(left.id.get()); *right.parent.borrow_mut() = left.parent.borrow().clone(); }, - (Component(left), Component(right)) => self.diff_vcomponent(left, right, Some(parent)), - (Placeholder(left), Fragment(right)) => self.replace_placeholder(left, right, parent), - (Fragment(left), Placeholder(right)) => self.node_to_placeholder(left, right, parent), + (Component(left), Component(right)) => self.diff_vcomponent(left, right, Some(parent), to), + (Placeholder(left), Fragment(right)) => self.replace_placeholder(left, right, parent, to), + (Fragment(left), Placeholder(right)) => self.node_to_placeholder(left, right, parent, to), _ => todo!("This is an usual custom case for dynamic nodes. We don't know how to handle it yet."), }; } - fn update_attribute(&mut self, right_attr: &Attribute, left_attr: &Attribute) { + fn update_attribute( + &mut self, + right_attr: &Attribute, + left_attr: &Attribute, + to: &mut impl WriteMutations, + ) { let name = &left_attr.name; let value = &right_attr.value; - self.mutations.push(Mutation::SetAttribute { - id: left_attr.mounted_element.get(), - ns: right_attr.namespace, + to.set_attribute( name, + right_attr.namespace, value, - }); + left_attr.mounted_element.get(), + ); } fn diff_vcomponent( @@ -184,6 +197,7 @@ impl VirtualDom { left: &VComponent, right: &VComponent, parent: Option, + to: &mut impl WriteMutations, ) { if std::ptr::eq(left, right) { return; @@ -191,7 +205,7 @@ impl VirtualDom { // Replace components that have different render fns if left.render_fn != right.render_fn { - return self.replace_vcomponent(right, left, parent); + return self.replace_vcomponent(right, left, parent, to); } // Make sure the new vcomponent has the right scopeid associated to it @@ -221,7 +235,7 @@ impl VirtualDom { // Now run the component and diff it let new = self.run_scope(scope_id); - self.diff_scope(scope_id, new); + self.diff_scope(scope_id, new, to); self.dirty_scopes.remove(&DirtyScope { height: self.runtime.get_context(scope_id).unwrap().height, @@ -234,14 +248,11 @@ impl VirtualDom { right: &VComponent, left: &VComponent, parent: Option, + to: &mut impl WriteMutations, ) { let m = self.create_component_node(parent, right); - let pre_edits = self.mutations.edits.len(); - - self.remove_component_node(left, true); - - assert!(self.mutations.edits.len() > pre_edits); + self.remove_component_node(left, true, to); // We want to optimize the replace case to use one less mutation if possible // Since mutations are done in reverse, the last node removed will be the first in the stack @@ -289,13 +300,13 @@ impl VirtualDom { /// Component { ..props } /// } /// ``` - fn light_diff_templates(&mut self, left: &VNode, right: &VNode) { + fn light_diff_templates(&mut self, left: &VNode, right: &VNode, to: &mut impl WriteMutations) { let parent = left.parent.take(); match matching_components(left, right) { - None => self.replace(left, [right], parent), + None => self.replace(left, [right], parent, to), Some(components) => components .into_iter() - .for_each(|(l, r)| self.diff_vcomponent(l, r, parent)), + .for_each(|(l, r)| self.diff_vcomponent(l, r, parent, to)), } } @@ -303,19 +314,22 @@ impl VirtualDom { /// /// This just moves the ID of the old node over to the new node, and then sets the text of the new node if it's /// different. - fn diff_vtext(&mut self, left: &VText, right: &VText) { + fn diff_vtext(&mut self, left: &VText, right: &VText, to: &mut impl WriteMutations) { let id = left.id.get().unwrap_or_else(|| self.next_element()); right.id.set(Some(id)); if left.value != right.value { - self.mutations.push(Mutation::SetText { - id, - value: &right.value, - }); + to.set_node_text(&right.value, id); } } - fn diff_non_empty_fragment(&mut self, old: &[VNode], new: &[VNode], parent: ElementRef) { + fn diff_non_empty_fragment( + &mut self, + old: &[VNode], + new: &[VNode], + parent: ElementRef, + to: &mut impl WriteMutations, + ) { let new_is_keyed = new[0].key.is_some(); let old_is_keyed = old[0].key.is_some(); debug_assert!( @@ -328,9 +342,9 @@ impl VirtualDom { ); if new_is_keyed && old_is_keyed { - self.diff_keyed_children(old, new, parent); + self.diff_keyed_children(old, new, parent, to); } else { - self.diff_non_keyed_children(old, new, parent); + self.diff_non_keyed_children(old, new, parent, to); } } @@ -342,7 +356,13 @@ impl VirtualDom { // [... parent] // // the change list stack is in the same state when this function returns. - fn diff_non_keyed_children(&mut self, old: &[VNode], new: &[VNode], parent: ElementRef) { + fn diff_non_keyed_children( + &mut self, + old: &[VNode], + new: &[VNode], + parent: ElementRef, + to: &mut impl WriteMutations, + ) { use std::cmp::Ordering; // Handled these cases in `diff_children` before calling this function. @@ -350,15 +370,15 @@ impl VirtualDom { debug_assert!(!old.is_empty()); match old.len().cmp(&new.len()) { - Ordering::Greater => self.remove_nodes(&old[new.len()..]), + Ordering::Greater => self.remove_nodes(&old[new.len()..], to), Ordering::Less => { - self.create_and_insert_after(&new[old.len()..], old.last().unwrap(), parent) + self.create_and_insert_after(&new[old.len()..], old.last().unwrap(), parent, to) } Ordering::Equal => {} } for (new, old) in new.iter().zip(old.iter()) { - self.diff_node(old, new); + self.diff_node(old, new, to); } } @@ -378,7 +398,13 @@ impl VirtualDom { // https://github.com/infernojs/inferno/blob/36fd96/packages/inferno/src/DOM/patching.ts#L530-L739 // // The stack is empty upon entry. - fn diff_keyed_children(&mut self, old: &[VNode], new: &[VNode], parent: ElementRef) { + fn diff_keyed_children( + &mut self, + old: &[VNode], + new: &[VNode], + parent: ElementRef, + to: &mut impl WriteMutations, + ) { if cfg!(debug_assertions) { let mut keys = rustc_hash::FxHashSet::default(); let mut assert_unique_keys = |children: &[VNode]| { @@ -406,7 +432,7 @@ impl VirtualDom { // // `shared_prefix_count` is the count of how many nodes at the start of // `new` and `old` share the same keys. - let (left_offset, right_offset) = match self.diff_keyed_ends(old, new, parent) { + let (left_offset, right_offset) = match self.diff_keyed_ends(old, new, parent, to) { Some(count) => count, None => return, }; @@ -425,25 +451,25 @@ impl VirtualDom { if new_middle.is_empty() { // remove the old elements - self.remove_nodes(old_middle); + self.remove_nodes(old_middle, to); } else if old_middle.is_empty() { // there were no old elements, so just create the new elements // we need to find the right "foothold" though - we shouldn't use the "append" at all if left_offset == 0 { // insert at the beginning of the old list let foothold = &old[old.len() - right_offset]; - self.create_and_insert_before(new_middle, foothold, parent); + self.create_and_insert_before(new_middle, foothold, parent, to); } else if right_offset == 0 { // insert at the end the old list let foothold = old.last().unwrap(); - self.create_and_insert_after(new_middle, foothold, parent); + self.create_and_insert_after(new_middle, foothold, parent, to); } else { // inserting in the middle let foothold = &old[left_offset - 1]; - self.create_and_insert_after(new_middle, foothold, parent); + self.create_and_insert_after(new_middle, foothold, parent, to); } } else { - self.diff_keyed_middle(old_middle, new_middle, parent); + self.diff_keyed_middle(old_middle, new_middle, parent, to); } } @@ -457,6 +483,7 @@ impl VirtualDom { old: &[VNode], new: &[VNode], parent: ElementRef, + to: &mut impl WriteMutations, ) -> Option<(usize, usize)> { let mut left_offset = 0; @@ -465,21 +492,21 @@ impl VirtualDom { if old.key != new.key { break; } - self.diff_node(old, new); + self.diff_node(old, new, to); left_offset += 1; } // If that was all of the old children, then create and append the remaining // new children and we're finished. if left_offset == old.len() { - self.create_and_insert_after(&new[left_offset..], old.last().unwrap(), parent); + self.create_and_insert_after(&new[left_offset..], old.last().unwrap(), parent, to); return None; } // And if that was all of the new children, then remove all of the remaining // old children and we're finished. if left_offset == new.len() { - self.remove_nodes(&old[left_offset..]); + self.remove_nodes(&old[left_offset..], to); return None; } @@ -490,7 +517,7 @@ impl VirtualDom { if old.key != new.key { break; } - self.diff_node(old, new); + self.diff_node(old, new, to); right_offset += 1; } @@ -511,7 +538,13 @@ impl VirtualDom { // // Upon exit from this function, it will be restored to that same self. #[allow(clippy::too_many_lines)] - fn diff_keyed_middle(&mut self, old: &[VNode], new: &[VNode], parent: ElementRef) { + fn diff_keyed_middle( + &mut self, + old: &[VNode], + new: &[VNode], + parent: ElementRef, + to: &mut impl WriteMutations, + ) { /* 1. Map the old keys into a numerical ordering based on indices. 2. Create a map of old key to its index @@ -567,8 +600,8 @@ impl VirtualDom { // create the new children afresh. if shared_keys.is_empty() { if !old.is_empty() { - self.remove_nodes(&old[1..]); - self.replace(&old[0], new, Some(parent)); + self.remove_nodes(&old[1..], to); + self.replace(&old[0], new, Some(parent), to); } else { // I think this is wrong - why are we appending? // only valid of the if there are no trailing elements @@ -584,7 +617,7 @@ impl VirtualDom { for child in old { let key = child.key.unwrap(); if !shared_keys.contains(&key) { - self.remove_node(child, true); + self.remove_node(child, true, to); } } @@ -611,7 +644,7 @@ impl VirtualDom { } for idx in &lis_sequence { - self.diff_node(&old[new_index_to_old_index[*idx]], &new[*idx]); + self.diff_node(&old[new_index_to_old_index[*idx]], &new[*idx], to); } let mut nodes_created = 0; @@ -625,17 +658,14 @@ impl VirtualDom { if old_index == u32::MAX as usize { nodes_created += self.create(new_node); } else { - self.diff_node(&old[old_index], new_node); - nodes_created += self.push_all_real_nodes(new_node); + self.diff_node(&old[old_index], new_node, to); + nodes_created += self.push_all_real_nodes(new_node, to); } } let id = self.find_last_element(&new[last]); if nodes_created > 0 { - self.mutations.push(Mutation::InsertAfter { - id, - m: nodes_created, - }) + to.insert_nodes_after(id, nodes_created) } nodes_created = 0; } @@ -651,17 +681,14 @@ impl VirtualDom { if old_index == u32::MAX as usize { nodes_created += self.create(new_node); } else { - self.diff_node(&old[old_index], new_node); - nodes_created += self.push_all_real_nodes(new_node); + self.diff_node(&old[old_index], new_node, to); + nodes_created += self.push_all_real_nodes(new_node, to); } } let id = self.find_first_element(&new[last]); if nodes_created > 0 { - self.mutations.push(Mutation::InsertBefore { - id, - m: nodes_created, - }); + to.insert_nodes_before(id, nodes_created); } nodes_created = 0; @@ -677,23 +704,20 @@ impl VirtualDom { if old_index == u32::MAX as usize { nodes_created += self.create(new_node); } else { - self.diff_node(&old[old_index], new_node); - nodes_created += self.push_all_real_nodes(new_node); + self.diff_node(&old[old_index], new_node, to); + nodes_created += self.push_all_real_nodes(new_node, to); } } let id = self.find_first_element(&new[first_lis]); if nodes_created > 0 { - self.mutations.push(Mutation::InsertBefore { - id, - m: nodes_created, - }); + to.insert_nodes_before(id, nodes_created); } } } /// Push all the real nodes on the stack - fn push_all_real_nodes(&mut self, node: &VNode) -> usize { + fn push_all_real_nodes(&mut self, node: &VNode, to: &mut impl WriteMutations) -> usize { node.template .get() .roots @@ -703,35 +727,29 @@ impl VirtualDom { let node = match node.dynamic_root(idx) { Some(node) => node, None => { - self.mutations.push(Mutation::PushRoot { - id: node.root_ids.borrow()[idx], - }); + to.push_root(node.root_ids.borrow()[idx]); return 1; } }; match node { Text(t) => { - self.mutations.push(Mutation::PushRoot { - id: t.id.get().unwrap(), - }); + to.push_root(t.id.get().unwrap()); 1 } Placeholder(t) => { - self.mutations.push(Mutation::PushRoot { - id: t.id.get().unwrap(), - }); + to.push_root(t.id.get().unwrap()); 1 } Fragment(nodes) => nodes .iter() - .map(|node| self.push_all_real_nodes(node)) + .map(|node| self.push_all_real_nodes(node, to)) .sum(), Component(comp) => { let scope = comp.scope.get().unwrap(); match self.get_scope(scope).unwrap().root_node() { - RenderReturn::Ready(node) => self.push_all_real_nodes(node), + RenderReturn::Ready(node) => self.push_all_real_nodes(node, to), RenderReturn::Aborted(_node) => todo!(), } } @@ -744,6 +762,7 @@ impl VirtualDom { &mut self, nodes: impl IntoIterator, parent: Option, + to: &mut impl WriteMutations, ) -> usize { nodes .into_iter() @@ -754,16 +773,28 @@ impl VirtualDom { .sum() } - fn create_and_insert_before(&mut self, new: &[VNode], before: &VNode, parent: ElementRef) { - let m = self.create_children(new, Some(parent)); + fn create_and_insert_before( + &mut self, + new: &[VNode], + before: &VNode, + parent: ElementRef, + to: &mut impl WriteMutations, + ) { + let m = self.create_children(new, Some(parent), to); let id = self.find_first_element(before); - self.mutations.push(Mutation::InsertBefore { id, m }) + to.insert_nodes_before(id, m); } - fn create_and_insert_after(&mut self, new: &[VNode], after: &VNode, parent: ElementRef) { - let m = self.create_children(new, Some(parent)); + fn create_and_insert_after( + &mut self, + new: &[VNode], + after: &VNode, + parent: ElementRef, + to: &mut impl WriteMutations, + ) { + let m = self.create_children(new, Some(parent), to); let id = self.find_last_element(after); - self.mutations.push(Mutation::InsertAfter { id, m }) + to.insert_nodes_after(id, m); } /// Simply replace a placeholder with a list of nodes @@ -772,10 +803,11 @@ impl VirtualDom { l: &VPlaceholder, r: impl IntoIterator, parent: ElementRef, + to: &mut impl WriteMutations, ) { - let m = self.create_children(r, Some(parent)); + let m = self.create_children(r, Some(parent), to); let id = l.id.get().unwrap(); - self.mutations.push(Mutation::ReplaceWith { id, m }); + to.replace_with(id, m); self.reclaim(id); } @@ -784,16 +816,11 @@ impl VirtualDom { left: &VNode, right: impl IntoIterator, parent: Option, + to: &mut impl WriteMutations, ) { - let m = self.create_children(right, parent); + let m = self.create_children(right, parent, to); - let pre_edits = self.mutations.edits.len(); - - self.remove_node(left, true); - - // We should always have a remove mutation - // Eventually we don't want to generate placeholders, so this might not be true. But it's true today - assert!(self.mutations.edits.len() > pre_edits); + self.remove_node(left, true, to); // We want to optimize the replace case to use one less mutation if possible // Since mutations are done in reverse, the last node removed will be the first in the stack @@ -804,17 +831,22 @@ impl VirtualDom { }; } - fn node_to_placeholder(&mut self, l: &[VNode], r: &VPlaceholder, parent: ElementRef) { + fn node_to_placeholder( + &mut self, + l: &[VNode], + r: &VPlaceholder, + parent: ElementRef, + to: &mut impl WriteMutations, + ) { // Create the placeholder first, ensuring we get a dedicated ID for the placeholder let placeholder = self.next_element(); r.id.set(Some(placeholder)); r.parent.borrow_mut().replace(parent); - self.mutations - .push(Mutation::CreatePlaceholder { id: placeholder }); + to.create_placeholder(placeholder); - self.remove_nodes(l); + self.remove_nodes(l, to); // We want to optimize the replace case to use one less mutation if possible // Since mutations are done in reverse, the last node removed will be the first in the stack @@ -827,43 +859,43 @@ impl VirtualDom { /// Remove these nodes from the dom /// Wont generate mutations for the inner nodes - fn remove_nodes(&mut self, nodes: &[VNode]) { + fn remove_nodes(&mut self, nodes: &[VNode], to: &mut impl WriteMutations) { nodes .iter() .rev() - .for_each(|node| self.remove_node(node, true)); + .for_each(|node| self.remove_node(node, true, to)); } - fn remove_node(&mut self, node: &VNode, gen_muts: bool) { + fn remove_node(&mut self, node: &VNode, gen_muts: bool, to: &mut impl WriteMutations) { // Clean up any attributes that have claimed a static node as dynamic for mount/unmounta // Will not generate mutations! - self.reclaim_attributes(node); + self.reclaim_attributes(node, to); // Remove the nested dynamic nodes // We don't generate mutations for these, as they will be removed by the parent (in the next line) // But we still need to make sure to reclaim them from the arena and drop their hooks, etc - self.remove_nested_dyn_nodes(node); + self.remove_nested_dyn_nodes(node, to); // Clean up the roots, assuming we need to generate mutations for these // This is done last in order to preserve Node ID reclaim order (reclaim in reverse order of claim) - self.reclaim_roots(node, gen_muts); + self.reclaim_roots(node, gen_muts, to); } - fn reclaim_roots(&mut self, node: &VNode, gen_muts: bool) { + fn reclaim_roots(&mut self, node: &VNode, gen_muts: bool, to: &mut impl WriteMutations) { for (idx, _) in node.template.get().roots.iter().enumerate() { if let Some(dy) = node.dynamic_root(idx) { - self.remove_dynamic_node(dy, gen_muts); + self.remove_dynamic_node(dy, gen_muts, to); } else { let id = node.root_ids.borrow()[idx]; if gen_muts { - self.mutations.push(Mutation::Remove { id }); + to.remove_node(id); } self.reclaim(id); } } } - fn reclaim_attributes(&mut self, node: &VNode) { + fn reclaim_attributes(&mut self, node: &VNode, to: &mut impl WriteMutations) { let mut id = None; for (idx, attr) in node.dynamic_attrs.iter().enumerate() { // We'll clean up the root nodes either way, so don't worry @@ -894,7 +926,7 @@ impl VirtualDom { } } - fn remove_nested_dyn_nodes(&mut self, node: &VNode) { + fn remove_nested_dyn_nodes(&mut self, node: &VNode, to: &mut impl WriteMutations) { for (idx, dyn_node) in node.dynamic_nodes.iter().enumerate() { let path_len = node .template @@ -904,41 +936,56 @@ impl VirtualDom { .map(|path| path.len()); // Roots are cleaned up automatically above and nodes with a empty path are placeholders if let Some(2..) = path_len { - self.remove_dynamic_node(dyn_node, false) + self.remove_dynamic_node(dyn_node, false, to) } } } - fn remove_dynamic_node(&mut self, node: &DynamicNode, gen_muts: bool) { + fn remove_dynamic_node( + &mut self, + node: &DynamicNode, + gen_muts: bool, + to: &mut impl WriteMutations, + ) { match node { - Component(comp) => self.remove_component_node(comp, gen_muts), - Text(t) => self.remove_text_node(t, gen_muts), - Placeholder(t) => self.remove_placeholder(t, gen_muts), + Component(comp) => self.remove_component_node(comp, gen_muts, to), + Text(t) => self.remove_text_node(t, gen_muts, to), + Placeholder(t) => self.remove_placeholder(t, gen_muts, to), Fragment(nodes) => nodes .iter() - .for_each(|node| self.remove_node(node, gen_muts)), + .for_each(|node| self.remove_node(node, gen_muts, to)), }; } - fn remove_placeholder(&mut self, t: &VPlaceholder, gen_muts: bool) { + fn remove_placeholder( + &mut self, + t: &VPlaceholder, + gen_muts: bool, + to: &mut impl WriteMutations, + ) { if let Some(id) = t.id.take() { if gen_muts { - self.mutations.push(Mutation::Remove { id }); + to.remove_node(id); } self.reclaim(id) } } - fn remove_text_node(&mut self, t: &VText, gen_muts: bool) { + fn remove_text_node(&mut self, t: &VText, gen_muts: bool, to: &mut impl WriteMutations) { if let Some(id) = t.id.take() { if gen_muts { - self.mutations.push(Mutation::Remove { id }); + to.remove_node(id); } self.reclaim(id) } } - fn remove_component_node(&mut self, comp: &VComponent, gen_muts: bool) { + fn remove_component_node( + &mut self, + comp: &VComponent, + gen_muts: bool, + to: &mut impl WriteMutations, + ) { // Remove the component reference from the vcomponent so they're not tied together let scope = comp .scope @@ -947,8 +994,10 @@ impl VirtualDom { // Remove the component from the dom match unsafe { self.get_scope(scope).unwrap().root_node() } { - RenderReturn::Ready(t) => self.remove_node(t, gen_muts), - RenderReturn::Aborted(placeholder) => self.remove_placeholder(placeholder, gen_muts), + RenderReturn::Ready(t) => self.remove_node(t, gen_muts, to), + RenderReturn::Aborted(placeholder) => { + self.remove_placeholder(placeholder, gen_muts, to) + } }; // Now drop all the resouces diff --git a/packages/core/src/lib.rs b/packages/core/src/lib.rs index e5576310f..570713a91 100644 --- a/packages/core/src/lib.rs +++ b/packages/core/src/lib.rs @@ -74,9 +74,9 @@ pub(crate) mod innerlude { pub use crate::innerlude::{ fc_to_builder, vdom_is_rendering, AnyValue, Attribute, AttributeValue, CapturedError, - Component, DynamicNode, Element, ElementId, Event, Fragment, IntoDynNode, Mutation, Mutations, - Properties, RenderReturn, ScopeId, ScopeState, TaskId, Template, TemplateAttribute, - TemplateNode, VComponent, VNode, VPlaceholder, VText, VirtualDom, + Component, DynamicNode, Element, ElementId, Event, Fragment, IntoDynNode, Mutation, + MutationsVec, Properties, RenderReturn, ScopeId, ScopeState, TaskId, Template, + TemplateAttribute, TemplateNode, VComponent, VNode, VPlaceholder, VText, VirtualDom, }; /// The purpose of this module is to alleviate imports of many common types diff --git a/packages/core/src/mutations.rs b/packages/core/src/mutations.rs index 021eb1406..6ac45b690 100644 --- a/packages/core/src/mutations.rs +++ b/packages/core/src/mutations.rs @@ -2,7 +2,7 @@ use rustc_hash::FxHashSet; use crate::{arena::ElementId, AttributeValue, ScopeId, Template}; -/// A container for all the relevant steps to modify the Real DOM +/// Something that can handle the mutations that are generated by the diffing process and apply them to the Real DOM /// /// This object provides a bunch of important information for a renderer to use patch the Real Dom with the state of the /// VirtualDom. This includes the scopes that were modified, the templates that were discovered, and a list of changes @@ -13,42 +13,128 @@ use crate::{arena::ElementId, AttributeValue, ScopeId, Template}; /// Templates, however, apply to all subtrees, not just target subtree. /// /// Mutations are the only link between the RealDOM and the VirtualDOM. -#[derive(Debug, Default)] -#[must_use = "not handling edits can lead to visual inconsistencies in UI"] -pub struct Mutations<'a> { - /// The ID of the subtree that these edits are targetting - pub subtree: usize, +pub trait WriteMutations { + /// Register a template with the renderer + fn register_template(&mut self, template: Template<'static>); - /// The list of Scopes that were diffed, created, and removed during the Diff process. - pub dirty_scopes: FxHashSet, - - /// Any templates encountered while diffing the DOM. + /// Add these m children to the target element /// - /// These must be loaded into a cache before applying the edits - pub templates: Vec>, + /// Id: The ID of the element being mounted to + /// M: The number of nodes on the stack to append to the target element + fn append_children(&mut self, id: ElementId, m: usize); - /// Any mutations required to patch the renderer to match the layout of the VirtualDom - pub edits: Vec>, -} - -impl<'a> Mutations<'a> { - /// Rewrites IDs to just be "template", so you can compare the mutations + /// Assign the element at the given path the target ElementId. /// - /// Used really only for testing - pub fn santize(mut self) -> Self { - for edit in self.edits.iter_mut() { - if let Mutation::LoadTemplate { name, .. } = edit { - *name = "template" - } - } + /// The path is in the form of a list of indices based on children. Templates cannot have more than 255 children per + /// element, hence the use of a single byte. + /// + /// Path: The path of the child of the topmost node on the stack. A path of `[]` represents the topmost node. A path of `[0]` represents the first child. `[0,1,2]` represents 1st child's 2nd child's 3rd child. + /// Id: The ID we're assigning to this element/placeholder. This will be used later to modify the element or replace it with another element. + fn assign_node_id(&mut self, path: &'static [u8], id: ElementId); - self - } + /// Create a placeholder in the DOM that we will use later. + /// + /// Dioxus currently requires the use of placeholders to maintain a re-entrance point for things like list diffing + /// + /// Id: The ID we're assigning to this element/placeholder. This will be used later to modify the element or replace it with another element. + fn create_placeholder(&mut self, id: ElementId); - /// Push a new mutation into the dom_edits list - pub(crate) fn push(&mut self, mutation: Mutation<'static>) { - self.edits.push(mutation) - } + /// Create a node specifically for text with the given value + /// + /// Value: The text content of this text node + /// Id: The ID we're assigning to this specific text nodes. This will be used later to modify the element or replace it with another element. + fn create_text_node(&mut self, value: &str, id: ElementId); + + /// Hydrate an existing text node at the given path with the given text. + /// + /// Assign this text node the given ID since we will likely need to modify this text at a later point + /// + /// Path: The path of the child of the topmost node on the stack. A path of `[]` represents the topmost node. A path of `[0]` represents the first child. `[0,1,2]` represents 1st child's 2nd child's 3rd child. + /// Value: The value of the textnode that we want to set the placeholder with + /// Id: The ID we're assigning to this specific text nodes. This will be used later to modify the element or replace it with another element. + fn hydrate_text_node(&mut self, path: &'static [u8], value: &str, id: ElementId); + + /// Load and clone an existing node from a template saved under that specific name + /// + /// Dioxus guarantees that the renderer will have already been provided the template. + /// When the template is picked up in the template list, it should be saved under its "name" - here, the name + /// + /// Name: The unique "name" of the template based on the template location. When paired with `rsx!`, this is autogenerated + /// Index: The index root we loading from the template. The template is stored as a list of nodes. This index represents the position of that root + /// Id: The ID we're assigning to this element being loaded from the template (This will be used later to move the element around in lists) + fn load_template(&mut self, name: &'static str, index: usize, id: ElementId); + + /// Replace the target element (given by its ID) with the topmost m nodes on the stack + /// + /// id: The ID of the node we're going to replace with new nodes + /// m: The number of nodes on the stack to replace the target element with + fn replace_node_with(&mut self, id: ElementId, m: usize); + + /// Replace an existing element in the template at the given path with the m nodes on the stack + /// + /// Path: The path of the child of the topmost node on the stack. A path of `[]` represents the topmost node. A path of `[0]` represents the first child. `[0,1,2]` represents 1st child's 2nd child's 3rd child. + /// M: The number of nodes on the stack to replace the target element with + fn replace_placeholder_with_nodes(&mut self, path: &'static [u8], m: usize); + + /// Insert a number of nodes after a given node. + /// + /// Id: The ID of the node to insert after. + /// M: The number of nodes on the stack to insert after the target node. + fn insert_nodes_after(&mut self, id: ElementId, m: usize); + + /// Insert a number of nodes before a given node. + /// + /// Id: The ID of the node to insert before. + /// M: The number of nodes on the stack to insert before the target node. + fn insert_nodes_before(&mut self, id: ElementId, m: usize); + + /// Set the value of a node's attribute. + /// + /// Name: The name of the attribute to set. + /// NS: The (optional) namespace of the attribute. For instance, "style" is in the "style" namespace. + /// Value: The value of the attribute. + /// Id: The ID of the node to set the attribute of. + fn set_attribute( + &mut self, + name: &'static str, + ns: Option<&'static str>, + value: &AttributeValue, + id: ElementId, + ); + + /// Set the text content of a node. + /// + /// Value: The textcontent of the node + /// Id: The ID of the node to set the textcontent of. + fn set_node_text(&mut self, value: &str, id: ElementId); + + /// Create a new Event Listener. + /// + /// Name: The name of the event to listen for. + /// Id: The ID of the node to attach the listener to. + fn create_event_listener(&mut self, name: &'static str, id: ElementId); + + /// Remove an existing Event Listener. + /// + /// Name: The name of the event to remove. + /// Id: The ID of the node to remove. + fn remove_event_listener(&mut self, name: &'static str, id: ElementId); + + /// Remove a particular node from the DOM + /// + /// Id: The ID of the node to remove. + fn remove_node(&mut self, id: ElementId); + + /// Push the given root node onto our stack. + /// + /// Id: The ID of the root node to push. + fn push_root(&mut self, id: ElementId) {} + + /// Swap to a new subtree + fn swap_subtree(&mut self, subtree_index: usize) {} + + /// Mark a scope as dirty + fn mark_scope_dirty(&mut self, scope_id: ScopeId) {} } /// A `Mutation` represents a single instruction for the renderer to use to modify the UI tree to match the state @@ -56,7 +142,7 @@ impl<'a> Mutations<'a> { /// /// These edits can be serialized and sent over the network or through any interface #[derive(Debug, PartialEq)] -pub enum Mutation<'a> { +pub enum Mutation { /// Add these m children to the target element AppendChildren { /// The ID of the element being mounted to @@ -98,7 +184,7 @@ pub enum Mutation<'a> { /// Create a node specifically for text with the given value CreateTextNode { /// The text content of this text node - value: &'a str, + value: String, /// The ID we're assigning to this specific text nodes /// @@ -117,7 +203,7 @@ pub enum Mutation<'a> { path: &'static [u8], /// The value of the textnode that we want to set the placeholder with - value: &'a str, + value: String, /// The ID we're assigning to this specific text nodes /// @@ -186,23 +272,23 @@ pub enum Mutation<'a> { /// Set the value of a node's attribute. SetAttribute { /// The name of the attribute to set. - name: &'a str, - - /// The value of the attribute. - value: &'a AttributeValue, - - /// The ID of the node to set the attribute of. - id: ElementId, + name: &'static str, /// The (optional) namespace of the attribute. /// For instance, "style" is in the "style" namespace. - ns: Option<&'a str>, + ns: Option<&'static str>, + + /// The value of the attribute. + value: AttributeValue, + + /// The ID of the node to set the attribute of. + id: ElementId, }, /// Set the textcontent of a node. SetText { /// The textcontent of the node - value: &'a str, + value: String, /// The ID of the node to set the textcontent of. id: ElementId, @@ -211,7 +297,7 @@ pub enum Mutation<'a> { /// Create a new Event Listener. NewEventListener { /// The name of the event to listen for. - name: &'a str, + name: String, /// The ID of the node to attach the listener to. id: ElementId, @@ -220,7 +306,7 @@ pub enum Mutation<'a> { /// Remove an existing Event Listener. RemoveEventListener { /// The name of the event to remove. - name: &'a str, + name: String, /// The ID of the node to remove. id: ElementId, @@ -238,3 +324,186 @@ pub enum Mutation<'a> { id: ElementId, }, } + +/// A static list of mutations that can be applied to the DOM. Note: this list does not contain any `Any` attribute values +pub struct MutationsVec { + /// The list of Scopes that were diffed, created, and removed during the Diff process. + pub dirty_scopes: FxHashSet, + + /// Any templates encountered while diffing the DOM. + /// + /// These must be loaded into a cache before applying the edits + pub templates: Vec>, + + /// Any mutations required to patch the renderer to match the layout of the VirtualDom + pub edits: Vec, +} + +impl MutationsVec { + /// Rewrites IDs to just be "template", so you can compare the mutations + /// + /// Used really only for testing + pub fn santize(mut self) -> Self { + for edit in self.edits.iter_mut() { + if let Mutation::LoadTemplate { name, .. } = edit { + *name = "template" + } + } + + self + } +} + +impl WriteMutations for MutationsVec { + fn register_template(&mut self, template: Template<'static>) { + self.templates.push(template) + } + + fn append_children(&mut self, id: ElementId, m: usize) { + self.edits.push(Mutation::AppendChildren { id, m }) + } + + fn assign_node_id(&mut self, path: &'static [u8], id: ElementId) { + self.edits.push(Mutation::AssignId { path, id }) + } + + fn create_placeholder(&mut self, id: ElementId) { + self.edits.push(Mutation::CreatePlaceholder { id }) + } + + fn create_text_node(&mut self, value: &str, id: ElementId) { + self.edits.push(Mutation::CreateTextNode { + value: value.into(), + id, + }) + } + + fn hydrate_text_node(&mut self, path: &'static [u8], value: &str, id: ElementId) { + self.edits.push(Mutation::HydrateText { + path, + value: value.into(), + id, + }) + } + + fn load_template(&mut self, name: &'static str, index: usize, id: ElementId) { + self.edits.push(Mutation::LoadTemplate { name, index, id }) + } + + fn replace_node_with(&mut self, id: ElementId, m: usize) { + self.edits.push(Mutation::ReplaceWith { id, m }) + } + + fn replace_placeholder_with_nodes(&mut self, path: &'static [u8], m: usize) { + self.edits.push(Mutation::ReplacePlaceholder { path, m }) + } + + fn insert_nodes_after(&mut self, id: ElementId, m: usize) { + self.edits.push(Mutation::InsertAfter { id, m }) + } + + fn insert_nodes_before(&mut self, id: ElementId, m: usize) { + self.edits.push(Mutation::InsertBefore { id, m }) + } + + fn set_attribute( + &mut self, + name: &'static str, + ns: Option<&'static str>, + value: &AttributeValue, + id: ElementId, + ) { + self.edits.push(Mutation::SetAttribute { + name, + ns, + value: match value { + AttributeValue::Text(s) => AttributeValue::Text(s.clone()), + AttributeValue::Bool(b) => AttributeValue::Bool(*b), + AttributeValue::Float(n) => AttributeValue::Float(*n), + AttributeValue::Int(n) => AttributeValue::Int(*n), + AttributeValue::None => AttributeValue::None, + _ => panic!("Cannot serialize attribute value"), + }, + id, + }) + } + + fn set_node_text(&mut self, value: &str, id: ElementId) { + self.edits.push(Mutation::SetText { + value: value.into(), + id, + }) + } + + fn create_event_listener(&mut self, name: &'static str, id: ElementId) { + self.edits.push(Mutation::NewEventListener { + name: name.into(), + id, + }) + } + + fn remove_event_listener(&mut self, name: &'static str, id: ElementId) { + self.edits.push(Mutation::RemoveEventListener { + name: name.into(), + id, + }) + } + + fn remove_node(&mut self, id: ElementId) { + self.edits.push(Mutation::Remove { id }) + } + + fn push_root(&mut self, id: ElementId) { + self.edits.push(Mutation::PushRoot { id }) + } + + fn swap_subtree(&mut self, _subtree_index: usize) {} + + fn mark_scope_dirty(&mut self, scope_id: ScopeId) { + self.dirty_scopes.insert(scope_id); + } +} + +/// A struct that ignores all mutations +pub struct NoOpMutations; + +impl WriteMutations for NoOpMutations { + fn register_template(&mut self, template: Template<'static>) {} + + fn append_children(&mut self, id: ElementId, m: usize) {} + + fn assign_node_id(&mut self, path: &'static [u8], id: ElementId) {} + + fn create_placeholder(&mut self, id: ElementId) {} + + fn create_text_node(&mut self, value: &str, id: ElementId) {} + + fn hydrate_text_node(&mut self, path: &'static [u8], value: &str, id: ElementId) {} + + fn load_template(&mut self, name: &'static str, index: usize, id: ElementId) {} + + fn replace_node_with(&mut self, id: ElementId, m: usize) {} + + fn replace_placeholder_with_nodes(&mut self, path: &'static [u8], m: usize) {} + + fn insert_nodes_after(&mut self, id: ElementId, m: usize) {} + + fn insert_nodes_before(&mut self, id: ElementId, m: usize) {} + + fn set_attribute( + &mut self, + name: &'static str, + ns: Option<&'static str>, + value: &AttributeValue, + id: ElementId, + ) { + } + + fn set_node_text(&mut self, value: &str, id: ElementId) {} + + fn create_event_listener(&mut self, name: &'static str, id: ElementId) {} + + fn remove_event_listener(&mut self, name: &'static str, id: ElementId) {} + + fn remove_node(&mut self, id: ElementId) {} +} diff --git a/packages/core/src/virtual_dom.rs b/packages/core/src/virtual_dom.rs index 98f510384..1e567fae3 100644 --- a/packages/core/src/virtual_dom.rs +++ b/packages/core/src/virtual_dom.rs @@ -5,7 +5,10 @@ use crate::{ any_props::{BoxedAnyProps, VProps}, arena::ElementId, - innerlude::{DirtyScope, ElementRef, ErrorBoundary, Mutations, Scheduler, SchedulerMsg}, + innerlude::{ + DirtyScope, ElementRef, ErrorBoundary, Mutations, NoOpMutations, Scheduler, SchedulerMsg, + WriteMutations, + }, mutations::Mutation, nodes::RenderReturn, nodes::{Template, TemplateId}, @@ -188,8 +191,6 @@ pub struct VirtualDom { // The element ids that are used in the renderer pub(crate) elements: Slab>, - pub(crate) mutations: Mutations<'static>, - pub(crate) runtime: Rc, // Currently suspended scopes @@ -263,7 +264,6 @@ impl VirtualDom { dirty_scopes: Default::default(), templates: Default::default(), elements: Default::default(), - mutations: Mutations::default(), suspended_scopes: Default::default(), }; @@ -544,38 +544,33 @@ impl VirtualDom { /// /// apply_edits(edits); /// ``` - pub fn rebuild(&mut self) -> Mutations { + pub fn rebuild(&mut self, to: &mut impl WriteMutations) { let _runtime = RuntimeGuard::new(self.runtime.clone()); match unsafe { self.run_scope(ScopeId::ROOT) } { // Rebuilding implies we append the created elements to the root RenderReturn::Ready(node) => { let m = self.create_scope(ScopeId::ROOT, &node); - self.mutations.edits.push(Mutation::AppendChildren { - id: ElementId(0), - m, - }); + to.append_children(ElementId(0), m); } // If an error occurs, we should try to render the default error component and context where the error occured RenderReturn::Aborted(placeholder) => { tracing::debug!("Ran into suspended or aborted scope during rebuild"); let id = self.next_element(); placeholder.id.set(Some(id)); - self.mutations.push(Mutation::CreatePlaceholder { id }); + to.create_placeholder(id); } } - - self.finalize() } /// Render whatever the VirtualDom has ready as fast as possible without requiring an executor to progress /// suspended subtrees. - pub fn render_immediate(&mut self) -> Mutations { + pub fn render_immediate(&mut self, to: &mut impl WriteMutations) { // Build a waker that won't wake up since our deadline is already expired when it's polled let waker = futures_util::task::noop_waker(); let mut cx = std::task::Context::from_waker(&waker); // Now run render with deadline but dont even try to poll any async tasks - let fut = self.render_with_deadline(std::future::ready(())); + let fut = self.render_with_deadline(std::future::ready(()), to); pin_mut!(fut); // The root component is not allowed to be async @@ -596,7 +591,7 @@ impl VirtualDom { self.wait_for_work().await; - _ = self.render_immediate(); + _ = self.render_immediate(&mut NoOpMutations); } } @@ -605,7 +600,11 @@ impl VirtualDom { /// It's generally a good idea to put some sort of limit on the suspense process in case a future is having issues. /// /// If no suspense trees are present - pub async fn render_with_deadline(&mut self, deadline: impl Future) -> Mutations { + pub async fn render_with_deadline( + &mut self, + deadline: impl Future, + to: &mut impl WriteMutations, + ) { pin_mut!(deadline); self.process_events(); @@ -625,7 +624,7 @@ impl VirtualDom { let _runtime = RuntimeGuard::new(self.runtime.clone()); // Run the scope and get the mutations let new_nodes = self.run_scope(dirty.id); - self.diff_scope(dirty.id, new_nodes); + self.diff_scope(dirty.id, new_nodes, to); } } @@ -645,16 +644,11 @@ impl VirtualDom { if let Either::Left((_, _)) = select(&mut deadline, pinned).await { // release the borrowed drop(work); - return self.finalize(); + return; } } } - /// Swap the current mutations with a new - fn finalize(&mut self) -> Mutations { - std::mem::take(&mut self.mutations) - } - /// Get the current runtime pub fn runtime(&self) -> Rc { self.runtime.clone()