I have a multi-author site, envolving 300+ writers. I provide them options to write their blogs in 25 Font Families. They can choose as many as they want in their post.

But to accomodate those 25 Google Fonts, I need a lot of CSS. I know that the font itself is downloaded by user agent, only if it is being used somewhere in HTML elements, but still the css required to just have those 25 fonts itself is really heavy too.

The stylesheet to add the fonts as provided by google even after minification is 180KB. You can check it at https://milyin.com/WPSE.css

180Kb can do lot of harm to performance for a site with cheap hosting like mine.

My Question is that is their any faster way to load the Google Fonts, such that the file isn't that big.

Or maybe a JS lib that can automatically load font whenever it finds it in site code.

Or some other approach..

The goal is to keep the site fast, while still allowing Authors to choose from 25 fonts.

Just so you know, when I enqueued the file, and waited for cache to rebuild and then checked my Google PSI, I saw over 15 points lost as an average, and page size increased significantly, now I stopped the enqueue till I find solution.

Note: As such if author doesn't use any font, then the entire page defaults to Locally Hosted Poppins font, which doesn't impact performance.