- From: Xiaocheng Hu via GitHub <sysbot+gh@w3.org>
- Date: Fri, 17 Jun 2022 01:14:31 +0000
- To: public-css-archive@w3.org
Font Loading API polyfill actually has a worse loading performance, which is something I missed in my previous comment.
For example:
```html
<link rel=stylesheet href="https://3p-fonts.com/cool-font.css">
<script>
document.documentElement.display = 'none';
Promise.race([
document.fonts.load('20px cool-font'),
setTimeoutAsPromise(1500), // in case connection is bad
]).then(() => document.documentElement.style.display = '');
</script>
<style>body { font-family: cool-font; }</style>
```
Then we need to wait until the font stylesheet is fully loaded and parsed to start loading the web font. This can be much slower than my proposal, which can use a preload scanner to start loading the font much earlier.
The polyfill can be improved if we also preload the font in the main document, in which case it will be as fast as my proposal. However, this isn't possible if the font URL is managed by a 3rd party provider, which is a major use case I'd like to support.
--
GitHub Notification of comment by xiaochengh
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7271#issuecomment-1158367360 using your GitHub account
--
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Friday, 17 June 2022 01:14:33 UTC