jandc/critical-css

Package wrapper and twig postprocessor class which uses the 'css from html extractor' library and twigwrapper to inject a document's head with critical css

Critical CSS

PHP library for generating critical CSS., _(*1)

, _(*2)

Features

• PHP only, no Node.js required.
• Automatically generated for each page
• Manual control through {% fold %}{% endfold %} tags
• Dynamically resolves CSS used on each page

Site(s) using Critical CSS

• https://www.farmaline.be/apotheek/

Installation

composer require jandc/critical-css, _(*3)

Register the twig extension and create a wrapper instance with the critical CSS processor

 use TwigWrapper\TwigWrapper;
 use CriticalCssProcessor\CriticalCssProcessor;

 $twigEnvironment->addExtension(new CSSFromHTMLExtractor\Twig\Extension());
 $twigWrapper = new TwigWrapper($twigEnvironment, [new CriticalCssProcessor()]);
 ```
##### Mark the regions of your templates with the provided blocks
```twig
{% fold %}



    ...
    


{% endfold %}

Render your pages, using the twigwrapper

php $twigWrapper->render('@templates/my/template.twig', ['foo'=>'bar']);, _(*4)

Available implementations

• Silex

If you have your own implementation, please send a pull request to add it to this list., _(*5)