2

I am not getting good performance when i audit my website with chroome lighthouse. I am getting few errors like - Remove unused CSS - Ensure Text Remain Visible during web front load - Minimize main threat work

Please anybody help me fixing these little things.

enter image description here enter image description here

7
  • Have you tried defer parsing CSS? – Raj Mohan R May 23 '19 at 9:45
  • no. How to do it ? – Ashar Riaz May 23 '19 at 11:48
  • did you figure out how to remove unused css? i'm also looking at pagespeed insights and want to removed some unused css like …merged/055fb59….min.css 509 KB – Mage Explorer Jun 18 '19 at 0:53
  • no. i am still looking for any solution asno one replied with any solution. Merging css is also necessary and magento is using same merged (big css file) on all pages. – Ashar Riaz Jun 19 '19 at 10:35
  • there are few option for css in this module modpagespeed.com/doc but i think it is not reducing css page by page. – Ashar Riaz Jun 19 '19 at 10:37
0

This is my solution to use for my page.

First, unmerge, unbundling, un-minify js and CSS

Next, turn on Coverage tab in Chrome DevTools https://developers.google.com/web/tools/chrome-devtools/coverage/ then check unused CSS and JS

or you can check each file one by one.

then you can remove a file unused, put code to the layout of the page you want to remove.

Ex: I will remove some file in the homepage so I put to cms_index_index.xml

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <remove src="js/bundle/bundle0.js"/>
        <remove src="css/bootstrap-magento.css"/>
    </head>
</page>

Hope this solution will solve your issue.

2
  • This is not working specifically to remove the JS - do you have any other solutions ? – Manthan Dave Dec 31 '19 at 13:51
  • if its JS file, you can use my solution above, if its JS from requirejs-config.js, you need find it in require where JS call and remove it EX: <script type="text/javascript"> require(['jquery','masonry','jquery/ui','domReady!'], function($,Masonry) { I see i don't want masonry, i will remove it. <script type="text/javascript"> require(['jquery','jquery/ui','domReady!'], function($) { Done. JS will not call in your page – Init Jan 6 '20 at 6:54

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.