Merge pull request #283 from magento-obsessive-owls/MC-19192

MC-19192: Backport Page Builder TinyMCE Performance Fix

Author: cspruiell

app/code/Magento/PageBuilder/view/adminhtml/templates/stage/render.phtml

@@ -19,6 +19,7 @@
         'map': {
             '*': {
                 'text': 'Magento_PageBuilder/js/master-format/render/requirejs/text',
+                'Magento_PageBuilder/js/events': 'Magento_PageBuilder/js/master-format/render/events',
             }
         },
     });

app/code/Magento/PageBuilder/view/adminhtml/web/js/master-format/render/events.js

@@ -0,0 +1,19 @@
+/**
+ * Copyright © Magento, Inc. All rights reserved.
+ * See COPYING.txt for license details.
+ */
+
+/**
+ * The frame does not need to create or observe events, however the app will naturally attempt to. So let's stop that!
+ */
+export default {
+    on() {
+        return this;
+    },
+    off() {
+        return this;
+    },
+    trigger() {
+        return this;
+    },
+};

app/code/Magento/PageBuilder/view/adminhtml/web/js/wysiwyg/tinymce4.js

@@ -55,6 +55,14 @@ export default class Wysiwyg implements WysiwygInterface {
      */
     private fieldName: string;
 
+    /**
+     * Create a debounce to save the content into the data store
+     */
+    private saveContentDebounce = _.debounce(
+        this.saveContentFromWysiwygToDataStore.bind(this),
+        500,
+    );
+
     /**
      * @param {String} contentTypeId The ID in the registry of the content type.
      * @param {String} elementId The ID of the editor element in the DOM.
@@ -148,8 +156,7 @@ export default class Wysiwyg implements WysiwygInterface {
      * Called for the onChangeContent event
      */
     private onChangeContent() {
-        const saveContent = _.debounce(this.saveContentFromWysiwygToDataStore.bind(this), 100);
-        saveContent();
+        this.saveContentDebounce();
         this.invertInlineEditorToAccommodateOffscreenToolbar();
     }