https://github.com/gitterdoc/critical
:package: A Laravel package for generating and using inline critical-path CSS to use huge stylesheets for an above the fold loading.
https://github.com/gitterdoc/critical
above-the-fold critical-css critical-path-css critical-path-styles laravel laravel-package style
Last synced: 5 months ago
JSON representation
:package: A Laravel package for generating and using inline critical-path CSS to use huge stylesheets for an above the fold loading.
- Host: GitHub
- URL: https://github.com/gitterdoc/critical
- Owner: gitterdoc
- License: mit
- Created: 2018-07-19T11:20:59.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2018-07-21T00:46:35.000Z (almost 8 years ago)
- Last Synced: 2025-09-19T08:09:05.700Z (9 months ago)
- Topics: above-the-fold, critical-css, critical-path-css, critical-path-styles, laravel, laravel-package, style
- Language: PHP
- Homepage: https://gitterdoc.com
- Size: 27.3 KB
- Stars: 2
- Watchers: 0
- Forks: 1
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
## :boom: How it work's?
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`!
 
## :books: Installation
Go to your root directory of your laravel project and install the package with composer:
```shell
$ composer require gitterdoc/critical
```
And add the configuration's file to your laravel instance:
```shell
$ php artisan vendor:publish --provider="gitterdoc\Critical\Install"
```
## :bulb: 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!
```html
{{ critical('css/app.css', true) }}
{{ critical('css/app.css', false) }}
```
## :hammer: API
### `{{ critical($file, $type) }}`
This method will handle your stylesheets.
| **Parameter** | **Type** | **Default** | **Description** |
|---------------|-----------|--------------|-------------------------------------------------------------------------------------|
| $file | `String` | **required** | The stylesheet, that will be handled |
| $type | `boolean` | `true` | It's an include for your header or your footer? (header = `true`, footer = `false`) |
## :wrench: Settings
You can change the settings on the `config/critical.php` file.
| | **Name** | **Type** | **Default** | **env** | **Description** |
|--------------------|---------------|-----------|-------------|--------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------|
| :white_check_mark: | **enabled** | `boolean` | `true` | `CRITICAL_ENABLED` | Enable or disable the Critical module |
| :memo: | **onlyprint** | `boolean` | `true` | `CRITICAL_ONLY_PRINT` | Describes the handling - `true` - Only stylesheets will be printed, no more handling - `false` - Each site request will be parsed to find specific styles |
| :zap: | **caching** | `Array` | | | |
| | **enabled** | `boolean` | `true` | `CRITICAL_CACHE_ENABLED` | Enable or disable the caching |
| | **time** | `integer` | `3600` | `CRITICAL_CACHE_TIME` | Set the maximal cache lifetime of the cache in seconds (3600 = 1 hr) |
| :scroll: | **noscript** | `boolean` | `true` | `CRITICAL_NOSCRIPT` | Adding original stylesheet as `` for browsers, that don't have JavaScript enabled | |
## :fire: 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** :heart_eyes: or spend me a coffee :coffee:!
----
https://packagist.org/packages/gitterdoc/critical
https://gitterdoc.com