Not enough discussion here of the parts under "Our Optimization Strategies", which was the most interesting to me. Assorted reactions:
> We found that react-icons had an issue that lead to everything being imported. This meant that we were including every single react-icon in our package whether we need it or not.
Kudos to the Linen team for proactively finding this - I have a feeling tons of projects blindly trust that tree-shaking their dependencies will "just work" even though for many libraries it won't!
> We also noticed that we were only using AWS client for s3 upload on the client side and it was taking up significantly more bundle size we need so we replaced the entire client side package with a 2 api calls to the AWS api.
For such a minimal use case, this feels like a logical choice even if it's slightly more work to implement.
> We ended up moving the code highlight code to a backend api that would cache the results.
Love seeing websites make smart choices about which work to handle in the server versus the client.
With icons, I've stopped using icon libraries a while back and now import just the SVG code that I need. I'm a big fan of Hero Icons[1] and they offer a way to quickly copy JSX or SVG code to the clipboard to faciliate this workflow.