use builders for init statements

src/generate/index.js

@@ -19,14 +19,15 @@ export default function generate ( parsed, source, options, names ) {
 		addElement ( name, renderStatement, needsIdentifier = false ) {
 			const isToplevel = generator.current.localElementDepth === 0;
 			if ( needsIdentifier || isToplevel ) {
-				generator.current.initStatements.push( deindent`
+				generator.current.builders.init.addLine(
-					var ${name} = ${renderStatement};
+					`var ${name} = ${renderStatement};`
-				` );
+				);
+
 				generator.createMountStatement( name );
 			} else {
-				generator.current.initStatements.push( deindent`
+				generator.current.builders.init.addLine(
-					${generator.current.target}.appendChild( ${renderStatement} );
+					`${generator.current.target}.appendChild( ${renderStatement} );`
-				` );
+				);
 			}
 			if ( isToplevel ) {
 				generator.current.detachStatements.push( deindent`
@@ -41,9 +42,8 @@ export default function generate ( parsed, source, options, names ) {
 					target.insertBefore( ${name}, anchor );
 				` );
 			} else {
-				generator.current.initStatements.push( deindent`
+				generator.current.builders.init.addLine(
-					${generator.current.target}.appendChild( ${name} );
+					`${generator.current.target}.appendChild( ${name} );` );
-				` );
 			}
 		},
 
@@ -60,12 +60,12 @@ export default function generate ( parsed, source, options, names ) {
 				target: 'target',
 				localElementDepth: 0,
 
-				initStatements: [],
 				mountStatements: [],
 				updateStatements: [],
 				detachStatements: [],
 				teardownStatements: [],
 
+				builders: generator.getBuilders(),
 				getUniqueName: generator.getUniqueNameMaker()
 			});
 			// walk the children here
@@ -78,7 +78,7 @@ export default function generate ( parsed, source, options, names ) {
 
 		addRenderer ( fragment ) {
 			if ( fragment.autofocus ) {
-				fragment.initStatements.push( `${fragment.autofocus}.focus();` );
+				fragment.builders.init.addLine( `${fragment.autofocus}.focus();` );
 			}
 
 			const detachStatements = fragment.detachStatements.join( '\n\n' );
@@ -96,7 +96,7 @@ export default function generate ( parsed, source, options, names ) {
 
 			renderers.push( deindent`
 				function ${fragment.name} ( ${fragment.params}, component ) {
-					${fragment.initStatements.join( '\n\n' )}
+					${fragment.builders.init}
 
 					return {
 						mount: function ( target, anchor ) {
@@ -175,6 +175,16 @@ export default function generate ( parsed, source, options, names ) {
 
 		events: {},
 
+		getBuilders () {
+			return {
+				init: new CodeBuilder(),
+				mount: new CodeBuilder(),
+				update: new CodeBuilder(),
+				detach: new CodeBuilder(),
+				teardown: new CodeBuilder()
+			};
+		},
+
 		getUniqueName: counter( names ),
 
 		getUniqueNameMaker () {
@@ -294,7 +304,6 @@ export default function generate ( parsed, source, options, names ) {
 		elementDepth: 0,
 		localElementDepth: 0,
 
-		initStatements: [],
 		mountStatements: [],
 		updateStatements: [],
 		detachStatements: [],
@@ -307,6 +316,7 @@ export default function generate ( parsed, source, options, names ) {
 		indexNames: {},
 		listNames: {},
 
+		builders: generator.getBuilders(),
 		getUniqueName: generator.getUniqueNameMaker()
 	});
 

src/generate/visitors/Component.js

@@ -37,7 +37,10 @@ export default {
 
 			generator.generateBlock( node, yieldName );
 
-			generator.current.initStatements.push(`var ${name}_yieldFragment = ${yieldName}( root, component );`);
+			generator.current.builders.init.addLine(
+				`var ${name}_yieldFragment = ${yieldName}( root, component );`
+			);
+
 			generator.current.updateStatements.push(`${name}_yieldFragment.update ( changed, root );`);
 
 			componentInitProperties.push(`yield: ${name}_yieldFragment`);
@@ -107,7 +110,7 @@ export default {
 
 		local.teardown.push( `${name}.teardown( ${isToplevel ? 'detach' : 'false'} );` );
 
-		generator.current.initStatements.push( local.init.join( '\n' ) );
+		generator.current.builders.init.addBlock( local.init.join( '\n' ) );
 		if ( local.update.length ) generator.current.updateStatements.push( local.update.join( '\n' ) );
 		if ( local.mount.length ) generator.current.mountStatements.push( local.mount.join( '\n' ) );
 		if ( local.detach.length ) generator.current.detachStatements.push( local.detach.join( '\n' ) );

src/generate/visitors/EachBlock.js

@@ -20,7 +20,7 @@ export default {
 
 		const anchor = generator.createAnchor( name, `#each ${generator.source.slice( node.expression.start, node.expression.end )}` );
 
-		generator.current.initStatements.push( deindent`
+		generator.current.builders.init.addBlock( deindent`
 			var ${name}_value = ${snippet};
 			var ${iterations} = [];
 			${node.else ? `var ${elseName} = null;` : ''}
@@ -31,7 +31,7 @@ export default {
 			}
 		` );
 		if ( node.else ) {
-			generator.current.initStatements.push( deindent`
+			generator.current.builders.init.addBlock( deindent`
 				if ( !${name}_value.length ) {
 					${elseName} = ${renderElse}( ${params}, component );
 					${!isToplevel ? `${elseName}.mount( ${anchor}.parentNode, ${anchor} );` : ''}
@@ -136,7 +136,6 @@ export default {
 			listNames,
 			params: blockParams,
 
-			initStatements: [],
 			mountStatements: [],
 			updateStatements: [ Object.keys( contexts ).map( contextName => {
 				const listName = listNames[ contextName ];
@@ -147,6 +146,7 @@ export default {
 			detachStatements: [],
 			teardownStatements: [],
 
+			builders: generator.getBuilders(),
 			getUniqueName: generator.getUniqueNameMaker()
 		});
 	},

src/generate/visitors/Element.js

@@ -79,7 +79,7 @@ export default {
 			local.update.push( `${name}.__value = ${name}.textContent` );
 		}
 
-		generator.current.initStatements.push( local.init.join( '\n' ) );
+		generator.current.builders.init.addBlock( local.init.join( '\n' ) );
 		if ( local.update.length ) generator.current.updateStatements.push( local.update.join( '\n' ) );
 		if ( local.mount.length ) generator.current.mountStatements.push( local.mount.join( '\n' ) );
 		if ( local.detach.length ) generator.current.detachStatements.push( local.detach.join( '\n' ) );

src/generate/visitors/IfBlock.js

@@ -39,7 +39,7 @@ export default {
 
 		const anchor = generator.createAnchor( name, `#if ${generator.source.slice( node.expression.start, node.expression.end )}` );
 
-		generator.current.initStatements.push( deindent`
+		generator.current.builders.init.addBlock( deindent`
 			function ${getBlock} ( ${params} ) {
 				${conditionsAndBlocks.map( ({ condition, block }) => {
 					return `${condition ? `if ( ${condition} ) ` : ''}return ${block};`;
@@ -54,7 +54,7 @@ export default {
 		if ( isToplevel ) {
 			generator.current.mountStatements.push( mountStatement );
 		} else {
-			generator.current.initStatements.push( mountStatement );
+			generator.current.builders.init.addLine( mountStatement );
 		}
 
 		generator.current.updateStatements.push( deindent`

src/generate/visitors/RawMustacheTag.js

@@ -16,9 +16,7 @@ export default {
 
 		const isToplevel = generator.current.localElementDepth === 0;
 
-		const mountStatement = deindent`
+		const mountStatement = `${before}.insertAdjacentHTML( 'afterend', ${snippet} );`;
-			${before}.insertAdjacentHTML( 'afterend', ${snippet} );
-		`;
 		const detachStatement = deindent`
 			while ( ${before}.nextSibling && ${before}.nextSibling !== ${after} ) {
 				${before}.parentNode.removeChild( ${before}.nextSibling );
@@ -28,7 +26,7 @@ export default {
 		if ( isToplevel ) {
 			generator.current.mountStatements.push(mountStatement);
 		} else {
-			generator.current.initStatements.push(mountStatement);
+			generator.current.builders.init.addLine( mountStatement );
 		}
 
 		generator.current.updateStatements.push( deindent`