Usually we treat static content as assets, non-dynamic parts of our applications, even though it is just another layer in caching.

1. Static is Just a Cache

2. Seva Zaikov
blog.bloomca.me
@blooomca
github.com/Bloomca

3. What is Static?
• Static blogs
• Landing pages
• Assets
• Maybe no DB involved
• Usually, means no dynamic behavior

4. Static is just a cache
Well, sort of.
And can appear in unexpected places.

5. Case Study:
US Elections

6. New York Times
• Elections bring enormous traffic, and everybody wants
to get relevant results quickly
• Their stack was Rails + MySQL + Varnish
• Instead of tuning cache, they went with flat files
• Used flat files to serve specific pages during elections
• Pages with fresh data were rebuilt every minute
https://open.blogs.nytimes.com/2010/12/20/using-flat-files-so-elections-dont-break-your-server

7. Case Study:
Netflix Landing Page

10. • Amazon found every 100ms of latency cost them
1% in sales.
• Google found an extra .5 seconds in search
page generation time dropped traffic by 20%
https://glinden.blogspot.com/2006/11/marissa-mayer-at-web-20.html

11. • TTI (time-to-interactive) is crucial for conversion
• React is used heavily in the company
• Many components exist as react components
• Landing page has not a lot of interactivity
• Later in the signup flow React & Redux is
fetched
https://news.ycombinator.com/item?id=15568305

12. Well, it is not static, is it?
Yes, but maybe you don’t need this amount
of interactivity.

13. Why to do Static?
• It is faster (no need to do server requests +
render results)
• Less load on your servers (might be crucial
during spikes + cost)
It is painful, isn’t it?

14. JS (pre)rendering
• This is different from server-side rendering!
• We render full page and serve it statically
• We can serve it as an html file or just update in
memory
• Dynamic parts are loaded later

15. Dynamic Parts
We replace any user-specific data with a loader, which will
be replaced after client-side code bootstraps

16. Why would you want
to do that?
• Promo page, but using your regular components
library
• Render static pages inside your app
• Render static parts immediately

17. Each Case is Unique
Let me tell you mine

19. Architecture
• Node.js app
• Blocks are “widgets”
• Each page has a configuration – layout with widgets
on it
• Widgets are rendered on the server, but they are
cached for 5 minutes
• RAM per instance with all cached templates ~50MB

21. Thanks!
Any questions?