Investigating some performance optimizations, added more perf instrumentation & measurements

public/app/controllers/grafanaCtrl.js

@@ -83,6 +83,26 @@ function (angular, config, _, $, store) {
       }, function() {
       });
 
+      $rootScope.performance.panels = [];
+
+      $scope.$on('refresh', function() {
+        if ($rootScope.performance.panels.length > 0) {
+          var totalRender = 0;
+          var totalQuery = 0;
+
+          _.each($rootScope.performance.panels, function(panelTiming) {
+            totalRender += panelTiming.render;
+            totalQuery += panelTiming.query;
+          });
+
+          console.log('total query: ' + totalQuery);
+          console.log('total render: ' + totalRender);
+          console.log('avg render: ' + totalRender / $rootScope.performance.panels.length);
+        }
+
+        $rootScope.performance.panels = [];
+      });
+
       $scope.onAppEvent('dashboard-loaded', function() {
         count = 0;
 

public/app/features/panel/panelHelper.js

@@ -9,7 +9,39 @@ function (angular, _, kbn, $) {
 
   var module = angular.module('grafana.services');
 
-  module.service('panelHelper', function(timeSrv) {
+  module.service('panelHelper', function(timeSrv, $rootScope) {
+    var self = this;
+
+    this.setTimeQueryStart = function(scope) {
+      scope.timing = {};
+      scope.timing.queryStart = new Date().getTime();
+    };
+
+    this.setTimeQueryEnd = function(scope) {
+      scope.timing.queryEnd = new Date().getTime();
+    };
+
+    this.setTimeRenderStart = function(scope) {
+      scope.timing.renderStart = new Date().getTime();
+    };
+
+    this.setTimeRenderEnd = function(scope) {
+      scope.timing.renderEnd = new Date().getTime();
+    };
+
+    this.broadcastRender = function(scope, data) {
+      this.setTimeRenderStart(scope);
+      scope.$broadcast('render', data);
+      this.setTimeRenderEnd(scope);
+
+      if ($rootScope.profilingEnabled) {
+        $rootScope.performance.panels.push({
+          panelId: scope.panel.id,
+          query: scope.timing.queryEnd - scope.timing.queryStart,
+          render: scope.timing.renderEnd - scope.timing.renderStart,
+        });
+      }
+    };
 
     this.updateTimeRange = function(scope) {
       scope.range = timeSrv.timeRange();
@@ -72,7 +104,10 @@ function (angular, _, kbn, $) {
         cacheTimeout: scope.panel.cacheTimeout
       };
 
+      this.setTimeQueryStart(scope);
       return datasource.query(metricsQuery).then(function(results) {
+        self.setTimeQueryEnd(scope);
+
         if (scope.dashboard.snapshot) {
           scope.panel.snapshotData = results;
         }

public/app/features/panellinks/module.js

@@ -15,7 +15,7 @@ function (angular, _) {
         },
         restrict: 'E',
         controller: 'PanelLinksEditorCtrl',
-        templateUrl: 'app/features/panellinkeditor/module.html',
+        templateUrl: 'app/features/panellinks/module.html',
         link: function() {
         }
       };

public/app/panels/graph/module.js

@@ -197,7 +197,7 @@ function (angular, app, $, _, kbn, moment, TimeSeries, PanelMeta) {
     };
 
     $scope.render = function(data) {
-      $scope.$broadcast('render', data);
+      panelHelper.broadcastRender($scope, data);
     };
 
     $scope.changeSeriesColor = function(series, color) {