From 1ae24b366fc7d320f3e6e76eac16535783c212db Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel.odegaard@gmail.com>
Date: Thu, 16 Jun 2016 08:28:50 +0200
Subject: [PATCH] feat(profiler): fixed issues with frontend perf profiler

---
 public/app/core/components/grafana_app.ts     |  1 +
 public/app/core/profiler.ts                   | 38 +++++++------------
 public/app/core/routes/dashboard_loaders.js   |  1 +
 .../features/dashboard/dashboardLoaderSrv.js  |  1 -
 .../app/features/dashboard/dashboard_ctrl.ts  |  2 +-
 5 files changed, 17 insertions(+), 26 deletions(-)

diff --git a/public/app/core/components/grafana_app.ts b/public/app/core/components/grafana_app.ts
index 91eebe09915..6630fbe9517 100644
--- a/public/app/core/components/grafana_app.ts
+++ b/public/app/core/components/grafana_app.ts
@@ -29,6 +29,7 @@ export class GrafanaCtrl {
     };
 
     $scope.initDashboard = function(dashboardData, viewScope) {
+      $scope.appEvent("dashboard-fetch-end", dashboardData);
       $controller('DashboardCtrl', { $scope: viewScope }).init(dashboardData);
     };
 
diff --git a/public/app/core/profiler.ts b/public/app/core/profiler.ts
index 3e66916ced7..08e5ea457ab 100644
--- a/public/app/core/profiler.ts
+++ b/public/app/core/profiler.ts
@@ -7,7 +7,6 @@ import angular from 'angular';
 export class Profiler {
   panelsRendered: number;
   enabled: boolean;
-  panels: any[];
   panelsInitCount: any;
   timings: any;
   digestCounter: any;
@@ -29,28 +28,21 @@ export class Profiler {
       return false;
     }, () => {});
 
-    $rootScope.$on('refresh', this.refresh.bind(this));
-    $rootScope.onAppEvent('dashboard-fetched', this.dashboardFetched.bind(this));
-    $rootScope.onAppEvent('dashboard-initialized', this.dashboardInitialized.bind(this));
-    $rootScope.onAppEvent('panel-initialized', this.panelInitialized.bind(this));
+    $rootScope.onAppEvent('refresh', this.refresh.bind(this), $rootScope);
+    $rootScope.onAppEvent('dashboard-fetch-end', this.dashboardFetched.bind(this), $rootScope);
+    $rootScope.onAppEvent('dashboard-initialized', this.dashboardInitialized.bind(this), $rootScope);
+    $rootScope.onAppEvent('panel-initialized', this.panelInitialized.bind(this), $rootScope);
   }
 
   refresh() {
-    this.panels = [];
+    this.timings.query = 0;
+    this.timings.render = 0;
 
     setTimeout(() => {
-      var totalRender = 0;
-      var totalQuery = 0;
-
-      for (let panelTiming of this.panels) {
-        totalRender += panelTiming.render;
-        totalQuery += panelTiming.query;
-      }
-
-      console.log('panel count: ' + this.panels.length);
-      console.log('total query: ' + totalQuery);
-      console.log('total render: ' + totalRender);
-      console.log('avg render: ' + totalRender / this.panels.length);
+      console.log('panel count: ' + this.panelsInitCount);
+      console.log('total query: ' + this.timings.query);
+      console.log('total render: ' + this.timings.render);
+      console.log('avg render: ' + this.timings.render / this.panelsInitCount);
     }, 5000);
   }
 
@@ -60,7 +52,8 @@ export class Profiler {
     this.digestCounter = 0;
     this.panelsInitCount = 0;
     this.panelsRendered = 0;
-    this.panels = [];
+    this.timings.query = 0;
+    this.timings.render = 0;
   }
 
   dashboardInitialized() {
@@ -110,11 +103,8 @@ export class Profiler {
 
     if (this.enabled) {
       panelTimings.renderEnd = new Date().getTime();
-      this.panels.push({
-        panelId: panelId,
-        query: panelTimings.queryEnd - panelTimings.queryStart,
-        render: panelTimings.renderEnd - panelTimings.renderStart,
-      });
+      this.timings.query += panelTimings.queryEnd - panelTimings.queryStart;
+      this.timings.render += panelTimings.renderEnd - panelTimings.renderStart;
     }
   }
 
diff --git a/public/app/core/routes/dashboard_loaders.js b/public/app/core/routes/dashboard_loaders.js
index 97f7213850d..49e81c23a7e 100644
--- a/public/app/core/routes/dashboard_loaders.js
+++ b/public/app/core/routes/dashboard_loaders.js
@@ -5,6 +5,7 @@ function (coreModule) {
   "use strict";
 
   coreModule.default.controller('LoadDashboardCtrl', function($scope, $routeParams, dashboardLoaderSrv, backendSrv, $location) {
+    $scope.appEvent("dashboard-fetch-start");
 
     if (!$routeParams.slug) {
       backendSrv.get('/api/dashboards/home').then(function(homeDash) {
diff --git a/public/app/features/dashboard/dashboardLoaderSrv.js b/public/app/features/dashboard/dashboardLoaderSrv.js
index 70c49967ea5..c6df45f53b2 100644
--- a/public/app/features/dashboard/dashboardLoaderSrv.js
+++ b/public/app/features/dashboard/dashboardLoaderSrv.js
@@ -47,7 +47,6 @@ function (angular, moment, _, $, kbn, dateMath, impressionStore) {
       }
 
       promise.then(function(result) {
-        $rootScope.appEvent("dashboard-fetched", result.dashboard);
 
         if (result.meta.dashboardNotFound !== true) {
           impressionStore.impressions.addDashboardImpression(result.dashboard.id);
diff --git a/public/app/features/dashboard/dashboard_ctrl.ts b/public/app/features/dashboard/dashboard_ctrl.ts
index bd90cd08f00..3f3c9eb4c0b 100644
--- a/public/app/features/dashboard/dashboard_ctrl.ts
+++ b/public/app/features/dashboard/dashboard_ctrl.ts
@@ -51,7 +51,7 @@ export class DashboardCtrl {
           $scope.updateSubmenuVisibility();
           $scope.setWindowTitleAndTheme();
 
-          $scope.appEvent("dashboard-loaded", $scope.dashboard);
+          $scope.appEvent("dashboard-initialized", $scope.dashboard);
         }).catch(function(err) {
           if (err.data && err.data.message) { err.message = err.data.message; }
           $scope.appEvent("alert-error", ['Dashboard init failed', 'Template variables could not be initialized: ' + err.message]);