Early Detection of Frontend Single Points of Failure and effectively fixing it.

1. spof-attack
@senthil_hi

2. spof-attack is scary

3. Frontend SPOF

4. Enemy #1
3rd Party JavaScript
a.k.a.

5. Enemy #1
3rd Party JavaScript
a.k.a.

6. Load them in a
Async & non-blocking pattern

7. Enemy #2
Application JavaScript

8. Load them towards the end

9. Enemy #3
@font-face

10. Enemy #3
@font-face

11. In-lining, Compress & Cache

12. Enemy #4
@font-face precede Script tag
*IE

13. Don’t do that 

14. Friends
webpagetest.org
SPOF-O-Matic Chrome plugin
Yslow Extension

15. Best Friend
SPOFCheck
Command Line Interface to detect SPOF

16. Best Friend
SPOFCheck
Command Line Interface to detect SPOF

17. > spofcheck www.techcrunch.com -p
spof: Analyzing http://www.techcrunch.com
spof: Processing external CSS resources
spof: Flushing the results
spof: There are 26 problems in http://www.techcrunch.com
1. ERROR: Possible SPOF attack due to 3rd party script - http://js.adsonar.com/js/adsonar.js
Severity: error
Entity: http://js.adsonar.com/js/adsonar.js
Score: 19
Fix: Always load 3rd party external scripts asyncronously in a non-blocking pattern
2. ERROR: Possible SPOF at….
SPOFCheck

18. http://senthilp.github.io/spofcheck/

19. Let’s make a SPOF FREE world!

20. Thank You