Расположение CSS файлов в конце body в Yii 2

Недавно решил проверить свой сайт в PageSpeed Insights. Он порекомендовал мне перенести вызов всех стилей и JavaScript файлов в перед закрывающим тегом body. С JavaScript не возникло никаких проблем, а вот с стилями оказалось посложней.

Автор . Дата: 27.02.2017

Недавно решил проверить свой сайт в PageSpeed Insights. Он порекомендовал мне перенести вызов всех стилей и JavaScript файлов в перед закрывающим тегом body. С JavaScript не возникло никаких проблем, а вот с стилями оказалось посложней. Как оказалось, Yii не поддерживает по умолчанию указание местоположение кода для подгрузки стилей, поэтому я написал небольшое расширение, которое добавляет возможность так же для стилей указывать их местоположение.

Для того, чтобы установить расширение выполните команду:

php composer.phar require --prefer-dist lan143/yii2-advanced-view "*"

или добавьте в composer.json:

"lan143/yii2-advanced-view": "*"

После этого добавьте в конфиг web.php в раздел компонентов подгрузку нового компонента View:

return [
    'components' => [
        'view' => [
            'class' => 'lan143\advanced_view\View',
        ],
    ],
]

Теперь вы можете указывать расположение для вызова CSS файлов так же как и для JS. Например в файле ассетов:

class AppAsset extends AssetBundle
{
    public $css = [
        'css/site.css'
    ];

    public $js = [
        'js/site.js'
    ];

    public $depends = [
        'yii\web\YiiAsset',
        'yii\bootstrap\BootstrapAsset',
    ];

    public $cssOptions = [
        'position' => \yii\web\View::POS_END
    ];
}

или в конфиге web.php при настройке assetManager для встроенных ассетов, например BootstrapAsset:

$config = [
    'components' => [
        'assetManager' => [
            'bundles' => [
                'yii\bootstrap\BootstrapAsset' => [
                    'cssOptions' => [
                        'position' => \yii\web\View::POS_END
                    ],
                ],
            ],
        ],
    ],
];

либо при вызове функции registerCssFile:

$this->registerCssFile('css/style.css', [ 'position' => \yii\web\View::POS_END ]);

 


comments powered by HyperComments