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

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.

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

JAVASCRIPT PERFORMANCE

JAVASCRIPT PERFORMANCE
LOOP
REFERENCE
DOM

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

LOOP PERFORMANCE

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

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

TYPESCRIPT PERFORMANCE

TYPESCRIPT PERFORMANCE

TYPESCRIPT PERFORMANCE

TYPESCRIPT PERFORMANCE

TYPESCRIPT PERFORMANCE

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

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

MEMORY PERFORMANCE

MEMORY PERFORMANCE

MEMORY PERFORMANCE

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

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

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]

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

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

INFORMATION SECURITY

INFORMATION SECURITY

INFORMATION SECURITY
oWasp XSS Cheat Sheet

SYSTEM SECURITY

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

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

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

CODE DEFECTS

CODE DEFECTS
END USER SATISFACTION
USABILITY
BREACHES
MONEY

DATA BREACH
> 23%
£3.11 Million

THEEND

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

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

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