konstantinschuette

Seems like the font is not loaded early enough. Because wrapping the GSAP code with ` document.fonts.ready.then(() => {[...]}) ` seems to do the trick. But now on the first time visiting the page, the text flashes, before the font is loaded. Is there any way to prefetch the font, so that the first rendering is always happening with that font? I looked up all the possible `rel` attributes for the HTML link tag, but none seem to fit this (https://3perf.com/blog/link-rels/)

Demo: https://codesandbox.io/s/youthful-glitter-wrwi0l Make sure your browser is at least 635px wide, so that it has no horizontal scrollbars. This how it looks, when you open it on the first time or in a incognito tab (not displayed correctly): After a browser refresh in Codesandbox, it will be displayed correctly: What could cause this behaviour?

Seems like the article is broken at some parts. Using chrome.