hydration

src/compile/render-dom/Block.ts

@@ -162,7 +162,10 @@ export default class Block {
 	) {
 		this.addVariable(name);
 		this.builders.create.addLine(`${name} = ${renderStatement};`);
-		this.builders.claim.addLine(`${name} = ${claimStatement || renderStatement};`);
+
+		if (this.renderer.options.hydratable) {
+			this.builders.claim.addLine(`${name} = ${claimStatement || renderStatement};`);
+		}
 
 		if (parentNode) {
 			this.builders.mount.addLine(`@append(${parentNode}, ${name});`);
@@ -259,14 +262,14 @@ export default class Block {
 			`);
 		}
 
-		if (this.renderer.options.hydratable) {
+		if (this.renderer.options.hydratable || !this.builders.claim.isEmpty()) {
 			if (this.builders.claim.isEmpty() && this.builders.hydrate.isEmpty()) {
 				properties.addBlock(`l: @noop,`);
 			} else {
 				properties.addBlock(deindent`
 					${dev ? 'l: function claim' : 'l'}(nodes) {
 						${this.builders.claim}
-						${!this.builders.hydrate.isEmpty() && `this.h();`}
+						${this.renderer.options.hydratable && !this.builders.hydrate.isEmpty() && `this.h();`}
 					},
 				`);
 			}

src/compile/render-dom/wrappers/AwaitBlock.ts

@@ -160,7 +160,7 @@ export default class AwaitBlockWrapper extends Wrapper {
 			${info}.block.c();
 		`);
 
-		if (parentNodes) {
+		if (parentNodes && this.renderer.options.hydratable) {
 			block.builders.claim.addBlock(deindent`
 				${info}.block.l(${parentNodes});
 			`);

src/compile/render-dom/wrappers/EachBlock.ts

@@ -316,7 +316,7 @@ export default class EachBlockWrapper extends Wrapper {
 			for (#i = 0; #i < ${blocks}.length; #i += 1) ${blocks}[#i].c();
 		`);
 
-		if (parentNodes) {
+		if (parentNodes && this.renderer.options.hydratable) {
 			block.builders.claim.addBlock(deindent`
 				for (#i = 0; #i < ${blocks}.length; #i += 1) ${blocks}[#i].l(${parentNodes});
 			`);
@@ -389,7 +389,7 @@ export default class EachBlockWrapper extends Wrapper {
 			}
 		`);
 
-		if (parentNodes) {
+		if (parentNodes && this.renderer.options.hydratable) {
 			block.builders.claim.addBlock(deindent`
 				for (var #i = 0; #i < ${iterations}.length; #i += 1) {
 					${iterations}[#i].l(${parentNodes});

src/compile/render-dom/wrappers/Element/index.ts

@@ -335,7 +335,7 @@ export default class ElementWrapper extends Wrapper {
 			block.builders.mount.addBlock(this.initialUpdate);
 		}
 
-		if (nodes) {
+		if (nodes && this.renderer.options.hydratable) {
 			block.builders.claim.addLine(
 				`${nodes}.forEach(@detachNode);`
 			);

src/compile/render-dom/wrappers/IfBlock.ts

@@ -185,7 +185,7 @@ export default class IfBlockWrapper extends Wrapper {
 
 		block.builders.create.addLine(`${if_name}${name}.c();`);
 
-		if (parentNodes) {
+		if (parentNodes && this.renderer.options.hydratable) {
 			block.builders.claim.addLine(
 				`${if_name}${name}.l(${parentNodes});`
 			);

src/compile/render-dom/wrappers/InlineComponent/index.ts

@@ -293,7 +293,7 @@ export default class InlineComponentWrapper extends Wrapper {
 				`if (${name}) ${name}.$$fragment.c();`
 			);
 
-			if (parentNodes) {
+			if (parentNodes && this.renderer.options.hydratable) {
 				block.builders.claim.addLine(
 					`if (${name}) ${name}.$$fragment.l(${parentNodes});`
 				);
@@ -385,7 +385,7 @@ export default class InlineComponentWrapper extends Wrapper {
 
 			block.builders.create.addLine(`${name}.$$fragment.c();`);
 
-			if (parentNodes) {
+			if (parentNodes && this.renderer.options.hydratable) {
 				block.builders.claim.addLine(
 					`${name}.$$fragment.l(${parentNodes});`
 				);

src/internal/Component.js

@@ -38,7 +38,7 @@ export class $$Component {
 
 		if (options.target) {
 			intro.enabled = !!options.intro;
-			this.$$mount(options.target);
+			this.$$mount(options.target, options.anchor, options.hydrate);
 
 			flush();
 			intro.enabled = true;
@@ -91,9 +91,14 @@ export class $$Component {
 		this.$$dirty[key] = true;
 	}
 
-	$$mount(target, anchor) {
-		this.$$fragment.c();
-		this.$$fragment[this.$$fragment.i ? 'i' : 'm'](target, anchor);
+	$$mount(target, anchor, hydrate) {
+		if (hydrate) {
+			this.$$fragment.l(target.childNodes);
+		} else {
+			this.$$fragment.c();
+			this.$$fragment[this.$$fragment.i ? 'i' : 'm'](target, anchor);
+		}
+
 		this.$$.inject_refs(this.$$refs);
 
 		// onMount happens after the initial afterRender. Because