Google Fonts loaded by Web Font Loader are loaded asynchronously and therefore hard to improve. After tweaking Super Stealth for CAOS, it was about time that OMGF received a premium companion to play with. Introducing: OMGF Pro.
What’s Web Font Loader?
Web Font Loader is a JavaScript library co-developed by Google and Typekit. It enables you to load Google Fonts asynchronously. I.e. it’s their attempt to optimize — the otherwise sluggish — Google Fonts.
Why does Web Font Loader need optimization?
About two weeks ago, Google introduced the latest addition of their speed measurement software — Lighthouse 6 — to PageSpeed Insights.
One of the highlights of Lighthouse 6 is Unused JS: a new reason to punish you optimization opportunity.
JavaScript Libraries and Unused JS
Web Font Loader’s webfont.js is a library, just like e.g. Google Analytics’ analytics.js is a library.
A library is a collection of code, making common tasks easier, e.g. implementing Google Fonts, adding Google Analytics, etc.
Web Font Loader doesn’t just support Google Fonts. It also supports Typekit among others.
And here’s the catch: to support all this, additional code is needed. Code that you’re not using, because you’re only using Google Fonts!
So, it’s…
Time to Dump webfont.js!
Google loves to contradict itself, and the latest addition to PageSpeed Insights is filled with joy contradictions. Unused JS being one of them.
Using some libraries can’t be avoided, like analytics.js. But webfont.js definitely is.
You could — of course — try to rewrite the entire webfont.js library to just support Google Fonts.
Don’t bother. It’s unreadable.
It’s much easier to upgrade your favorite WordPress plugin, wouldn’t you agree?
Assuming that your favorite plugin for WordPress is OMGF. If it’s isn’t. I’m hurt — a little.
Improve webfont.js Loading Time with OMGF Pro
OMGF Pro offers the easiest approach to remove webfont.js from your WordPress theme and replace its Google Fonts with locally hosted versions.
It functions as an add-on and helps OMGF to detect more fonts. OMGF Pro follows the same steps and logical approach you’re already used to, to Auto Detect your WordPress theme’s fonts.
This calls for a Celebration!
We’re expecting a daughter (edit: she was born July 9th!), we bought a house, Fast FW Press is boOming! And now, OMGF Pro is born.
Too much to celebrate!
That’s why you get 10% off on all my Premium WordPress plugins and any license using the coupon code AWESOME10 until we’ve moved into our new home, somewhere between October and December. (Edit: the move started October 13th!) That means you can get a license for as low as € 26,-!
Improve the loading times of Web Font Loader Google Fonts with OMGF Pro and increase your PageSpeed Insights performance score. What’re you waiting for? Get OMGF Pro now!
hello
Hi Danell! Welcome to my blog, son! 🙂
How are you?
Hi!
No, nothing is added to your header.php. 🙂 Everything is properly enqueued using WP’s built in functions. You’ll find the stylesheet in OMGF’s cache-folder, by default this is wp-content/uploads/omgf/fonts.css.
I was really fed of loading Google fonts because there was not proper way to do it easily but now after reading this guide, i will be able to easily improve web font load.
Thanks for sharing such a great guide.