@dmgrtech I’m glad the plugin has been helpful! Hopefully, it will be at least as useful in the long term.
1) How is this file created? Was it created from the minified and combined CSS & JS files?
This type of file is generated whenever combine CSS/JS feature is enabled (whether the content inside them is minify or altered in any way). Notice the prefix of the file. It’s either “head-” (for render-blocking CSS/JS within the HEAD section of the website) or “body-” (for CSS/JS loaded within the BODY which is usually non-render-blocking). As the files were loaded in their initial location for a reason, Asset CleanUp preserve their location for maximum performance and compatibility. It never takes a non-render blocking CSS/JS and makes it render-blocking or vice-versa.
2) According to GT Metrix, it has a receiving time of 488.1 MS and a waiting time of 296.9 MS. Does this have an impact on my loading speed? If so, how can I improve on this.
If the file is render-blocking (CSS within the HEAD and JS loaded without any async/defer attributes), then all its contents have to be download before the page renders, so it does affect the first content paint. To reduce that timing, the most common solution is to reduce the size of the file so the browser will download it faster. This is usually done by either moving JS files to the BODY and defer them (if you have the Pro version, you can do that) or unload more useless CSS/JS that is not needed, thus generating a new and smaller combine CSS/JS file resulted from the remaining loaded assets.
3) This is just a bonus question, feel free not to answer, but after following several online guides on how to improve my loading speed, I think I’ve hit a dead end on how to keep optimizing the speed. Based on my waterfall chart on GT Metrix, is there anything else that I can do to optimize my site?
I’ve checked the score of your website via https://developers.google.com/speed/pagespeed/insights/ on both mobile and desktop view and the score for render-blocking resources can be improved as there are CSS/JS files that can likely be unloaded. I’ve noticed the following ones that you could check if they are needed on the homepage or other pages where there are no popups used:
- /wp-content/themes/saasland/assets/vendors/magnify-pop/jquery.magnific-popup.min.js?ver=1.1.0
- /wp-content/themes/saasland/assets/vendors/magnify-pop/magnific-popup.min.css?ver=5.3.2
There are other ones that, when unloaded, the homepage is looking the same. Perhaps they are not needed. You can unload them as a test.
- /wp-content/plugins/elementor/assets/lib/eicons/css/elementor-icons.min.css?ver=5.6.2
- /wp-content/plugins/elementor/assets/lib/font-awesome/css/fontawesome.min.css?ver=5.12.0
- /wp-content/plugins/elementor/assets/lib/font-awesome/css/brands.min.css?ver=5.12.0
By unloading useless CSS/JS, you will not only improve “Eliminate render-blocking resources” score, but also the “Remove unused CSS” one which is showing in red font when you check the score in mobile view. Just a reminder to be careful not to unload what you really need. It’s a trial and error thing sometimes, but in the end it’s well worth it if you want maximum results.
