From 86c66bd344b01de7834ecb3cd8d67ba39e9d2b18 Mon Sep 17 00:00:00 2001
From: Kushagra Gour <chinchang457@gmail.com>
Date: Mon, 5 Nov 2018 14:51:46 +0530
Subject: [PATCH] ContentWraps: Move console fnprops to constrcutor to avoid
 new fn creation on render

---
 src/components/ContentWrap.jsx      | 19 +++++++++++++------
 src/components/ContentWrapFiles.jsx | 21 ++++++++++++++-------
 2 files changed, 27 insertions(+), 13 deletions(-)

diff --git a/src/components/ContentWrap.jsx b/src/components/ContentWrap.jsx
index 60f5349..6f176cc 100644
--- a/src/components/ContentWrap.jsx
+++ b/src/components/ContentWrap.jsx
@@ -37,6 +37,15 @@ export default class ContentWrap extends Component {
 		window.previewException = this.previewException.bind(this);
 		// `clearConsole` is on window because it gets called from inside iframe also.
 		window.clearConsole = this.clearConsole.bind(this);
+
+		this.consoleHeaderDblClickHandler = this.consoleHeaderDblClickHandler.bind(
+			this
+		);
+		this.clearConsoleBtnClickHandler = this.clearConsoleBtnClickHandler.bind(
+			this
+		);
+		this.toggleConsole = this.toggleConsole.bind(this);
+		this.evalConsoleExpr = this.evalConsoleExpr.bind(this);
 	}
 	shouldComponentUpdate(nextProps, nextState) {
 		return (
@@ -840,12 +849,10 @@ export default class ContentWrap extends Component {
 					<Console
 						logs={this.state.logs}
 						isConsoleOpen={this.state.isConsoleOpen}
-						onConsoleHeaderDblClick={this.consoleHeaderDblClickHandler.bind(
-							this
-						)}
-						onClearConsoleBtnClick={this.clearConsoleBtnClickHandler.bind(this)}
-						toggleConsole={this.toggleConsole.bind(this)}
-						onEvalInputKeyup={this.evalConsoleExpr.bind(this)}
+						onConsoleHeaderDblClick={this.consoleHeaderDblClickHandler}
+						onClearConsoleBtnClick={this.clearConsoleBtnClickHandler}
+						toggleConsole={this.toggleConsole}
+						onEvalInputKeyup={this.evalConsoleExpr}
 					/>
 					<CssSettingsModal
 						show={this.state.isCssSettingsModalOpen}
diff --git a/src/components/ContentWrapFiles.jsx b/src/components/ContentWrapFiles.jsx
index 882028f..396e6fe 100644
--- a/src/components/ContentWrapFiles.jsx
+++ b/src/components/ContentWrapFiles.jsx
@@ -22,7 +22,7 @@ import { commandPaletteService } from '../commandPaletteService';
 
 const minCodeWrapSize = 33;
 
-/* global htmlCodeEl, jsCodeEl, cssCodeEl, logCountEl
+/* global htmlCodeEl
 */
 export default class ContentWrapFiles extends Component {
 	constructor(props) {
@@ -46,6 +46,15 @@ export default class ContentWrapFiles extends Component {
 		window.previewException = this.previewException.bind(this);
 		// `clearConsole` is on window because it gets called from inside iframe also.
 		window.clearConsole = this.clearConsole.bind(this);
+
+		this.consoleHeaderDblClickHandler = this.consoleHeaderDblClickHandler.bind(
+			this
+		);
+		this.clearConsoleBtnClickHandler = this.clearConsoleBtnClickHandler.bind(
+			this
+		);
+		this.toggleConsole = this.toggleConsole.bind(this);
+		this.evalConsoleExpr = this.evalConsoleExpr.bind(this);
 	}
 	shouldComponentUpdate(nextProps, nextState) {
 		return (
@@ -641,12 +650,10 @@ export default class ContentWrapFiles extends Component {
 					<Console
 						logs={this.state.logs}
 						isConsoleOpen={this.state.isConsoleOpen}
-						onConsoleHeaderDblClick={this.consoleHeaderDblClickHandler.bind(
-							this
-						)}
-						onClearConsoleBtnClick={this.clearConsoleBtnClickHandler.bind(this)}
-						toggleConsole={this.toggleConsole.bind(this)}
-						onEvalInputKeyup={this.evalConsoleExpr.bind(this)}
+						onConsoleHeaderDblClick={this.consoleHeaderDblClickHandler}
+						onClearConsoleBtnClick={this.clearConsoleBtnClickHandler}
+						toggleConsole={this.toggleConsole}
+						onEvalInputKeyup={this.evalConsoleExpr}
 					/>
 				</div>
 			</SplitPane>