Experimental support for resuming suspended hydration

mangle.json

@@ -27,6 +27,8 @@
       "$_children": "__k",
       "$_suspensions": "__u",
       "$_dom": "__e",
+      "$_hydrateDom": "__s",
+      "$_hydrating": "__h",
       "$_component": "__c",
       "$__html": "__html",
       "$_parent": "__",

src/create-element.js

@@ -70,6 +70,8 @@ export function createVNode(type, props, key, ref) {
 		_dom: null,
 		_lastDomChild: null,
 		_component: null,
+		_hydrateDom: null,
+		_hydrating: false,
 		constructor: undefined
 	};
 

src/diff/index.js

@@ -40,6 +40,16 @@ export function diff(
 	// constructor as undefined. This to prevent JSON-injection.
 	if (newVNode.constructor !== undefined) return null;
 
+	// If this was the innermost VNode at a point where the tree suspended,
+	// pick up diffing where we left off using the saved DOM element and hydration state.
+	if (oldVNode._hydrateDom && excessDomChildren == null) {
+		oldDom = oldVNode._hydrateDom;
+		excessDomChildren = [oldDom];
+		newVNode._dom = oldDom;
+		oldVNode._hydrateDom = null;
+		isHydrating = oldVNode._hydrating;
+	}
+
 	if ((tmp = options._diff)) tmp(newVNode);
 
 	try {
@@ -215,6 +225,11 @@ export function diff(
 
 		if ((tmp = options.diffed)) tmp(newVNode);
 	} catch (e) {
+		// Before bailing out, mark the current VNode with the DOM element and hydration state.
+		// We can use this information if we return here to render later on.
+		newVNode._dom = oldDom;
+		oldVNode._hydrateDom = oldDom;
+		oldVNode._hydrating = isHydrating;
 		options._catchError(e, newVNode, oldVNode);
 	}