0

I stumbled on a rather strange issue in SharePoint 2013 On-Prem. Case:

Home.aspx has two CEWP's:

  1. Has a content link to /SiteAssets/CustomPages/tableOfContents.html
  2. Has a content link to /SiteAssets/CustomPages/adminTools.html

Both HTML files load their own js bundle together with a commons_bundle.js:

tableOfContents.html

<script type="text/javascript" src="../../SiteAssets/js/commons_bundle.js"></script>
<script type="text/javascript" src="../../SiteAssets/js/tableOfContents_bundle.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.taxonomy.js"></script>
<script type="text/javascript">
document.title = "Inhoudstafel - " + _spPageContextInfo.webTitle
ExecuteOrDelayUntilBodyLoaded(function () {
    ExecuteOrDelayUntilScriptLoaded(function () {
        ExecuteOrDelayUntilScriptLoaded(function () {
            ExecuteOrDelayUntilScriptLoaded(function () {
                var args = (window.frameElement) ? window.frameElement.dialogArgs : null;
                spdict.tableOfContents.init("react-webpart", args);
            }, "sp.taxonomy.js");
        }, "sp.js");
    }, "sp.runtime.js");
});
</script>

adminTools.html

<script type="text/javascript" src="../../SiteAssets/js/commons_bundle.js"></script>
<script type="text/javascript" src="../../SiteAssets/js/adminTools_bundle.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.taxonomy.js"></script>
<script type="text/javascript">
ExecuteOrDelayUntilBodyLoaded(function () {
    ExecuteOrDelayUntilScriptLoaded(function () {
        ExecuteOrDelayUntilScriptLoaded(function () {
            ExecuteOrDelayUntilScriptLoaded(function () {
                var args = (window.frameElement) ? window.frameElement.dialogArgs : null;
                spdict.adminTools.init("react-webpart-admin-tools", args);
            }, "sp.taxonomy.js");
        }, "sp.js");
    }, "sp.runtime.js");
});
</script>

As you can see, they both load common_bundle.js. This however seems to cause very slow loading times:

slow loading times

If I comment out commons_bundle.js from the adminTools.html, it loads almost instantly:

faster loading times


I have no idea what is causing this behavior. It looks like the two CEWPs are battling about who may load commons_bundle.js. Is there any way to get this to work without commenting out in adminTools.html?

I tried to add the another ExecuteOrDelayUntilScriptLoaded to adminTools.html to let it wait until commons_bundle.js is loaded. But if I do that, it never reaches the initialization.

Any suggestions are welcome! :) Thanks in advance.

  • Why do you need to reference the same libraries multiple times? The first CEWP will be loaded first, and thus when reaching your second HTML file, the references will already be loaded in the context. – Christoffer Jun 25 '18 at 10:36
  • Well for example, what if we want to use adminTools.html on another page with a single CEWP referring to it? Then we would miss commons_bundle.js... – Perneel Jun 25 '18 at 11:01

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.