Изпълнение на custom scripts в SharePoint 2013 с включен MDS модул

ВЪВЕДЕНИЕ

SharePoint е практически изграден на базата на JavaScript. Скриптовият език се използва за всичко - от смяна на видимото съдържание, до най-различни козметични ефекти. Тъй-като MDS е сложна обвивка(wrapper) около основната част(ядро или core) на SP, писането на JS бива леко усложнено. Проблемите възникват предимно поради слабата документация около MDS и неговият програмен интерфейс(API). В тази статия ще ви напиша основните неща, които трябва да се разгледат при писане на JS за SP2013.

КАКВО Е MDS?

Minimal Download Strategy(MDS) е технология, която позволява значително намаляване на трафика, необходим за изпълнение и визуализация на SharePoint страници. Това става, като се изчислят само регионите на страницата които имат нужда от обновяване и се зареди информация само за тях. Например, ако разглеждаме една галерия, няма нужда да се презареждат навигационните бутони и менютата, а само снимките за различните страници. Това спестява трафик и повишава производителността на сайта.

ПРОБЛЕМИТЕ

MDS работи много добре с настройките и скриптовете, активирани по подразбиране в SP2013. Какво се случва, ако добавим собствен код? Ако скриптовете, които се опитваме да изпълним на някоя SP2013 страница, не са пригодени за MDS, не само, че няма да видим повишение на производителността, но е възможно и тя да намалее.

Има два възможни варианта, когато стане дума за custom скриптове: 1) MDS престава да работи 2) Вашият скрипт не се изпълнява, както сте искали

Всеки front-end developer е виждал скриптове, които се изпълняват при зареждане на страницата. Това е възможно защото браузърът “хвърля” събитие(DOM Ready), когато приключи със зареждането на HTML кодът и така, всеки скрипт следящ за това събитие може да се изпълни. Проблемът при MDS е, че това събитие се изпълнява веднъж - при първоначално зареждане на страницата в браузъра. При преминаване към всяка следваща страница, се изпълнява JavaScript код, които променя само част от съдържанието и такова събитие не бива изпълнено от браузъра.

КАК ДА РАЗБЕРЕМ, ЧЕ ИМА ПРОБЛЕМ С MDS

Понякога, като добавим своите скриптове, нормалната работа на MDS бива прекъсната. Най-често това се забелязва, като при сърфиране между страниците се наблюдава “проблясък”, т.е. всяка страница зарежда по два пъти, като първият път тя се зарежда празна.

РЕШЕНИЕ НА ПРОБЛЕМА

Има две неща на които трябва да се обърне специално внимание.

Проблемът с Garbage Collector-ът Първото, което трябва да се знае, е че MDS има вграден Garbage Collector. Това е система, която следи и почиства паметта от неизползвани променливи за да предотврати т.н. изтичане на памет(Memory Leak). При преминаване между страниците, MDS затрива всички ненужни променливи в window областта(scope). За да избегнем това, трябва да регистрираме скриптовете си, като namespace. Ако имаме обект “MyObject”, това става по следният начин:

var MyObject = window.MyObject {};
Type.registerNamespace(“MyObject”);

По този начин ние задаваме MyObject като променлива от тип Microsoft Ajax и указваме на Garbage Collector-ът да не я закача при преминаване между различните страници.

Проблем в изпълнението на MDS При някои случаи, е възможно MDS да не може да се задейства, след което SharePoint се връща към стандартно изпълнение на страницата и я презарежда изцяло с изключен MDS. Това увеличава ресурсите нужни за изпълнение и зареждане на страницата, понеже тя практически се изпълнява два пъти - веднъж с включен MDS и веднъж с изключен. Възможните причини за това са колизии(collisions) или неправилно променени SP2013 файлове(например добавен код в master файлове). За да се избегнат колизиите, винаги обвивайте скриптовете си в обекти(ако е нужно и анонимни функции) с уникални имена, такива че да няма възможност те да презаписват обект по подразбиране в SP2013. Относно промяната на стокови SP файлове - някои ще каже “да ама, няма как да не ги променяме - нали трябва да включим собствените си скриптове в страницата”. Наистина е така, но трябва да се следи за изпълнението на някои правила. Аз препоръчвам включването на скриптове да става динамично със скрипт написан и добавен в init.js init.js се изпълнява на всяка страница, както master файловете, но не пречи на MDS затова е идеално място за поставяне на кода. Примерен JS код:

var MyScriptElement = document.createElement(‘script’);
MyScriptElement.type = ‘text/javascript’;
MyScriptElement.async = true;
MyScriptElement.src = ‘<path_to_my_script.js>’;
var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(MyScriptElement, s);

Ако все пак се наложи да добави скриптът си използвайки master файловете, ползвайте следният код:

<SharePoint:ScriptLink Name=”<path_to_my_script.js>” Localizable=”false” runat=”server” />

ИЗПЪЛНЕНИЕ ПРИ ВКЛЮЧЕН MDS Ако сте изпълнили написаното по-горе, значи сте свършили половината работа, за да накарате скриптовете си да работят с MDS. Това, което направихме до сега ни дава основа за работа, но остава още едно нещо - да зададем на кодът си, че трябва да се изпълни при смяна на страницата. Как става това? Когато страниците се сменят, MDS презарежда част от съдържанието, след което start.js хвърля събитие, че свичко е говото. За да се абонираме за това събитие, разработчиците от Microsoft са създали специална функция - ExecuteOrDelayUntilScriptLoaded Ето и примерен код как се използва тя:

function MyCustomFunction(){
console.log(‘Script loaded’);
}

ExecuteOrDelayUntilScriptLoaded(function () {
if (typeof asyncDeltaManager != “undefined”)
asyncDeltaManager.add_endRequest(function () { MyCustomFunction() }); //after MDS loads the changes
else MyCustomFunction();
}, “start.js”);

Този код, казва на ядрото да изпълни функцията MyCustomFunction, като start.js приключи зареждането на страницата.

ЗАКЛЮЧЕНИЕ Тази статия ви показа, как да настроите собственият си JavaScript код, така че да работи с нововъведената функция в SharePoint 2013 - Minimal Download Strategy. Намирането на тази информация беше трудно и ми отне значително време, затова се надявам да го спестя някому.

Източник: http://www.wictorwilen.se/the-correct-way-to-execute-javascript-functions-in-sharepoint-2013-mds-enabled-sites http://stackoverflow.com/questions/2506021/register-include-javascript-within-renderingtemplate