Hi,
@imports are evil.
https://varvy.com/pagespeed/avoid-css-import.html
https://www.stevesouders.com/blog/2009/04/09/dont-use-import/
—
Remove the @import from the css and enqueue it properly to wordpress, by adding something like this to your child theme functions.php file (theme directory):
# enqueue fonts properly
function fvmabcde_fix_enqueues(){
wp_enqueue_style('google-fonts-poppins', 'https://fonts.googleapis.com/css?family=Poppins:700', array(), null, 'all' );
}
add_action( 'wp_enqueue_scripts', 'fvmabcde_fix_enqueues');
—
By doing this, FVM will pick up those fonts properly, merge them with any other google fonts and if you select the “inline google fonts” option, it will avoid render blocking for those.
Thanks! Very helpful.
Can I ask you a question. I use WP Fastest Cache and was trying to get rid of the suggestions about combining css files, so I installed Fast Velocity Minify. If I have Fast Velocity Minify enabled I get a warning in the WP Fastest Cache that I should deactivate Fast Velocity Minify. I thought that I could combine them getting the best of it. Is Fast Velocity Minify plugin a full fledged cache plugin that should be used exclusively? I actually get slightly better pingdom results with WP Fastest Cache (some of the time).
Any suggestions?
You can / should use a cache plugin, but you have to disable their html, js and css minification options.
WPFC works fine with FVM, although I would recommend W3 Total Cache due to it having more features (object cache, redis, memcached, apc… support).
Just remember to purge the cache if you ever delete the cache on FVM, so that the cached pages don’t link to old fvm files (fvm will try to purge it but not all plugins work).
Again very helpful. Much oblige. Have a nice weekend! Will try it out in the morning.
Best regards
With W3 Total Cache, is there something to gain from Fast Velocity Minify? Should I disable W3 Total Cache minification of js and css and let Fast Velocity Minify handle it?
That depends. Overall, FVM does a much better job at merging and minifying and provides much better control over certain things, as compared to w3tc.
Your mileage may vary, so if your website is simple enough, without external google fonts or too many js and css files, it may be possible that w3tc works better.
I created this plugin because I wasn’t happy with any other plugins, so you got to try and see how it works for your site.
I recommend using w3tc alone and test.
Then disable minification and merging of css, js and html on w3tc and install fvm.
After configuring fvm, you should end up with a better score, depending on the options you select and your theme.
Note also that by default, FVM is not tuned for best performance (only safe optimizations), so you need to understand what the options do and what they mean.
There are some faqs, https://ww.wp.xz.cn/plugins/fast-velocity-minify/faq/
but this plugin is a bit geared to advanced users, that understand how merging js files or deferrings them, can actually break the site layout (and how to fix).