Question

i'm trying to remove some unnecessarily css and javascript that is included in the homepage. For example, the swatches.mini.css, blog-m.min.css, blog-custom.min.css, calendar.min.css doesn't seem to need to be loaded at homepage, etc. I would like to try to remove them in order to increase the pagespeed.

<meta name="robots" content="INDEX,FOLLOW" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0" />
<meta name="format-detection" content="telephone=no" />
<title>example® </title>
<link rel="stylesheet" type="text/css" media="all" href="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/mage/calendar.min.css" />
<link rel="stylesheet" type="text/css" media="all" href="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/css/styles-m.min.css" />
<link rel="stylesheet" type="text/css" media="all" href="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/css/exampleStyle.min.css" />
<link rel="stylesheet" type="text/css" media="all" href="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/Magefan_Blog/css/blog-m.min.css" />
<link rel="stylesheet" type="text/css" media="all" href="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/Magefan_Blog/css/blog-custom.min.css" />
<link rel="stylesheet" type="text/css" media="all" href="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/Magezon_Core/css/styles.min.css" />
<link rel="stylesheet" type="text/css" media="all" href="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/Magento_Swatches/css/swatches.min.css" />
<link rel="stylesheet" type="text/css" media="screen and (min-width: 768px)" href="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/css/styles-l.min.css" />
<link rel="stylesheet" type="text/css" media="print" href="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/css/print.min.css" />
<script type="af29dba34304251ada1879a6-text/javascript" src="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/requirejs/require.min.js"></script>
<script type="af29dba34304251ada1879a6-text/javascript" src="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/requirejs-min-resolver.min.js"></script>
<script type="af29dba34304251ada1879a6-text/javascript" src="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/mage/requirejs/mixins.min.js"></script>
<script type="af29dba34304251ada1879a6-text/javascript" src="https://www.example.com/pub/static/version1564705015/frontend/Infortis/ultimo/en_US/requirejs-config.min.js"></script>
<link rel="canonical" href="https://www.example.com" />
<link rel="icon" type="image/x-icon" href="https://www.example.com/pub/media/favicon/default/example_favicon.png" />
<link rel="shortcut icon" type="image/x-icon" href="https://www.example.com/pub/media/favicon/default/example_favicon.png" />
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
Was it helpful?

Solution

Create cms_index_index.xml at your theme layout folder.

Add remove code:

<?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="Magefan_Blog::css/blog-m.css"/>
        <remove src="Magefan_Blog::css/blog-custom.css"/>
        <remove src="Magefan_Blog::css/blog-m.css"/>
        <remove src="Magento_Swatches::css/swatches.css"/>      
    </head>
</page>

Source: https://devdocs.magento.com/guides/v2.2/frontend-dev-guide/layouts/xml-manage.html#layout_markup_css_remove

Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
scroll top