web: perf improvements

6 files changed, 31 insertions, 15 deletions

diff --git a/web/src/js/components/flowtable-columns.jsx.js b/web/src/js/components/flowtable-columns.jsx.js
index 88e0cf22..b7db71b7 100644
--- a/web/src/js/components/flowtable-columns.jsx.js
+++ b/web/src/js/components/flowtable-columns.jsx.js
@@ -10,11 +10,12 @@ var TLSColumn = React.createClass({
     render: function(){
         var flow = this.props.flow;
         var ssl = (flow.request.scheme == "https");
-        var classes = React.addons.classSet({
-            "col-tls": true,
-            "col-tls-https": ssl,
-            "col-tls-http": !ssl
-        });
+        var classes;
+        if(ssl){
+            classes = "col-tls col-tls-https";
+        } else {
+            classes = "col-tls col-tls-http";
+        }
         return <td className={classes}></td>;
     }
 });
diff --git a/web/src/js/components/flowtable.jsx.js b/web/src/js/components/flowtable.jsx.js
index 146d5264..fc4d8fbc 100644
--- a/web/src/js/components/flowtable.jsx.js
+++ b/web/src/js/components/flowtable.jsx.js
@@ -14,6 +14,13 @@ var FlowRow = React.createClass({
             <tr className={className} onClick={this.props.selectFlow.bind(null, flow)}>
                 {columns}
             </tr>);
+    },
+    shouldComponentUpdate: function(nextProps){
+        var isEqual = (
+            this.props.columns.length === nextProps.columns.length && 
+            this.props.selected === nextProps.selected &&
+            this.props.flow.response === nextProps.flow.response);
+        return !isEqual;
     }
 });
 
diff --git a/web/src/js/dispatcher.js b/web/src/js/dispatcher.js
index 65c4a4a0..4fe23447 100644
--- a/web/src/js/dispatcher.js
+++ b/web/src/js/dispatcher.js
@@ -18,9 +18,9 @@ Dispatcher.prototype.unregister = function (callback) {
 };
 Dispatcher.prototype.dispatch = function (payload) {
     console.debug("dispatch", payload);
-    this.callbacks.forEach(function (callback) {
-        callback(payload);
-    });
+    for(var i = 0; i < this.callbacks.length; i++){
+        this.callbacks[i](payload);
+    }
 };
 
 
diff --git a/web/src/js/stores/eventlogstore.js b/web/src/js/stores/eventlogstore.js
index 976f7524..dc6dbbbf 100644
--- a/web/src/js/stores/eventlogstore.js
+++ b/web/src/js/stores/eventlogstore.js
@@ -26,6 +26,9 @@ _.extend(EventLogView.prototype, EventEmitter.prototype, {
     },
     add: function (entry) {
         this.log.push(entry);
+        if(this.log.length > 50){
+            this.log.shift();
+        }
         this.emit("change");
     },
     add_bulk: function (messages) {
diff --git a/web/src/js/stores/flowstore.js b/web/src/js/stores/flowstore.js
index c7623367..7c0bddbd 100644
--- a/web/src/js/stores/flowstore.js
+++ b/web/src/js/stores/flowstore.js
@@ -41,6 +41,9 @@ _.extend(FlowView.prototype, EventEmitter.prototype, {
 
         if(idx < 0){
             this.flows.push(flow);
+            //if(this.flows.length > 100){
+            //    this.flows.shift();
+            //}
         } else {
             this.flows[idx] = flow;
         }
diff --git a/web/src/js/utils.js b/web/src/js/utils.js
index 95859381..fa15db8c 100644
--- a/web/src/js/utils.js
+++ b/web/src/js/utils.js
@@ -41,20 +41,22 @@ var Key = {
 var formatSize = function (bytes) {
     var size = bytes;
     var prefix = ["B", "KB", "MB", "GB", "TB"];
-    while (Math.abs(size) >= 1024 && prefix.length > 1) {
-        prefix.shift();
+    var i=0;
+    while (Math.abs(size) >= 1024 && i < prefix.length-1) {
+        i++;
         size = size / 1024;
     }
-    return (Math.floor(size * 100) / 100.0).toFixed(2) + prefix.shift();
+    return (Math.floor(size * 100) / 100.0).toFixed(2) + prefix[i];
 };
 
 var formatTimeDelta = function (milliseconds) {
     var time = milliseconds;
     var prefix = ["ms", "s", "min", "h"];
     var div = [1000, 60, 60];
-    while (Math.abs(time) >= div[0] && prefix.length > 1) {
-        prefix.shift();
-        time = time / div.shift();
+    var i = 0;
+    while (Math.abs(time) >= div[i] && i < div.length) {
+        time = time / div[i];
+        i++;
     }
-    return Math.round(time) + prefix.shift();
+    return Math.round(time) + prefix[i];
 };
\ No newline at end of file