perf: debug mode & lazy validators (ME-15925) (#606)

* perf: lazy validators

* chore: cleanup

* chore: cleanup

* chore: pr comments

* Revert "chore: pr comments"

This reverts commit d435ca5.

* chore: pr comments

* chore: pr comments

Author: tsi

src/plugins/ima/index.js

@@ -12,10 +12,10 @@ export default async function imaPlugin(player, playerOptions) {
 
   if (playerOptions.ads && (!loaded.contribAdsLoaded || !loaded.imaAdsLoaded)) {
     if (!loaded.contribAdsLoaded) {
-      console.log('contribAds is not loaded');
+      console.warn('contribAds is not loaded');
     }
     if (!loaded.imaAdsLoaded) {
-      console.log('imaSdk is not loaded');
+      console.warn('imaSdk is not loaded');
     }
     return false;
   }

src/utils/cloudinary.js

@@ -33,7 +33,9 @@ const setError = (that, res) => {
 };
 
 const setVideoSrc = (that, srcs) => {
-  console.log('Trying sources: ', srcs);
+  if (that.options.playerOptions.debug) {
+    console.log('Trying sources: ', srcs);
+  }
   srcs.forEach(s => {
     s.try = true;
   });
@@ -57,7 +59,6 @@ const handleCldError = (that, options) => {
         if (goodSrcs && goodSrcs.length) {
           setVideoSrc(that, goodSrcs);
         } else {
-          console.log('No urls left to try so stopping');
           that.videojs.error({ code: ERROR_CODE.NO_SUPPORTED_MEDIA, message: 'No supported media sources', statusCode: res.status });
         }
       }

src/validators/validators-functions.js

@@ -47,3 +47,25 @@ export const isValidConfig = (config, validators) => {
 
   return true;
 };
+
+/**
+ * check if a configuration object is valid or not
+ * @param  {object} config -  a config object
+ * @returns boolean - true is the configuration object is valid and false if it is not
+ */
+export const isValidPlayerConfig = async (config) => {
+  return import(/* webpackChunkName: "validators" */ './validators').then(({playerValidators}) => {
+    return isValidConfig(config, playerValidators);
+  });
+};
+
+/**
+ * check if a configuration object is valid or not
+ * @param  {object} config -  a config object
+ * @returns boolean - true is the configuration object is valid and false if it is not
+ */
+export const isValidSourceConfig = (config) => {
+  return import(/* webpackChunkName: "validators" */ './validators').then(({sourceValidators}) => {
+    return isValidConfig(config, sourceValidators);
+  });
+};

src/validators/validators.js

@@ -35,6 +35,7 @@ export const playerValidators = {
     }
   },
   playerOptions: {
+    debug: validator.isBoolean,
     queryParams: validator.isPlainObject,
     publicId: validator.isString,
     fluid: validator.isBoolean,

src/video-player.const.js

@@ -12,6 +12,7 @@ export const CLOUDINARY_PARAMS = [
 ];
 
 export const PLAYER_PARAMS = CLOUDINARY_PARAMS.concat([
+  'debug',
   'publicId',
   'source',
   'autoplayMode',

src/video-player.js

@@ -18,8 +18,7 @@ import {
   overrideDefaultVideojsComponents
 } from './video-player.utils';
 import { FLOATING_TO, FLUID_CLASS_NAME } from './video-player.const';
-import { isValidConfig } from './validators/validators-functions';
-import { playerValidators, sourceValidators } from './validators/validators';
+import { isValidPlayerConfig, isValidSourceConfig } from './validators/validators-functions';
 import { PLAYER_EVENT, SOURCE_TYPE } from './utils/consts';
 import { getAnalyticsFromPlayerOptions } from './utils/get-analytics-player-options';
 import { extendCloudinaryConfig, normalizeOptions, isRawUrl } from './plugins/cloudinary/common';
@@ -72,14 +71,15 @@ class VideoPlayer extends Utils.mixin(Eventable) {
 
     this.videojs = videojs(this.videoElement, this._videojsOptions);
 
-    // to do, should be change by isValidConfig
     this._isPlayerConfigValid = true;
-
-    isValidConfig(this.options, playerValidators);
-
-    if (!this._isPlayerConfigValid) {
-      this.videojs.error('invalid player configuration');
-      return;
+    if (this.playerOptions.debug) {
+      isValidPlayerConfig(this.options).then((valid) => {
+        if (!valid) {
+          this._isPlayerConfigValid = false;
+          this.videojs.error('invalid player configuration');
+          return;
+        }
+      });
     }
 
     if (this._videojsOptions.muted) {
@@ -390,7 +390,7 @@ class VideoPlayer extends Utils.mixin(Eventable) {
   _initAnalytics() {
     const analyticsOpts = this.playerOptions.analytics;
 
-    if (!window.ga && analyticsOpts) {
+    if (!window.ga && analyticsOpts && this.playerOptions.debug) {
       console.error('Google Analytics script is missing');
       return;
     }
@@ -528,11 +528,12 @@ class VideoPlayer extends Utils.mixin(Eventable) {
       return;
     }
 
-    const isSourceConfigValid = isValidConfig(options, sourceValidators);
-
-    if (!isSourceConfigValid) {
-      this.videojs.error('invalid source configuration');
-      return;
+    if (this.playerOptions.debug) {
+      isValidSourceConfig(options).then((valid) => {
+        if (!valid) {
+          this.videojs.error('invalid source configuration');
+        }
+      });
     }
 
     this._sendInternalAnalytics({ source: options });