work on optimizing web implementation

packages/web/src/dom.rs

@@ -7,22 +7,22 @@
 //! - tests to ensure dyn_into works for various event types.
 //! - Partial delegation?>
 
-use dioxus_core::{ElementId, Mutation, Mutations, Template, TemplateAttribute, TemplateNode};
+use dioxus_core::{Mutation, Template, TemplateAttribute, TemplateNode};
 use dioxus_html::{event_bubbles, CompositionData, FormData};
-use dioxus_interpreter_js::Interpreter;
+use dioxus_interpreter_js::{save_template, Channel};
 use futures_channel::mpsc;
-use js_sys::Function;
+use rustc_hash::{FxHashMap, FxHashSet};
 use std::{any::Any, rc::Rc};
-use wasm_bindgen::{closure::Closure, JsCast, JsValue};
+use wasm_bindgen::{closure::Closure, JsCast};
 use web_sys::{Document, Element, Event, HtmlElement};
 
 use crate::Config;
 
 pub struct WebsysDom {
     document: Document,
-    interpreter: Interpreter,
-    handler: Closure<dyn FnMut(&Event)>,
-    root: Element,
+    templates: FxHashMap<String, u32>,
+    max_template_id: u32,
+    interpreter: Channel,
 }
 
 impl WebsysDom {
@@ -34,19 +34,25 @@ impl WebsysDom {
             Some(root) => root,
             None => document.create_element("body").ok().unwrap(),
         };
+        let interpreter = Channel::default();
 
+        let handler: Closure<dyn FnMut(&Event)> =
+            Closure::wrap(Box::new(move |event: &web_sys::Event| {
+                let _ = event_channel.unbounded_send(event.clone());
+            }));
+
+        dioxus_interpreter_js::initilize(root.unchecked_into(), handler.as_ref().unchecked_ref());
+        handler.forget();
         Self {
             document,
-            interpreter: Interpreter::new(root.clone()),
-            root,
-            handler: Closure::wrap(Box::new(move |event: &web_sys::Event| {
-                let _ = event_channel.unbounded_send(event.clone());
-            })),
+            interpreter,
+            templates: FxHashMap::default(),
+            max_template_id: 0,
         }
     }
 
     pub fn mount(&mut self) {
-        self.interpreter.MountToRoot();
+        self.interpreter.mount_to_root();
     }
 
     pub fn load_templates(&mut self, templates: &[Template]) {
@@ -59,7 +65,10 @@ impl WebsysDom {
                 roots.push(self.create_template_node(root))
             }
 
-            self.interpreter.SaveTemplate(roots, template.name);
+            self.templates
+                .insert(template.name.to_owned(), self.max_template_id);
+            save_template(roots, self.max_template_id);
+            self.max_template_id += 1
         }
     }
 
@@ -113,41 +122,51 @@ impl WebsysDom {
 
     pub fn apply_edits(&mut self, mut edits: Vec<Mutation>) {
         use Mutation::*;
-        let i = &self.interpreter;
-        for edit in edits.drain(..) {
+        let i = &mut self.interpreter;
+        for edit in &edits {
             match edit {
-                AssignId { path, id } => i.AssignId(path, id.0 as u32),
-                CreatePlaceholder { id } => i.CreatePlaceholder(id.0 as u32),
-                CreateTextNode { value, id } => i.CreateTextNode(value.into(), id.0 as u32),
-                HydrateText { path, value, id } => i.HydrateText(path, value, id.0 as u32),
-                LoadTemplate { name, index, id } => i.LoadTemplate(name, index as u32, id.0 as u32),
-                ReplaceWith { id, m } => i.ReplaceWith(id.0 as u32, m as u32),
-                ReplacePlaceholder { path, m } => i.ReplacePlaceholder(path, m as u32),
-                InsertAfter { id, m } => i.InsertAfter(id.0 as u32, m as u32),
-                InsertBefore { id, m } => i.InsertBefore(id.0 as u32, m as u32),
+                AppendChildren { id, m } => i.append_children(id.0 as u32, *m as u32),
+                AssignId { path, id } => {
+                    i.assign_id(path.as_ptr() as u32, path.len() as u8, id.0 as u32)
+                }
+                CreatePlaceholder { id } => i.create_placeholder(id.0 as u32),
+                CreateTextNode { value, id } => i.create_text_node(value, id.0 as u32),
+                HydrateText { path, value, id } => {
+                    i.hydrate_text(path.as_ptr() as u32, path.len() as u8, value, id.0 as u32)
+                }
+                LoadTemplate { name, index, id } => {
+                    if let Some(tmpl_id) = self.templates.get(*name) {
+                        i.load_template(*tmpl_id, *index as u32, id.0 as u32)
+                    }
+                }
+                ReplaceWith { id, m } => i.replace_with(id.0 as u32, *m as u32),
+                ReplacePlaceholder { path, m } => {
+                    i.replace_placeholder(path.as_ptr() as u32, path.len() as u8, *m as u32)
+                }
+                InsertAfter { id, m } => i.insert_after(id.0 as u32, *m as u32),
+                InsertBefore { id, m } => i.insert_before(id.0 as u32, *m as u32),
                 SetAttribute {
                     name,
                     value,
                     id,
                     ns,
-                } => i.SetAttribute(id.0 as u32, name, value.into(), ns),
+                } => i.set_attribute(id.0 as u32, name, value, ns.unwrap_or_default()),
                 SetBoolAttribute { name, value, id } => {
-                    i.SetBoolAttribute(id.0 as u32, name, value)
+                    i.set_attribute(id.0 as u32, name, if *value { "true" } else { "false" }, "")
                 }
-                SetText { value, id } => i.SetText(id.0 as u32, value.into()),
-                NewEventListener { name, scope, id } => {
-                    self.interpreter.NewEventListener(
-                        name,
-                        id.0 as u32,
-                        self.handler.as_ref().unchecked_ref(),
-                        event_bubbles(&name[2..]),
-                    );
+                SetText { value, id } => i.set_text(id.0 as u32, value),
+                NewEventListener { name, scope: _, id } => {
+                    i.new_event_listener(name, id.0 as u32, event_bubbles(&name[2..]) as u8);
                 }
-                RemoveEventListener { name, id } => i.RemoveEventListener(name, id.0 as u32),
-                Remove { id } => i.Remove(id.0 as u32),
-                PushRoot { id } => i.PushRoot(id.0 as u32),
+                RemoveEventListener { name, id } => {
+                    i.remove_event_listener(name, id.0 as u32, event_bubbles(&name[2..]) as u8)
+                }
+                Remove { id } => i.remove(id.0 as u32),
+                PushRoot { id } => i.push_root(id.0 as u32),
             }
         }
+        edits.clear();
+        i.flush();
     }
 }