The document discusses SharePoint JavaScript best practices for C# developers, covering topics such as file structure, garbage collection, and dynamic module loading. It emphasizes the importance of using a module pattern, registering namespaces, and leveraging SharePoint's built-in helper methods. Additionally, it addresses the benefits and drawbacks of relying on SharePoint's existing methods and encourages developers to seek further information.

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