Referenced at @hugoconf today:
https://blog.cloudflare.com/new-dev-docs/
Cloudflare (in 2022) migrated from Gatsby to Hugo to work around almost hour-long build times (for a project with 1600 markdown files).
It makes me think of the Jamstack pivot to include on-request rendering models that sacrificed the benefits of SSG to solve problems introduced by slow build tooling. In this case, Cloudflare swapped back to Hugo rather than over-complicate their architecture.
(reminded of https://www.zachleat.com/web/build-benchmark/ too
@zachleat Have you ever read the post of how the Ikea site it built?
40mn static pages assembled at the CDN https://medium.com/flat-pack-tech/history-of-ikea-com-static-files-and-microfrontends-6def9d7c4285
@andydavies Edge Side Includes!
@zachleat I’ve always thought ESI was underused
@andydavies I’m really curious what hosts support it!
@zachleat Akamai, Apache Traffic Server and Varnish are the three I know of
@andydavies @zachleat Nginx also supports SSI: https://nginx.org/en/docs/http/ngx_http_ssi_module.html
The old, old(, old?) BBC Web stack was built with ESI. Sounds similar to IKEA, we did the page assembly at the edge (albeit an on-prem edge back in those days)
@nhoizey @andydavies ah very cool! Looks like it’s based on Varnish too
@andydavies @zachleat There are also some of IKEA's web engineers on Mastodon. I just forgot the usernames.
@andydavies @zachleat I built quite a few pages on Meetup using ESI before I left (they probably killed it after reorg) there are some challenges with that, but it can do some page substitutes which was very handy and allowed us to use only a handful of templates + a bunch of static plain text content files that were mapped based on URL patterns.
@andydavies @zachleat Beautiful read, thanks for sharing. I am also in the process of rethinking our microfrontends based system and these experiences are golden. The only thing that left me a bit puzzled was the "no shared frameworks/libraries/css in the browser". I know it's hard to impl, but since they use a design system I believe that at least the CSS foundation should/could be shared
@caludio @andydavies @zachleat the problem is versioning. If teams are independent then there’s no guarantee that they’ll be updating packages at the same time. So we settled for a team-specific prefix system that allows for microfrontend-specific versions without clashes.
@caludio @andydavies @zachleat Of course, there is a little standardised CSS. The font stack is a one-time inheritance (and a custom property) and historically we’ve have some base reset styles, though increasingly the components each reset what they need. And with the onset of web components there’s more style scoping happening.
@robinwhittleton @andydavies @zachleat so the idea is that you (as one of the team), either decide to use the mainstream lib provided by the host framework, or you opt-out and use your own (say, React 17) using a prefix and some Webpack magic to handle that.
Do you use any framework (like piral or just webpack deferation...?)
@caludio @andydavies @zachleat no shared framework: each team is self-sufficient. There’s not a lot of magic either for the CSS team scoping either, just SASS or postcss, plus components that know how to prefix their own class naming conventions. Turns out that you can go a long way by picking the simplest solution most of the time.
@andydavies @zachleat fascinating read! I love this quote:
"In 2022, IKEA.com had over three billion sessions, which is around 100 sessions per second (roughly a low G on a guitar). "
@andydavies @zachleat now I want to hook a speaker up to Google Analytics and make a tone based on live traffic info
@gundersen @andydavies ahaha that would be really fun
@zachleat There’s a longer post about their approach https://gustafnk.github.io/microservice-websites/
And I think there’s a video of a conference talk somewhere too