You don’t know JS about SharePoint – SharePoint JavaScript Context best practices for C# developers Delivered by: Hugh Wood Audience: Developer Building a framework is often common practice for most companies and vendors who want to achieve similar things over and over. However when it comes to a language like JavaScript in SharePoint, things aren't as straight forward as it seems. In this session I will cover how to handle Minimal Download Strategy, Scripts On Demand, Garbage Collection, and many tips and tricks in making your code work, first time and every time. What you will Learn: How to structure a framework in JavaScript for SharePoint How to call Scripts on demand How to work with Minimal Download Strategy How to utilise the SharePoint JavaScript Garbage Collector to your advantage What are the valuable takeaways from the SharePoint JavaScript Libraries in SharePoint

1. You don’t know JS about
SharePoint – SharePoint
JavaScript Context best
practices for C# developers
Hugh Wood

2.  Hugh Wood
 Rencore AB
 www.SPCAF.com
 Hugh.Wood@Rencore.se
 Professional software developer since 2000, first
wrote JS in `95, first wrote code in `87.
Expert in compiler theory, code security and
code performance.

3. Agenda
 Introduction to the topic
 JS File Structure
 Garbage Collection
 Dynamic Module Loading
 Built in Helper Methods

4. Introduction

5. Why you should care
Source: Loggly

6. C# JavaScript
Multi-Paradigm Functional, Event Driven
Strongly Typed OR
Loosely Typed
Loosely Typed (Strong
types are coming 2015)
ECMA-334 ECMAScript-5

8. Inside SharePoint

9. JavaScript File Structure
 The Module Pattern
 It must provide public facing methods
 A module must have an initialiser method
 A module must have a finaliser method
 Supporting members may require additional
initialisation/finalisation code
 Members are used to perform operations on
elements external to the class

10. JS FILE STRUCTURE

11. ADM
 Asynchronous Download Manager
 The technology behind MDS (Minimal
Download Strategy)
 It simulates full page load
 Only loads parts of the page
 Re-initialises the bootstrap

12. ADM Program Flow

13. ADM – What we need to do
 Register our namespace
 Register the initialisation method

14. Dynamic Module Loading
 Lazy loading external files
 Same principle as a DLL
 Asynchronous Module Definition
 Not available in ECMA5
 It will be available in ECMA6
 SharePoint won’t be using ECMA6

15. Dynamic Module Loading
 Scripts On Demand (SP.SOD)
 Each script must:
– Use a named method around the code
– Register this method with SharePoint
– Report it is ready when loaded
– Register a module initialisation method if required

16. Dynamic Module Loading
 Scripts On Demand (SP.SOD)
 To load each script we must:
– Register the script with SharePoint
– Ask the script to be loaded
– Give an action to be executed when the script has
been loaded

17. Scripts On Demand
 Available Methods for Scripts
 Register SOD
 Register SOD Dependency
 Load by Key / Load Multiple
 Execute or Delay until Script Loaded
 Execute / Execute Function
 Notify Script Loaded

18. SCRIPTS ON DEMAND
A FULL MODULE

19. Where do we put our core
module?
 Core Module – Not on demand via
CustomAction
 Other parts – On demand as needed
 ScriptLink
 JS Link
 Another JS file
 NEVER from a Script Block

20. But what can we gain?
 SP.Init – Learn this file.
 Built in helper methods
 SP.ScriptUtility
 SP.ScriptHelpers
 mQuery
 SP.Utilities
– Task Engine
– Animation

21. Cancellable Command API
Working on it…
This shouldn’t take long.
#SPSSTHLM19: SharePoint JavaScript, doing it right – @HughAJWood

22. #SPSSTHLM19: SharePoint JavaScript, doing it right – @HughAJWood

23. Animation Engine
#SPSSTHLM19: SharePoint JavaScript, doing it right – @HughAJWood

24. #SPSSTHLM19: SharePoint JavaScript, doing it right – @HughAJWood

25. Remote Request Executor
#SPSSTHLM19: SharePoint JavaScript, doing it right – @HughAJWood

26. #SPSSTHLM19: SharePoint JavaScript, doing it right – @HughAJWood

27. mQuery
m$
#SPSSTHLM19: SharePoint JavaScript, doing it right – @HughAJWood

28. GOTCHAS
 Private properties are extra private across
files - Handled
 Race conditions - Practice
 SharePoint probably already has a method
for that – Learn
 No documentation - Governance

29. Governance
Pro Con
Tested and Guaranteed Patches can change
code
Reduced development
time
Could contain a bug
Less overhead on client No documentation
Easier to maintain code Overly Complex for
simple tasks

30. Wrapping it up





31. Ask me anything and
tell me what you want to hear
about.
Hugh Wood
www.spcaf.com/blog
@hughajwood