collab/module-additional-criticals

Magento 2 module which loads additional critical CSS files per specific layout handles

1.0.0 2024-08-13 11:52 UTC

Requires

• magento/framework: ~103.0.4

MIT

• Marcin Jędrzejewski

• PageSpeed
• magento
• magento2
• critical css
• cls optimization

README

The Collab_AdditionalCriticals module is a simple module that differentiates critical styles used across different areas of Your Magento app.

Configuration

Module does not have any configuration options. You just need to fulfill the requirements specified in prerequisites.

Pre-requisites

• dev/css/use_css_critical_path must be set to 1 in core_config_data or in config.php/etc.php
• category.css, simple-product.css and configarble-product.css along with critical.css must be present in app/design/frontend/<Vendor>/<Theme>/web/css/ directory. Those need to be generated by You or Your team using custom grunt tasks for example, this module does not provide any of those files.

How it works?

At specific layout handles module removes default critical CSS block filled with contents of critical.css file and creates new block with contents taken from previously prepared files.

Layout Handle	Loaded File	Comment
catalog_category_view	category.css	category.css should be generated against real category page on Magento app with dev/css/use_css_critical_path set to 0
catalog_product_view_type_simple	simple-product.css	simple-product.css should be generated against real simple product page on Magento app with dev/css/use_css_critical_path set to 0
catalog_product_view_type_configurable	configurable-product.css	configurable-product.css should be generated against real configurable product page on Magento app with dev/css/use_css_critical_path set to 0
default	critical.css	critical.css should be generated against CMS page on real Magento app with dev/css/use_css_critical_path set to 0

Why choose this extension over other solutions?

We don't believe in efficient modules which have tons of options - simple as that - modules which have multiple options, are prepared for many integrations always have some performance footprint for application. Having this in mind we are trying to provide simple, portable and independent modules which sometimes require some basic Magento 2 development skills.

Installation details

composer req collab/module-additional-criticals
bin/magento setup:upgrade