Rise of the JAMstack
2 likes1,146 views
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.
Rise of the JAMstack
- 1. Rise of the JAMstack FITC spotlight 2019
- 2. Who am I? Bhavana Srinivas Sales Engineer, Netlify Previously at PubNub
- 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
- 23. Ingredients for the JAM ● Static Sites ● Static Site Generators ● Headless CMS ● Hosting providers ● APIs ● Serverless
- 28. Gatsby Showcase
- 29. Headless CMS
- 31. Dynamism: A for APIs
- 32. JAM-packed
- 33. Smashing Magazine : FROM
- 34. Smashing Magazine : TO
- 36. What’s your JAM?
- 37. Sweet JAMs “We need modern web tools to attract talented engineers”