search

feat-agency / vite-plugin-webfont-dl

⚡ Webfont Download Vite Plugin - Make your Vite site load faster
MIT License
302 stars 11 forks source link

support subset parameter #14

Closed k2s closed 2 years ago

k2s commented 2 years ago

I have

    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Dosis:wght@400;600;700&family=Roboto:wght@400;500;700&display=swap&subset=latin,latin-ext" rel="stylesheet">

vite-plugin-webfont-dl injects into index.html also definition for other subsets like vietnamese, cyrillic-ext, etc.

Injected should be only definition for latin and latin-ext definitions.

Thank you.

0xb4lint commented 2 years ago

Hi @k2s!

The plugin supports any href="..." value.

If you check the CSS there are a lot of subsets in the response: https://fonts.googleapis.com/css2?family=Dosis:wght@400;600;700&family=Roboto:wght@400;500;700&display=swap&subset=latin,latin-ext

Somehow Google ignores the subset parameter in this case.

k2s commented 2 years ago

Seams that Google ignores https://stackoverflow.com/questions/42172042/google-chrome-ignores-google-font-subset if requested with browser that supports unicode-range.

If requested for example with curl it will download different CSS.

Current situation will not increase download size, but it will make asset folder size bigger than necessary.

0xb4lint commented 2 years ago

The plugin loads the CSS with Chrome/51.0.2704.103 User-Agent. This is a standard and stable method to get woff2 fonts.

I understand this results a more extensive set of downloaded fonts but at the end of the day, the users will benefit from the locally served fonts.