AMBARI-17335 Pages on add service wizard taking longer to load. (ababiichuk)

ambari-web/app/config.js

@@ -59,7 +59,7 @@ App.healthStatusRed = '#ff0000';
 App.healthStatusGreen = '#5AB400';
 App.healthStatusOrange = '#FF8E00';
 App.inactivityRemainTime = 60; // in seconds
-
+App.enableLogger = true;
 App.stackVersionsAvailable = true;
 
 // experimental features are automatically enabled if running on brunch server

ambari-web/app/controllers/wizard/step7_controller.js

@@ -406,6 +406,7 @@ App.WizardStep7Controller = Em.Controller.extend(App.ServerValidatorMixin, App.E
       // override if a property isRequired or not
       this.overrideConfigIsRequired(stepConfig);
     }, this);
+    console.timeEnd('loadConfigGroups execution time: ');
   },
 
   /**
@@ -507,6 +508,7 @@ App.WizardStep7Controller = Em.Controller.extend(App.ServerValidatorMixin, App.E
   },
 
   applyServicesConfigs: function (configs) {
+    console.time('applyServicesConfigs execution time: ');
     if (!this.get('installedServiceNames').contains('HAWQ') && this.get('allSelectedServiceNames').contains('HAWQ')) {
       this.updateHawqConfigs(configs);
     }
@@ -530,6 +532,8 @@ App.WizardStep7Controller = Em.Controller.extend(App.ServerValidatorMixin, App.E
     if (rangerService && !rangerService.get('isInstalled') && !rangerService.get('isSelected')) {
       App.config.removeRangerConfigs(this.get('stepConfigs'));
     }
+    console.timeEnd('applyServicesConfigs execution time: ');
+    console.time('loadConfigRecommendations execution time: ');
     this.loadConfigRecommendations(null, this.completeConfigLoading.bind(this));
   },
 
@@ -560,6 +564,7 @@ App.WizardStep7Controller = Em.Controller.extend(App.ServerValidatorMixin, App.E
 
   completeConfigLoading: function() {
     this.clearRecommendationsByServiceName(App.StackService.find().filterProperty('isSelected').mapProperty('serviceName'));
+    console.timeEnd('loadConfigRecommendations execution time: ');
     console.timeEnd('wizard loadStep: ');
     this.set('isRecommendedLoaded', true);
     if (this.get('content.skipConfigStep')) {
@@ -615,6 +620,7 @@ App.WizardStep7Controller = Em.Controller.extend(App.ServerValidatorMixin, App.E
       this.restoreConfigGroups(this.get('content.configGroups'));
     } else {
       if (this.get('installedServiceNames').length > 0 && !this.get('wizardController.areInstalledConfigGroupsLoaded')) {
+        console.time('loadConfigGroups execution time: ');
         this.loadConfigGroups(this.get('allSelectedServiceNames')).done(this.loadOverrides.bind(this));
       } else {
         App.store.commit();

ambari-web/app/messages.js

@@ -3156,5 +3156,9 @@ Em.I18n.translations = {
   'admin.serviceAutoStart.save.popup.transition.body': 'You have unsaved changes',
 
   'reset.ui.states': 'Reset UI State',
-  'reset.ui.states.body': 'You should proceed only if the UI is misbehaving (such as incorrect navigation upon login, UI is stuck and won't load, etc.).  Are you sure you want to reset the UI state?'
+  'reset.ui.states.body': 'You should proceed only if the UI is misbehaving (such as incorrect navigation upon login, UI is stuck and won't load, etc.).  Are you sure you want to reset the UI state?',
+
+  'app.logger.ajax': 'Ajax loading time: {0} [{1}]',
+  'app.logger.wizard': 'wizard step {0} loading time'
+
 };

ambari-web/app/routes/add_service_routes.js

@@ -18,6 +18,7 @@
 
 var App = require('app');
 // @todo: remove App.supports.kerberosAutomated after Kerberos Automation Wizard support
+var consoleMsg = Em.I18n.t('app.logger.wizard');
 
 module.exports = App.WizardRoute.extend({
   route: '/service/add',
@@ -94,6 +95,7 @@ module.exports = App.WizardRoute.extend({
   step1: App.StepRoute.extend({
     route: '/step1',
     connectOutlets: function (router) {
+      App.logger.setTimer(consoleMsg.format(1));
       var controller = router.get('addServiceController');
       controller.setCurrentStep('1');
       controller.set('hideBackButton', true);
@@ -107,6 +109,7 @@ module.exports = App.WizardRoute.extend({
               Ember.set(item, 'serviceVersionDisplay', controller.get('serviceVersionsMap')[item.get('serviceName')]);
               //item.set('serviceVersionDisplay', controller.get('serviceVersionsMap')[item.get('serviceName')]);
             }));
+            App.logger.logTimerIfMoreThan(consoleMsg.format(1));
             controller.connectOutlet('wizardStep4', controller.get('content.services').filterProperty('isInstallable', true));
           });
         });
@@ -130,6 +133,7 @@ module.exports = App.WizardRoute.extend({
   step2: App.StepRoute.extend({
     route: '/step2',
     connectOutlets: function (router) {
+      App.logger.setTimer(consoleMsg.format(2));
       var controller = router.get('addServiceController');
       var wizardStep2Controller = router.get('wizardStep5Controller');
       controller.setCurrentStep('2');
@@ -137,6 +141,7 @@ module.exports = App.WizardRoute.extend({
       wizardStep2Controller.set('isInitialLayout', true);
       controller.dataLoading().done(function () {
         controller.loadAllPriorSteps().done(function () {
+          App.logger.logTimerIfMoreThan(consoleMsg.format(2));
           controller.connectOutlet('wizardStep5', controller.get('content'));
         });
       });
@@ -162,12 +167,14 @@ module.exports = App.WizardRoute.extend({
   step3: App.StepRoute.extend({
     route: '/step3',
     connectOutlets: function (router) {
+      App.logger.setTimer(consoleMsg.format(3));
       var controller = router.get('addServiceController');
       controller.setCurrentStep('3');
       router.get('mainController').isLoading.call(router.get('clusterController'), 'isServiceContentFullyLoaded').done(function () {
         controller.loadAllPriorSteps().done(function () {
           var wizardStep6Controller = router.get('wizardStep6Controller');
           wizardStep6Controller.set('wizardController', controller);
+          App.logger.logTimerIfMoreThan(consoleMsg.format(3));
           controller.connectOutlet('wizardStep6', controller.get('content'));
         });
       });
@@ -208,6 +215,7 @@ module.exports = App.WizardRoute.extend({
   step4: App.StepRoute.extend({
     route: '/step4',
     connectOutlets: function (router) {
+      App.logger.setTimer(consoleMsg.format(4));
       var controller = router.get('addServiceController');
       controller.setCurrentStep('4');
       controller.dataLoading().done(function () {
@@ -218,6 +226,7 @@ module.exports = App.WizardRoute.extend({
           controller.usersLoading().done(function () {
             router.get('mainController').isLoading.call(router.get('clusterController'), 'isClusterNameLoaded').done(function () {
               router.get('mainController').isLoading.call(router.get('clusterController'), 'isServiceContentFullyLoaded').done(function () {
+                App.logger.logTimerIfMoreThan(consoleMsg.format(4));
                 controller.connectOutlet('wizardStep7', controller.get('content'));
               });
             });
@@ -253,12 +262,14 @@ module.exports = App.WizardRoute.extend({
   step5: Em.Route.extend({
     route: '/step5',
     connectOutlets: function (router) {
+      App.logger.setTimer(consoleMsg.format(5));
       var controller = router.get('addServiceController');
       controller.setCurrentStep('5');
       controller.dataLoading().done(function () {
         var kerberosStep4Controller = router.get('kerberosWizardStep4Controller');
         controller.loadAllPriorSteps().done(function () {
           kerberosStep4Controller.set('wizardController', controller);
+          App.logger.logTimerIfMoreThan(consoleMsg.format(5));
           controller.connectOutlet('kerberosWizardStep4', controller.get('content'));
         });
       });
@@ -291,12 +302,14 @@ module.exports = App.WizardRoute.extend({
   step6: App.StepRoute.extend({
     route: '/step6',
     connectOutlets: function (router, context) {
+      App.logger.setTimer(consoleMsg.format(6));
       var controller = router.get('addServiceController');
       controller.setCurrentStep('6');
       controller.dataLoading().done(function () {
         controller.loadAllPriorSteps().done(function () {
           var wizardStep8Controller = router.get('wizardStep8Controller');
           wizardStep8Controller.set('wizardController', controller);
+          App.logger.logTimerIfMoreThan(consoleMsg.format(6));
           controller.connectOutlet('wizardStep8', controller.get('content'));
         });
       });
@@ -334,6 +347,7 @@ module.exports = App.WizardRoute.extend({
   step7: Em.Route.extend({
     route: '/step7',
     connectOutlets: function (router, context) {
+      App.logger.setTimer(consoleMsg.format(7));
       var controller = router.get('addServiceController');
       controller.setCurrentStep('7');
       if (!App.get('testMode')) {              //if test mode is ON don't disable prior steps link.
@@ -343,6 +357,7 @@ module.exports = App.WizardRoute.extend({
         controller.loadAllPriorSteps().done(function () {
           var wizardStep9Controller = router.get('wizardStep9Controller');
           wizardStep9Controller.set('wizardController', controller);
+          App.logger.setTimer(consoleMsg.format(7));
           controller.connectOutlet('wizardStep9', controller.get('content'));
         });
       });

ambari-web/app/utils/ajax/ajax.js

@@ -3028,6 +3028,10 @@ var ajax = Em.Object.extend({
    */
   MAX_GET_URL_LENGTH: 2048,
 
+  consoleMsg: function(name, url) {
+    return Em.I18n.t('app.logger.ajax').format(name, url.substr(7, 100));
+  },
+
   /**
    * Send ajax request
    *
@@ -3067,6 +3071,10 @@ var ajax = Em.Object.extend({
     }
     opt = formatRequest.call(urls[config.name], params);
 
+    var consoleMsg = this.consoleMsg(config.name, opt.url);
+
+    App.logger.setTimer(consoleMsg);
+
     if (opt.url && opt.url.length > this.get('MAX_GET_URL_LENGTH')) {
       opt = doGetAsPost(opt);
     }
@@ -3095,6 +3103,7 @@ var ajax = Em.Object.extend({
       }
     };
     opt.complete = function () {
+      App.logger.logTimerIfMoreThan(consoleMsg, 1000);
       if (config.callback) {
         config.callback();
       }

ambari-web/app/utils/helper.js

@@ -930,3 +930,31 @@ App.resetDsStoreTypeMap = function(type) {
     };
   }
 };
+
+App.logger = function() {
+
+  var timers = {};
+
+  return {
+
+    maxAllowedLoadingTime: 1000,
+
+    setTimer: function(name) {
+      if (!App.get('enableLogger')) return;
+      timers[name] = window.performance.now();
+    },
+
+    logTimerIfMoreThan: function(name, loadingTime) {
+      if (!App.get('enableLogger')) return;
+      this.maxAllowedLoadingTime = loadingTime || this.maxAllowedLoadingTime;
+      if (timers[name]) {
+        var diff = window.performance.now() - timers[name];
+        if (diff > this.maxAllowedLoadingTime) {
+          console.debug(name + ': ' + diff.toFixed(3) + 'ms');
+        }
+        delete timers[name];
+      }
+    }
+  };
+
+}();