SharePoint 2013 introduced a new feature to aid in page load times called the Minimal Download Strategy.  This only downloads JavaScript files when they are necessary.  This sounds good until you try to load your custom JavaScript files that rely on standard hooks that SharePoint provides with it’s JavaScript files.  The end result of all of this is that your code doesn’t execute.  Certain site templates come with this feature enabled by default and some don’t.  And since it is a web scoped feature, site owners can turn this on and off on their own.  So, the moral of this story is: you will likely need your code to work whether the Minimal Download Strategy feature is enabled or not.  In a previous post I showed how you could inject links into the suite bar in SharePoint 2013 on-premise or online using jQuery.  This method works fine if you have the Minimal Download Strategy turned off, but would need to be updated to work with it on. 

In the example below, I am loading a JavaScript file to the Master Page Gallery via a Sandbox solution called injectSuiteBar.js.  The code below is included in that file.  In the previous example, I would wrap the code that is inserting the links in a function called injectLink.  This injectLink function below is a simple example to add a link to the gray bar below the Suite Bar.  I’ll put the code to account for the Minimal Download strategy here, then call out a few of the things that are happening below.

   1: var $s = jQuery.noConflict();

   2: var prePendString = "";

   3:  

   4: function injectLink()

   5: {

   6:     prePendString   = "<a title='C5 Insight Public Site.' class='ms-promotedActionButton' \

   7:                        id='ctl00_site_feedback_button' style='display: inline-block;' \

   8:                        href='http://c5insight.com.com'> \

   9:                        <img alt='C5 Insight' style='margin:0px 2px -5px 0px;' src='/sites/teams/Pictures/c5logosmall.png'> \

  10:                        <span class='ms-promotedActionButton-text'>C5 Insight</span></a>";

  11:  

  12:     $s('.ms-core-suiteLinkList').prepend(prePendString);             

  13: }

  14:  

  15: MdsLoadTest = function () {

  16:     var thisUrl = _spPageContextInfo.siteServerRelativeUrl + "/_catalogs/masterpage/injectSuiteBar.js";

  17:     

  18:     RegisterModuleInit(thisUrl, injectLink)

  19:     injectLink();

  20: }

  21:  

  22: if (typeof _spPageContextInfo != "undefined" && _spPageContextInfo != null) 

  23: {

  24:     MdsLoadTest();

  25: } 

  26: else 

  27: {

  28:     $s(document).ready(function () {

  29:         injectLink();

  30:     });

  31: }

Lines 4-12 insert the link using jQuery.  You will need to make sure to load the jQuery library before this file is called.

Lines 22-31 are where the magic happens to account for the Minimal Download Strategy.  Line 22 checks to see if core values are available.  These would be loaded by the SharePoint JavaScript if it had loaded.  If they aren’t there, then you know the files didn’t load, so we have to call into the function on line 15 to load and register our file to be loaded.

For more information on C5 Insight or this blog entry, please Contact Us.