JS Optimizations

CRM/Core/Resources.php

@@ -712,7 +712,6 @@ public function coreResourceList($region) {
       "bower_components/select2/select2.min.js",
       "bower_components/select2/select2.min.css",
       "bower_components/font-awesome/css/font-awesome.min.css",
-      "packages/jquery/plugins/jquery.tableHeader.js",
       "packages/jquery/plugins/jquery.form.min.js",
       "packages/jquery/plugins/jquery.timeentry.min.js",
       "packages/jquery/plugins/jquery.blockUI.min.js",
@@ -727,13 +726,18 @@ public function coreResourceList($region) {
     // add wysiwyg editor
     $editor = Civi::settings()->get('editor_id');
     if ($editor == "CKEditor") {
-      $items[] = "js/wysiwyg/crm.ckeditor.js";
       CRM_Admin_Page_CKEditorConfig::setConfigDefault();
-      $items[] = array('config' => array('CKEditorCustomConfig' => CRM_Admin_Page_CKEditorConfig::getConfigUrl()));
+      $items[] = array(
+        'config' => array(
+          'wysisygScriptLocation' => Civi::paths()->getUrl("[civicrm.root]/js/wysiwyg/crm.ckeditor.js"),
+          'CKEditorCustomConfig' => CRM_Admin_Page_CKEditorConfig::getConfigUrl(),
+        ),
+      );
     }
 
     // These scripts are only needed by back-office users
     if (CRM_Core_Permission::check('access CiviCRM')) {
+      $items[] = "packages/jquery/plugins/jquery.tableHeader.js";
       $items[] = "packages/jquery/plugins/jquery.menu.min.js";
       $items[] = "css/civicrmNavigation.css";
       $items[] = "packages/jquery/plugins/jquery.jeditable.min.js";

js/Common.js

@@ -237,6 +237,20 @@ if (!CRM.vars) CRM.vars = {};
     }
   };
 
+  var scriptsLoaded = {};
+  CRM.loadScript = function(url) {
+    if (!scriptsLoaded[url]) {
+      var script = document.createElement('script');
+      scriptsLoaded[url] = $.Deferred();
+      script.onload = function () {
+        scriptsLoaded[url].resolve();
+      };
+      script.src = url;
+      document.getElementsByTagName("head")[0].appendChild(script);
+    }
+    return scriptsLoaded[url];
+  };
+
   /**
    * Populate a select list, overwriting the existing options except for the placeholder.
    * @param select jquery selector - 1 or more select elements

js/wysiwyg/crm.ckeditor.js

@@ -1,6 +1,5 @@
 // https://civicrm.org/licensing
 (function($, _) {
-  var scriptLoaded = false;
 
   function getInstance(item) {
     var name = $(item).attr("name"),
@@ -13,18 +12,9 @@
     }
   }
 
-  function loadScript(url) {
-    var deferred = $.Deferred(),
-      script = document.createElement('script');
-    script.onload = function() {deferred.resolve();};
-    script.src = url;
-    document.getElementsByTagName("head")[0].appendChild(script);
-    return deferred;
-  }
-
   CRM.wysiwyg.supportsFileUploads =  true;
 
-  CRM.wysiwyg.create = function(item) {
+  CRM.wysiwyg._create = function(item) {
     var deferred = $.Deferred();
 
     function onReady() {
@@ -94,10 +84,7 @@
       if (window.CKEDITOR) {
         initialize();
       } else {
-        if (scriptLoaded === false) {
-          scriptLoaded = loadScript(CRM.config.resourceBase + 'bower_components/ckeditor/ckeditor.js');
-        }
-        scriptLoaded.done(initialize);
+        CRM.loadScript(CRM.config.resourceBase + 'bower_components/ckeditor/ckeditor.js').done(initialize);
       }
     } else {
       deferred.reject();

js/wysiwyg/crm.wysiwyg.js

@@ -3,9 +3,20 @@
   // This defines an interface which by default only handles plain textareas
   // A wysiwyg implementation can extend this by overriding as many of these functions as needed
   CRM.wysiwyg = {
-    supportsFileUploads: false,
-    create: function() {
-      return $.Deferred().resolve();
+    supportsFileUploads: !!CRM.config.wysisygScriptLocation,
+    create: function(item) {
+      var ret = $.Deferred();
+      // Lazy-load the wysiwyg js
+      if (CRM.config.wysisygScriptLocation) {
+        CRM.loadScript(CRM.config.wysisygScriptLocation).done(function() {
+          CRM.wysiwyg._create(item).done(function() {
+            ret.resolve();
+          });
+        });
+      } else {
+        ret.resolve();
+      }
+      return ret;
     },
     destroy: _.noop,
     updateElement: _.noop,