Dev Tips

DevTools: Improving the performance of Soylent.com with local overrides and font display

💡 Would you like more free lessons? Please subscribe on YouTube to show your support.

This free 11 minute Modern DevTools video covers the local overrides feature of DevTools.

Watch the video here

Soylent.com loads a custom webfont for some of their text. Before the webfont is ready, the browser hides the text to avoid the potentially jarring UX when switching from a fallback font -> to the webfont. This video explores an approach of improving this experience using DevTools local overrides.

You can also view the text alternative at ModernDevTools.com/lessons/13.

If you have any troubles viewing this animated gif, check out: umaar.com/dev-tips/165-local-overrides-font-display

Sponsor
Project management is better when it's visual: monday.com is the next generation of visual tools, built specifically for developers. See what everyone on your team is working on in a single glance.