EMRETHEAVIATOR

I updated my website to 5.7.2. There is no problem with bbpress, buddypress and woocommerce. I like mesocolumn theme. I hope it will be kept updated.

Indeed the problem not resolved. Just pagespeed does not show the issue when the pagespeed is above a certain value. I have to do font-display: swap; for the following files. Because my FCP (First Contentful Paint) is around 3 seconds although mobile page is loaded fast. And there is not any other serious caution on pagespeed.

example.com/wp-content/plugins/woocommerce/assets/fonts/star.woff

example.com/wp-content/plugins/woocommerce/assets/fonts/star.ttf

example.com/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.woff

example.com/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.ttf

example.com/wp-content/themes/mesocolumn/lib/scripts/font-awesome/fonts/fontawesome-webfont.woff2

example.com/wp-content/themes/mesocolumn/lib/scripts/font-awesome/fonts/fontawesome-webfont.woff

example.com/wp-content/themes/mesocolumn/lib/scripts/font-awesome/fonts/fontawesome-webfont.ttf

example.com/wp-content/themes/mesocolumn/lib/scripts/font-awesome/fonts/fontawesome-webfont.woff2

I have solved the problem. Let me explain for other mesocolumn users.

1) I managed to preload the fonts via fast velocity minify plugin.

2) I managed to prevent FOIT by adding css code. In order to add css code;

Go to font-awesome.css and font-awesome.min.css files. The path is themes > mesocolumn > lib > scripts > font-awesome > css.

Add font-display: swap; under @font-face

That is all. No more pagespeed caution for font preload and FOIT.

The only problem with my website is Flash of Invisible Text (FOIT) now. How can apply the second option in this document.

When “wp-content/plugins/woocommerce/assets/css/woocommerce-smallscreen.css” css file is exluded, w3 total cache is totally compatible with mesocolumn

Now I am using fast velocity minify and w3 total cache together. html, css and js minifications are performed by fast velocity minify. Other functions except for above are performed by w3 total cache. It is a good combination. Mobile page speed in speedtest is almost 90. The only problem is that I could not decrease FCP and FID less than 3 seconds permanently.

I cannot change the topic. But now I only need to Ensure text remains visible during webfont load. It is important for me because altough my mobile pagespeed score is 84 and desktop pagespeed score is 98, FCP and FID are still more than 3 seconds.

I minified js with non-blocking-async. I deleted adsense since it lowers pagespeed score dramatically. Now mobile pagespeed score is %84 and desktop is %98. Perfect.

I minified js with non-blocking-async. I deleted adsense since it lowers pagespeed score dramatically. Now mobile pagespeed score is %84 and desktop is %98. Perfect.

I have found the solution. In automatic mode, the plugin orders the files in the correct order. Only the woocommerce gallery disrupted due to css minify. I have solved the problem by excluding the following css file.

wp-content/plugins/woocommerce/assets/css/woocommerce-smallscreen.css

Thank you I will make exclusions.

Note: Auto css minify function of w3 total cache plugin causes woocommerce pages to display mobile version on all display sizes. There is no another issue with the plugin. I will try to solve the problem.

• This reply was modified 4 years, 7 months ago by EMRETHEAVIATOR.

Thank you very much @vmarko . I will try to add async/defer to the script tags. I have another issue. I need to exclude woocommerce css files. Because mobile version css is displayed on all screens after auto css minify. Maybe you can recommend a practical solution.

Is there anyone has the same problem like me ?

• This reply was modified 4 years, 7 months ago by EMRETHEAVIATOR.

I uploaded w3 total cache plugin. Its css and js minify functions help to make fewer http requests. Automatic minifying increases yslow and page speed scores.