Обновление 6.1.8. Объединение Javascript и CSS-файлов для ускорения загрузки.

Типовая страница сайта использует множество различных CSS и Javascript файлов, все эти файлы подгружаются параллельно со страницей и на загрузку каждого из них используется отдельное обращение к серверу, требующее времени. В итоге время загрузки страницы значительно возрастает.

С обновлением 6.1.8 в модуле «Компрессия» появились функции объединения всех используемых CSS и JS-файлов в один с возможностью минимизации и сжатия.

Объединение и минимизация CSS файлов

В макете сайта все дополнительные CSS-файлы добавляются с использованием метода Core_Page::instance()->css() и показываются с использованием метода showCss(), например:

<?php
Core_Page::instance()
	->css('/hostcmsfiles/jquery/lightbox/css/jquery.lightbox.css')
	->css('/hostcmsfiles/jquery/slider/jquery-ui.css')
	->showCss();
?>

Объединение и минимизация Javascript файлов

В макете сайта все Javascript-файлы добавляются с использованием метода Core_Page::instance()->js() и показываются с использованием метода showJs(), например:

<?php
Core_Page::instance()
	// jQuery
	->js('/hostcmsfiles/jquery/jquery.min.js')
	// Validate
	->js('/hostcmsfiles/jquery/jquery.validate.min.js')
	// LightBox
	->js('/hostcmsfiles/jquery/lightbox/js/jquery.lightbox.js')
	// HostCMS
	->js('/templates/template1/hostcms.js')
	->js('/hostcmsfiles/main.js')
	// BBcode
	->js('/hostcmsfiles/jquery/bbedit/jquery.bbedit.js')
	// Stars
	->js('/hostcmsfiles/jquery/stars/jquery.ui.core.min.js')
	->js('/hostcmsfiles/jquery/stars/jquery.ui.widget.min.js')
	->js('/hostcmsfiles/jquery/stars/jquery.ui.stars.js')
	->js('/hostcmsfiles/jquery/slider/jquery-ui.min.js')
	->showJs();
?>

Сжатие передаваемых CSS и Javascript файлов

Проверьте наличие следующих блоков в корневом файле. htaccess

<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/x-icon "access plus 1 week"
ExpiresByType image/gif "access plus 1 week"
ExpiresByType image/jpeg "access plus 1 week"
ExpiresByType image/png "access plus 1 week"
ExpiresByType text/css "access plus 1 week"
ExpiresByType text/javascript "access plus 1 week"
ExpiresByType application/x-javascript "access plus 1 week"
</IfModule>

# Apache 2.2
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/css text/javascript application/javascript application/x-javascript
<IfModule mod_setenvif.c>
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
</IfModule>
</IfModule>

# Apache 1.3, 2.0
<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(css|js)$
mod_gzip_item_include mime ^application/javascript$
mod_gzip_item_include mime ^application/x-javascript$
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>

Модуль «Компрессия» доступен в редакциях «Корпорация», «Бизнес» и «Малый бизнес».

28.01.2015