VirtualDom 与 Runtime

pub struct VirtualDom {
    pub(crate) scopes: Slab<ScopeState>,

    pub(crate) dirty_scopes: BTreeSet<ScopeOrder>,

    pub(crate) runtime: Rc<Runtime>,

    // The scopes that have been resolved since the last render
    pub(crate) resolved_scopes: Vec<ScopeId>,

    rx: futures_channel::mpsc::UnboundedReceiver<SchedulerMsg>,
}

pub struct Runtime {
    // We use this to track the current scope
    // This stack should only be modified through [`Runtime::with_scope_on_stack`] to ensure that the stack is correctly restored
    scope_stack: RefCell<Vec<ScopeId>>,

    // We use this to track the current suspense location. Generally this lines up with the scope stack, but it may be different for children of a suspense boundary
    // This stack should only be modified through [`Runtime::with_suspense_location`] to ensure that the stack is correctly restored
    suspense_stack: RefCell<Vec<SuspenseLocation>>,

    // A hand-rolled slab of scope states
    pub(crate) scope_states: RefCell<Vec<Option<Scope>>>,

    // We use this to track the current task
    pub(crate) current_task: Cell<Option<Task>>,

    /// Tasks created with cx.spawn
    pub(crate) tasks: RefCell<slotmap::SlotMap<DefaultKey, Rc<LocalTask>>>,

    // Currently suspended tasks
    pub(crate) suspended_tasks: Cell<usize>,

    pub(crate) rendering: Cell<bool>,

    pub(crate) sender: futures_channel::mpsc::UnboundedSender<SchedulerMsg>,

    // The effects that need to be run after the next render
    pub(crate) pending_effects: RefCell<BTreeSet<Effect>>,

    // Tasks that are waiting to be polled
    pub(crate) dirty_tasks: RefCell<BTreeSet<DirtyTasks>>,

    // The element ids that are used in the renderer
    // These mark a specific place in a whole rsx block
    pub(crate) elements: RefCell<Slab<Option<ElementRef>>>,

    // Once nodes are mounted, the information about where they are mounted is stored here
    // We need to store this information on the virtual dom so that we know what nodes are mounted where when we bubble events
    // Each mount is associated with a whole rsx block. [`VirtualDom::elements`] link to a specific node in the block
    pub(crate) mounts: RefCell<Slab<VNodeMount>>,
}

    pub(crate) fn new_with_component(root: VComponent) -> Self {
        let (tx, rx) = futures_channel::mpsc::unbounded();

        let mut dom = Self {
            rx,
            runtime: Runtime::new(tx),
            scopes: Default::default(),
            dirty_scopes: Default::default(),
            resolved_scopes: Default::default(),
        };

        let root = VProps::new(
            RootScopeWrapper,
            |_, _| true,
            RootProps(root),
            "RootWrapper",
        );
        dom.new_scope(Box::new(root), "app");

        #[cfg(debug_assertions)]
        dom.register_subsecond_handler();

        dom
    }

    // ScopeId(0) is the root scope wrapper
    // ScopeId(1) is the default suspense boundary
    // ScopeId(2) is the default error boundary
    // ScopeId(3) is the users root scope
    pub const APP: ScopeId = ScopeId(3);

use std::rc::Rc;
use std::time::Duration;

use core1_exp::Log;
use dioxus::prelude::*;
use dioxus_core::{Runtime, ScopeId};

fn rt_ptr() -> usize {
  Rc::as_ptr(&Runtime::current()) as *const u8 as usize
}

fn app() -> Element {
  let mut n = use_signal(|| 0);
  // one task: sleep 10 ms, then write the signal once
  use_hook(|| {
    spawn(async move {
      tokio::time::sleep(Duration::from_millis(10)).await;
      n += 1;
    })
  });
  println!("  [render app] runtime = {:#x}", rt_ptr());
  rsx! {
    div { "n = {n}" }
    Child {}
  }
}

#[component]
fn Child() -> Element {
  println!("  [render Child]");
  rsx! { span { "child" } }
}

fn other() -> Element {
  println!("  [render other] runtime = {:#x}", rt_ptr());
  // a VirtualDom built and rendered inside another one's component
  let mut inner = VirtualDom::new(inner_app);
  inner.rebuild_in_place();
  let html = dioxus_ssr::render(&inner);
  println!("  [render other] after inner rebuild, runtime = {:#x}", rt_ptr());
  rsx! { p { "other " {html} } }
}

fn inner_app() -> Element {
  println!("    [render inner_app] runtime = {:#x}", rt_ptr());
  rsx! { i { "inner" } }
}

#[tokio::main(flavor = "current_thread")]
async fn main() {
  println!("outside: Runtime::try_current().is_some() = {}", Runtime::try_current().is_some());

  let mut dom = VirtualDom::new(app);
  println!("dom.runtime() = {:#x}", Rc::as_ptr(&dom.runtime()) as *const u8 as usize);
  let mut log = Log::default();
  dom.rebuild(&mut log);
  log.print("rebuild");

  dom.in_runtime(|| {
    let rt = Runtime::current();
    for i in 0..6 {
      if let Some(s) = dom.get_scope(ScopeId(i)) {
        println!("{:?} height={} parent={:?}", s.id(), s.height(), rt.parent_scope(s.id()));
      }
    }
  });
  println!("after rebuild: Runtime::try_current().is_some() = {}", Runtime::try_current().is_some());

  dom.render_immediate(&mut log);
  log.print("render_immediate, nothing dirty");

  let t = std::time::Instant::now();
  dom.wait_for_work().await;
  println!("wait_for_work returned, waited >= 10ms: {}", t.elapsed() >= Duration::from_millis(10));
  dom.render_immediate(&mut log);
  log.print("render_immediate after the task wrote n");

  dom.mark_dirty(ScopeId::APP);
  dom.render_immediate(&mut log);
  log.print("mark_dirty(ScopeId::APP) + render_immediate");

  // a second VirtualDom on the same thread has its own Runtime
  let mut dom2 = VirtualDom::new(other);
  println!("dom2.runtime() = {:#x}", Rc::as_ptr(&dom2.runtime()) as *const u8 as usize);
  dom2.rebuild_in_place();
  println!("ssr(dom)  = {}", dioxus_ssr::render(&dom));
  println!("ssr(dom2) = {}", dioxus_ssr::render(&dom2));
}

outside: Runtime::try_current().is_some() = false
dom.runtime() = 0x785ac16290
  [render app] runtime = 0x785ac16290
  [render Child]
--- rebuild: 5 edits
  LoadTemplate <div> index=0 id=1
  CreateTextNode "n = 0" id=2
  ReplacePlaceholder path=[0] m=1
  LoadTemplate <span> index=0 id=3
  AppendChildren id=0 m=2
ScopeId(0, "app") height=0 parent=None
ScopeId(1, "dioxus_core::suspense::component::SuspenseBoundary") height=1 parent=Some(ScopeId(0, "app"))
ScopeId(2, "dioxus_core::error_boundary::ErrorBoundary") height=2 parent=Some(ScopeId(1, "dioxus_core::suspense::component::SuspenseBoundary"))
ScopeId(3, "root") height=3 parent=Some(ScopeId(2, "dioxus_core::error_boundary::ErrorBoundary"))
ScopeId(4, "vdom_entry::Child") height=4 parent=Some(ScopeId(3, "root"))
after rebuild: Runtime::try_current().is_some() = false
--- render_immediate, nothing dirty: 0 edits
wait_for_work returned, waited >= 10ms: true
  [render app] runtime = 0x785ac16290
--- render_immediate after the task wrote n: 1 edits
  SetText "n = 1" id=2
...

thread_local! {
    static RUNTIMES: RefCell<Vec<Rc<Runtime>>> = const { RefCell::new(vec![]) };
}

pub struct RuntimeGuard(());

impl RuntimeGuard {
    /// Create a new runtime guard that sets the current Dioxus runtime. The runtime will be reset when the guard is dropped
    pub fn new(runtime: Rc<Runtime>) -> Self {
        Runtime::push(runtime);
        Self(())
    }
}

impl Drop for RuntimeGuard {
    fn drop(&mut self) {
        Runtime::pop();
    }
}

dom2.runtime() = 0x785ac16410
  [render other] runtime = 0x785ac16410
    [render inner_app] runtime = 0x785ac16590
  [render other] after inner rebuild, runtime = 0x785ac16410
ssr(dom)  = <div>n = 1</div><span>child</span>
ssr(dom2) = <p>other &#60;i&#62;inner&#60;/i&#62;</p>

thread 'main' (981603) panicked at ~/.cargo/registry/src/index.crates.io-1949cf8c6b5b557f/dioxus-core-0.7.10/src/runtime.rs:100:17:
Must be called from inside a Dioxus runtime.

Help: Some APIs in dioxus require a global runtime to be present.
If you are calling one of these APIs from outside of a dioxus runtime
(typically in a web-sys closure or dynamic library), you will need to
grab the runtime from a scope that has it and then move it into your
new scope with a runtime guard.
...

    pub fn rebuild(&mut self, to: &mut impl WriteMutations) {
        let _runtime = RuntimeGuard::new(self.runtime.clone());
        let new_nodes = self
            .runtime
            .clone()
            .while_rendering(|| self.run_scope(ScopeId::ROOT));

        let new_nodes = LastRenderedNode::new(new_nodes);

        self.scopes[ScopeId::ROOT.0].last_rendered_node = Some(new_nodes.clone());

        // Rebuilding implies we append the created elements to the root
        let m = self.create_scope(Some(to), ScopeId::ROOT, new_nodes, None);

        to.append_children(ElementId(0), m);
    }

    pub async fn wait_for_work(&mut self) {
        loop {
            // Process all events - Scopes are marked dirty, etc
            // Sometimes when wakers fire we get a slew of updates at once, so its important that we drain this completely
            self.process_events();

            // Now that we have collected all queued work, we should check if we have any dirty scopes. If there are not, then we can poll any queued futures
            if self.has_dirty_scopes() {
                return;
            }

            // Make sure we set the runtime since we're running user code
            let _runtime = RuntimeGuard::new(self.runtime.clone());

            // There isn't any more work we can do synchronously. Wait for any new work to be ready
            self.wait_for_event().await;
        }
    }

    pub fn render_immediate(&mut self, to: &mut impl WriteMutations) {
        // Process any events that might be pending in the queue
        // Signals marked with .write() need a chance to be handled by the effect driver
        // This also processes futures which might progress into immediately rerunning a scope
        self.process_events();

        // Next, diff any dirty scopes
        // We choose not to poll the deadline since we complete pretty quickly anyways
        let _runtime = RuntimeGuard::new(self.runtime.clone());
        while let Some(work) = self.pop_work() {
            match work {
                Work::PollTask(task) => {
                    _ = self.runtime.handle_task_wakeup(task);
                    // Make sure we process any new events
                    self.queue_events();
                }
                Work::RerunScope(scope) => {
                    // If the scope is dirty, run the scope and get the mutations
                    self.runtime.clone().while_rendering(|| {
                        self.run_and_diff_scope(Some(to), scope.id);
                    });
                }
            }
        }

        self.runtime.finish_render();
    }

    pub async fn wait_for_suspense(&mut self) {
        loop {
            self.queue_events();

            if !self.suspended_tasks_remaining() && !self.has_dirty_scopes() {
                break;
            }

            self.wait_for_suspense_work().await;

            self.render_suspense_immediate().await;
        }
    }

    loop {
        // ...
        {
            let work = virtual_dom.wait_for_work().fuse();
            pin_mut!(work);
            // ...
                select! {
                    _ = work => {},
                    hyd = rx_hydration => {
                        // ...
                    }
                }
        }
        // ...
        // run the virtualdom work phase until the frame deadline is reached
        virtual_dom.render_immediate(&mut websys_dom);

        // wait for the animation frame to fire so we can apply our changes
        // work_loop.wait_for_raf().await;

        websys_dom.flush_edits();
    }

            // rebuild the virtual dom
            virtual_dom.rebuild_in_place();

            // If streaming is disabled, wait for the virtual dom to finish all suspense work
            // before rendering anything
            if streaming_mode == StreamingMode::Disabled {
                virtual_dom.wait_for_suspense().await;
            } else {
                // Otherwise, just wait for the streaming context to signal the initial chunk is ready
                loop {
                    // ...
                    let suspense_finished = !virtual_dom.suspended_tasks_remaining();
                    if streaming_context_finished || suspense_finished {
                        break;
                    }

                    // Wait for new async work that runs during suspense (mainly use_server_futures)
                    virtual_dom.wait_for_suspense_work().await;

                    // Do that async work
                    virtual_dom.render_suspense_immediate().await;
                }
            }

use std::time::Duration;

use dioxus::prelude::*;

fn app() -> Element {
  rsx! {
    h1 { "title" }
    SuspenseBoundary {
      fallback: |_| rsx! { "loading..." },
      Slow {}
    }
  }
}

#[component]
fn Slow() -> Element {
  let data = use_resource(|| async {
    tokio::time::sleep(Duration::from_millis(20)).await;
    "data".to_string()
  })
  .suspend()?;
  rsx! { p { "{data}" } }
}

#[tokio::main(flavor = "current_thread")]
async fn main() {
  let mut dom = VirtualDom::new(app);
  dom.rebuild_in_place();
  println!("after rebuild_in_place: suspended_tasks_remaining = {}", dom.suspended_tasks_remaining());
  println!("  {}", dioxus_ssr::render(&dom));
  dom.wait_for_suspense().await;
  println!("after wait_for_suspense: suspended_tasks_remaining = {}", dom.suspended_tasks_remaining());
  println!("  {}", dioxus_ssr::render(&dom));
}

after rebuild_in_place: suspended_tasks_remaining = true
  <h1>title</h1>loading...
after wait_for_suspense: suspended_tasks_remaining = false
  <h1>title</h1><p>data</p>

impl Drop for VirtualDom {
    fn drop(&mut self) {
        // Drop all scopes in order of height
        let mut scopes = self.scopes.drain().collect::<Vec<_>>();
        scopes.sort_by_key(|scope| scope.state().height);
        for scope in scopes.into_iter().rev() {
            drop(scope);
        }

        // Drop the mounts, tasks, and effects, releasing any `Rc<Runtime>` references
        self.runtime.pending_effects.borrow_mut().clear();
        self.runtime.tasks.borrow_mut().clear();
        self.runtime.mounts.borrow_mut().clear();
    }
}

  [render app] runtime = 0x785ac16290
--- mark_dirty(ScopeId::APP) + render_immediate: 0 edits