only cache values if necessary

src/generators/dom/visitors/Component/Component.ts

@@ -212,7 +212,7 @@ export default function visitComponent(
 
 			${updates.join('\n')}
 
-			if ( Object.keys( ${name}_changes ).length ) ${name}._set( ${name}_changes );
+			${name}._set( ${name}_changes );
 		`);
 	}
 

src/generators/dom/visitors/MustacheTag.ts

@@ -10,17 +10,21 @@ export default function visitMustacheTag(
 	state: State,
 	node: Node
 ) {
+	const { dependencies, snippet } = block.contextualise(node.expression);
+
+	const shouldCache = node.expression.type !== 'Identifier' || block.contexts.has(node.expression.name);
+
 	const name = node._state.name;
-	const value = block.getUniqueName(`${name}_value`);
+	const value = shouldCache && block.getUniqueName(`${name}_value`);
+	const init = shouldCache ? `${value} = ${snippet}` : snippet;
 
-	const { dependencies, snippet } = block.contextualise(node.expression);
+	if (shouldCache) block.addVariable(value);
 
-	block.addVariable(value);
 	block.addElement(
 		name,
-		`@createText( ${value} = ${snippet} )`,
+		`@createText( ${init} )`,
 		generator.hydratable
-			? `@claimText( ${state.parentNodes}, ${value} = ${snippet} )`
+			? `@claimText( ${state.parentNodes}, ${init} )`
 			: '',
 		state.parentNode,
 		true
@@ -32,10 +36,13 @@ export default function visitMustacheTag(
 			dependencies.map(dependency => `'${dependency}' in changed`).join(' || ')
 		);
 
-		block.builders.update.addBlock(deindent`
+		const condition = shouldCache ?
-			if ( ( ${changedCheck} ) && ${value} !== ( ${value} = ${snippet} ) ) {
+			`( ${changedCheck} ) && ${value} !== ( ${value} = ${snippet} )` :
-				${name}.data = ${value};
+			changedCheck;
-			}
+
-		`);
+		block.builders.update.addConditionalLine(
+			condition,
+			`${name}.data = ${shouldCache ? value : snippet};`
+		);
 	}
 }