gitterdoc/critical

Laravel provider that will extract critical CSS.

1.0.0 2018-07-20 10:33 UTC

This package is not auto-updated.

Last update: 2024-10-13 06:15:45 UTC


README

This package will resolve needed styles and pack it to the header. The rest of additional styles will be appended to the body and will be loaded after the page is ready. Warranty for google Pagespeed up to 100% and compatible with Bootstrap!

google PageSpeed: Desktop google PageSpeed: Mobile

πŸ“š Installation

Go to your root directory of your laravel project and install the package with composer:

$ composer require gitterdoc/critical

And add the configuration's file to your laravel instance:

$ php artisan vendor:publish --provider="gitterdoc\Critical\Install"

πŸ’‘ Usage

Go into your Blade template and replace your Stylesheets and add the same to the end of the body by expecting the second parameter!

<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}">
    <head>
        <!-- OLD -->
        <!--<link href="{{ asset('css/app.css') }}" rel="stylesheet" />-->

        <!-- To your header -->
        {{ critical('css/app.css', true) }}

        <!-- //… -->
    </head>
    <body>
        <!-- //… -->

        <!-- To your footer -->
        {{ critical('css/app.css', false) }}
    </body>
</html>

πŸ”¨ API

{{ critical($file, $type) }}

This method will handle your stylesheets.

πŸ”§ Settings

You can change the settings on the config/critical.php file.

πŸ”₯ Support us!

I'm a excellent and professional web- & software developer but i don't work anymore in these branche. I spend some free time to create awesome content. Support me by liking my repositorys 😍 or spend me a coffee β˜•!