Reduce unused CSS？

[sgalcheung]

I used this font in my repo and Lighthouse Diagnostics' “Reduce unused CSS - Potential savings of 34 KiB”

According to the coverage show, this is the main reason that it is using the font

In my project, I used the font this way import "noto-sans-sc/noto_sans_sc_regular/css.css";

and is this the right way?

[jfcherng]

In my opinion, unless you can know exact which characters/words you will use beforehand, there is no way to reduce the CSS you include.

In my project, I used the font this way import "noto-sans-sc/noto_sans_sc_regular/css.css"; and is this the right way?

yes

[sgalcheung]

Do you mean 'Font Subset'? but Google Fonts is working to optimize the font-slicing system. Google provide fonts, such as Noto-Sans-SC not slicing?

According to the article, I think this is the solution they adopted to support CJK fonts.

参考 Google Fonts 加持的高级中文字体子集化实现

[jfcherng]

Do you mean 'Font Subset'? but Google Fonts is working to optimize the font-slicing system. Google provide fonts, such as Noto-Sans-SC not slicing?

The one you used here is sliced. As you can see in https://github.com/jfcherng/Noto-Sans-SC-CSS/blob/master/noto_sans_sc_regular/css.css

However, it results in a big CSS file (100KB), which your tool complains. But obviously it's dramatically smaller than loading a full set Chinese font at once.

What I said is that there are many slices as you can see in https://github.com/jfcherng/Noto-Sans-SC-CSS/tree/master/noto_sans_sc_regular. Unless you know certain slices won't be used in your project beforehand, otherwise there is no way to make the CSS (just a little bit) smaller by removing unused slices.

[sgalcheung]

Thank you explain this, Google already sliced font, but how to use depends on the user. and can we offer a subsetted font, like MiSans (subsetted) fonts?

[jfcherng]

Not sure what you mean, it's SC already here.

[sgalcheung]

Oh, I think I'm wrong, Xiaomi office does not SC of MiSans font, so MiSans (subsetted) fonts did.

[jfcherng]

Assuming issue resolved.