In software, there are two categories that don’t receive enough attention no matter the language you write. Hugh Wood, Lead Developer at Rencore, will focus on how this affects any JavaScript you write. One is understandably performance: you might not care about performance until the 11th hour and this sometimes is a valid point. However, performance can sometimes be attributed to a factor in a Risk Assessment for Usability, Stability or Security. Security isn’t often factored into code that is written, and the current structure of how people work opens up new avenues of attack. With SharePoint ask yourself one question before signing up for this webinar: should you sacrifice Security for Performance?

1. w: rencore.com | e: info@rencore.com | t: @rencoreab
Developing Secure & Performant
JavaScript for SharePoint
Hugh Wood
June 29th, 2017

2. rencore.com
Q&A
Please use the Q&A functionality in
Zoom instead of chat.
We will pick up some questions at
the end and answer the others in
the follow-up email.
FAQ:
Recording of this webinar?
Yes, the session is recorded and you
will get the recording later today.

3. Matthias Einig
Microsoft MVP
CEO at Rencore
Hugh Wood
Lead Developer at Rencore
Our Guest
Your Host

4. JAVASCRIPT PERFORMANCE

5. JAVASCRIPT PERFORMANCE
LOOP
REFERENCE
DOM

6. LOOP PERFORMANCE
https://jsperf.com/fastest-array-loops-in-javascript/515

7. LOOP PERFORMANCE

8. REFERENCE PERFORMANCE
https://jsperf.com/object-reference-performance-tests

9. REFERENCE PERFORMANCE
dcba nume
Object
toString()
valueOf()
…
Number

10. TYPESCRIPT PERFORMANCE

11. TYPESCRIPT PERFORMANCE

12. TYPESCRIPT PERFORMANCE

13. TYPESCRIPT PERFORMANCE

14. TYPESCRIPT PERFORMANCE

15. MEMORY PERFORMANCE
- 1 0 2 1 3 2 4 3 -
Data Data Data Data Data
Data Data Data Data Data
0 1 2 3 4

16. MEMORY PERFORMANCE
- 1
0 2
1 3
2 4 3 5
Data
Data
Data
Data Data
4 6
Data
6 -
Data

17. MEMORY PERFORMANCE

18. MEMORY PERFORMANCE

19. MEMORY PERFORMANCE

20. LOOP PERFORMANCE
https://jsperf.com/fastest-array-loops-in-javascript/515

21. MEMORY PERFORMANCE
• Create empty arrays much larger than required
• Use the correct storage type Object vs Array
• Don’t worry about optimising Arrays

22. DOM PERFORMANCE
• Insert, remove or update an element in the DOM
• Modify content on the page, e.g. the text in an input box
• Move a DOM element
• Animate a DOM element
• Take measurements of an element such as offsetHeight or Use
getComputedStyle
• Change a CSS style
• Change the className of an element
• Add or remove a stylesheet
• Resize the window
• Scroll
[cite:temp.blogname]

23. DOM PERFORMANCE
HANDLEBARS REACT
Render
Template
Update Virtual
DOM
Compiled
HTML output
for use with
another library
Differential
update occurs

24. THREADED PERFORMANCE
https://jsperf.com/webworker-vs-single-thread/7

25. INFORMATION SECURITY

26. INFORMATION SECURITY

27. INFORMATION SECURITY
oWasp XSS Cheat Sheet

28. SYSTEM SECURITY

29. CDN SECURITY
A CDN is a direct trade-off for to gain performance by losing security
Microsoft Guidance on CDNs for Office
https://aka.ms/o365cdns

30. SYSTEM SECURITY
https://www.researchgate.net/figure/221632001_fig1_Fig-1-Content-Delivery-Network

31. MALICIOUS MODULES
rimrafall > rm –rf /*
Any 3rd party CDN
“You are responsible for what you require.”

32. CODE DEFECTS

33. CODE DEFECTS
END USER SATISFACTION
USABILITY
BREACHES
MONEY

34. DATA BREACH
> 23%
£3.11 Million

35. THEEND

36. Questions & Answers
Feel free to post your questions in the Q&A section

37. Advanced Security Management
within Office 365
July 20th, 2017, 16:00 PM CEST
Guest Speaker: Liam Cleary, Microsoft MVP
and Solution Architect for Protiviti

38. Thank you for attending!
The webinar recording will be sent to you later today.