load bootstraps as quickly as possible

elastic · Feb 7, 2020 · 0991715 · 0991715
1 parent db4aaf7
commit 0991715
Showing 1 changed file with 50 additions and 49 deletions.
diff --git a/src/legacy/ui/ui_render/bootstrap/template.js.hbs b/src/legacy/ui/ui_render/bootstrap/template.js.hbs
@@ -13,19 +13,7 @@ if (window.__kbnStrictCsp__ && window.__kbnCspNotEnforced__) {
   loadingMessage.style.display = 'flex';
 
   window.onload = function () {
-    var files = [
-      '{{dllBundlePath}}/vendors_runtime.bundle.dll.js',
-      [
-        {{#each dllJsChunks}}
-          '{{this}}',
-        {{/each}}
-        '{{regularBundlePath}}/kbn-ui-shared-deps/{{sharedDepsFilename}}',
-        '{{regularBundlePath}}/commons.bundle.js',
-      ],
-      '{{regularBundlePath}}/{{appId}}.bundle.js'
-    ];
-
-    var failure = function () {
+    function failure() {
       // make subsequent calls to failure() noop
       failure = function () {};
 
@@ -40,60 +28,73 @@ if (window.__kbnStrictCsp__ && window.__kbnCspNotEnforced__) {
       document.body.innerHTML = err.outerHTML;
     }
 
-    function loadStyleSheet(path) {
+    function loadStyleSheet(url, cb) {
       var dom = document.createElement('link');
-
       dom.addEventListener('error', failure);
       dom.setAttribute('rel', 'stylesheet');
       dom.setAttribute('type', 'text/css');
-      dom.setAttribute('href', path);
-      document.head.appendChild(dom);
-    }
-
-    function createJavascriptElement(path) {
-      var dom = document.createElement('script');
-
-      dom.setAttribute('defer', 'defer');
-      dom.addEventListener('error', failure);
-      dom.setAttribute('src', file);
-      dom.addEventListener('load', next);
+      dom.setAttribute('href', url);
+      dom.addEventListener('load', cb);
       document.head.appendChild(dom);
     }
 
-    function loadJs(file, cb) {
+    function loadScript(url, cb) {
       var dom = document.createElement('script');
-
       dom.setAttribute('async', '');
       dom.addEventListener('error', failure);
-      dom.setAttribute('src', file);
+      dom.setAttribute('src', url);
       dom.addEventListener('load', cb);
       document.head.appendChild(dom);
     }
 
-    function loadJsInParallel(files, cb) {
-      var pending = files.length;
-      for (var i = 0; i < files.length; i++) {
-        loadJs(files[i], function () {
+    function load(urlSet, cb) {
+      if (urlSet.deps) {
+        load({ urls: urlSet.deps }, function () {
+          load({ urls: urlSet.urls }, cb);
+        });
+        return;
+      }
+
+      var pending = urlSet.urls.length;
+      urlSet.urls.forEach(function (url) {
+        var innerCb = function () {
           pending = pending - 1;
-          if (pending === 0) {
+          if (pending === 0 && typeof cb === 'function') {
             cb();
           }
-        })
-      }
-    }
+        }
 
-    {{#each styleSheetPaths}}
-      loadStyleSheet('{{this}}');
-    {{/each}}
+        if (typeof url !== 'string') {
+          load(url, innerCb);
+        } else if (url.slice(-4) === '.css') {
+          loadStyleSheet(url, innerCb);
+        } else {
+          loadScript(url, innerCb);
+        }
+      });
+    }
 
-    (function next() {
-      var file = files.shift();
-      if (!file) return;
-      if (typeof file === 'string') {
-        loadJs(file, next);
-      } else {
-        loadJsInParallel(file, next);
-      }
-    }());
+    load({
+      deps: [
+        {
+          deps: [
+            '{{dllBundlePath}}/vendors_runtime.bundle.dll.js'
+          ],
+          urls: [
+            {{#each dllJsChunks}}
+              '{{this}}',
+            {{/each}}
+          ]
+        },
+        '{{regularBundlePath}}/kbn-ui-shared-deps/{{sharedDepsFilename}}',
+        '{{regularBundlePath}}/commons.bundle.js',
+      ],
+      urls: [
+        '{{regularBundlePath}}/{{appId}}.bundle.js',
+        {{#each styleSheetPaths}}
+          '{{this}}',
+        {{/each}},
+      ]
+    });
   };
 }