The document discusses the rise of the JAMstack, which stands for JavaScript, APIs, and Markup. It describes how the JAMstack architecture uses static sites, content managed by headless CMSes, and APIs to provide performance and security benefits compared to traditional monolithic frameworks. Key advantages of the JAMstack include faster load times, higher security since there are fewer moving parts, and easier scalability using CDNs. The document outlines the various ingredients that make up the JAMstack like static site generators, hosting providers, and serverless functions, and provides examples of how popular sites have benefited from adopting this architecture.

1. Rise of the JAMstack
FITC spotlight 2019

2. Who am I?
Bhavana Srinivas
Sales Engineer, Netlify
Previously at PubNub

3. Why the JAMstack?

6. Trip down memory lane…
Unix Model
1970-1997 ish

7. Legacy Web

8. Today - return of the static
From client → server to client “services”
Main application directly on a CDN

9. Why is this JAM any better?

10. Dynamic vs Static sites
Monolithic sites
(WP, Drupal etc.)
JAMstack sites

11. Performance!!

12. Personal blog on WP

13. Personal blog “on” JAMstack

14. TTFB stats from around the world
Blog on WP
Blog “on” JAMstack

15. Desktop vs Mobile - monolithic

16. Desktop vs Mobile - JAMstack

17. In the real world:
1. Google found that a 500ms difference in load time impacted revenue by a full 20%.
2. At Amazon, every 100 ms increase in load times decreased sales with 1%.
3. Walmart decided to attempt to increase the competitive nature of their retail site, during their
research they discovered:
a. For every 1 second of improvement they experiences up to a 2% increase in conversions
b. For every 100ms of improvement, they grew incremental revenue by up to 1%

18. Security!!

19. Security Pickle
Monoliths
More moving parts → more attack vectors
● Plugins
● Web server
● App server
● Databases
JAM sites
More static pages → less surface area for attacks
● Static files
● No servers
● Host on CDN
● APIs

20. Scalability

21. CDNs

22. Site Availability

23. Ingredients for the
JAM
● Static Sites
● Static Site Generators
● Headless CMS
● Hosting providers
● APIs
● Serverless

24. Static Site Generators

25. Static Site Generators

26. staticgen.com
Gatsby Starters

28. Gatsby Showcase

29. Headless CMS

30. Deployment/Hosting

31. Dynamism: A for APIs

32. JAM-packed

33. Smashing Magazine : FROM

34. Smashing Magazine : TO

35. 800ms→80ms first load

36. What’s your JAM?

37. Sweet JAMs
“We need modern web tools to
attract talented engineers”

38. Awesome
Resources
https://github.com/automata/awesome-jamstack