import inferno app; remove inferno-dom; upgrade to beta43

mathieuancelin · Dec 28, 2016 · 9a6ee47 · 9a6ee47
1 parent a03694c
commit 9a6ee47
Show file tree

Hide file tree

Showing 5 changed files with 58 additions and 162 deletions.
diff --git a/inferno/app.js b/inferno/app.js
@@ -2,78 +2,65 @@
 	"use strict";
 	var elem = document.getElementById('app');
 
-	//allows support in < IE9
-	function map(func, array) {
-		var newArray = new Array(array.length);
-		for (var i = 0; i < array.length; i++) {
-			newArray[i] = func(array[i]);
-		}
-		return newArray;
-	}
+	var createVNode = Inferno.createVNode;
+	var staticNode = createVNode(2, 'div', { className: 'arrow' }, null, null, null, null, true);
+	var tableProps = {
+		className: 'table table-striped latest-data'
+	};
+	var dbName = {
+		className: 'dbname'
+	};
+	var dbQueryCount = {
+		className: 'query-count'
+	};
+	var foo = {
+		className: 'foo'
+	};
+	var popoverLeft = {
+		className: 'popover left'
+	};
+	var popoverContent = {
+		className: 'popover-content'
+	};
 
-	var queryTpl = InfernoDOM.template(function (elapsedClassName, formatElapsed, query) {
-		return {
-			tag: 'td',
-			props: { className: elapsedClassName },
-			children: [
-				{tag: 'span', props: { className: 'foo' }, text: formatElapsed},
-				{
-					tag: 'div',
-					props: { className: 'popover left' },
-					children: [
-						{tag: 'div', props: { className: 'popover-content' }, text: query},
-						{tag: 'div', props: { className: 'arrow' }}
-					]
-				}
-			]
-		};
-	});
+	function renderBenchmark(dbs) {
+		var length = dbs.length;
+		var databases = new Array(length);
 
-	function query(query) {
-		return queryTpl(query.elapsedClassName, query.formatElapsed, query.query);
-	}
+		for (var i = 0; i < length; i++) {
+			var db = dbs[i];
+			var lastSample = db.lastSample;
+			var children = new Array(7);
 
-	var databaseTpl = InfernoDOM.template(function (dbname, countClassName, nbQueries, topFiveQueries) {
-		return {
-			tag: 'tr',
-			children: [
-				{tag: 'td', props: { className: 'dbname' }, text: dbname},
-				{
-					tag: 'td',
-					props: { className: 'query-count'},
-					children: {
-						tag: 'span',
-						props: { className: countClassName },
-						text: nbQueries
-					}
-				},
-				topFiveQueries
-			]
-		};
-	});
+			children[0] = createVNode(2, 'td', dbName, db.dbname, null, null, null, true);
+			children[1] = createVNode(2, 'td', dbQueryCount, createVNode(2, 'span', {
+				className: lastSample.countClassName
+			}, lastSample.nbQueries, null, null, null, true), null, null, null, true);
 
-	function database(db) {
-		var lastSample = db.lastSample;
+			for (var i2 = 0; i2 < 5; i2++) {
+				var query = lastSample.topFiveQueries[i2];
 
-		return databaseTpl(
-			db.dbname,
-			lastSample.countClassName,
-			lastSample.nbQueries,
-			map(query, lastSample.topFiveQueries)
-		);
-	}
+				children[i2 + 2] = createVNode(66, 'td', {
+					className: query.elapsedClassName
+				}, [
+					createVNode(2, 'div', foo, query.formatElapsed, null, null, null, true),
+					createVNode(66, 'div', popoverLeft, [
+						createVNode(2, 'div', popoverContent, query.query, null, null, null, true),
+						staticNode
+					], null, null, null, true)
+				], null, null, null, true);
+				databases[i] = createVNode(66, 'tr', null, children, null, null, null, true);
+			}
+		}
 
-	var tableTpl = InfernoDOM.template(function (dbs) {
-		return {
-			tag: 'table',
-			props: { className: 'table table-striped latest-data' },
-			children: { tag: 'tbody', children: dbs }
-		};
-	});
+		Inferno.render(
+			createVNode(2, 'table', tableProps, createVNode(66, 'tbody', null, databases, null, null, null, true), null, null, null, true),
+		elem);
+	}
 
 	function render() {
-		var dbs = ENV.generateData().toArray();
-		InfernoDOM.render(tableTpl(map(database,dbs)), elem);
+		var dbs = ENV.generateData(false).toArray();
+		renderBenchmark(dbs);
 		Monitoring.renderRate.ping();
 		setTimeout(render, ENV.timeout);
 	}

diff --git a/inferno/index.html b/inferno/index.html
@@ -1,21 +1,19 @@
 <!DOCTYPE html>
-<html>
+<html lang="en">
 <head>
-<meta name="description" content="DBMON Inferno" />
   <meta charset="utf-8">
+  <meta name="description" content="DBMON Inferno" />
   <link href="../styles.css" rel="stylesheet" type="text/css" />
   <title>Inferno</title>
 </head>
 <body>
   <div id="app"></div>
-  <script src="../lib/jquery-2.1.0.min.js"></script>
-  <script src="utils.js"></script>
-	<script src="inferno.js"></script>
-	<script src="inferno-dom.js"></script>
+
+  <script src="./inferno.js"></script>
   <script src="../ENV.js"></script>
   <script src="../lib/memory-stats.js"></script>
   <script src="../lib/monitor.js"></script>
   <script src="./app.js"></script>
   <script src="../ga.js"></script>
 </body>
-</html>
+</html>