Меню ↓

Ссылки по теме

WEBO (стал платный)

GTmetrics

CSS Оптимизатор

JS Оптимизатор

Ускоряем загрузку сайта

Итак, вы сделали сайт..  замечательно! ..но заметили что навешав на него различные UI библиотеки (jQuery и т.д.) вся эта красота начинает тупить и долго грузиться? :)

 

Не удивительно.. ведь чтобы со всеми этими наворотами сайт прогрузился в браузере он (браузер) делает туеву-хучу GET запросов серверу. Сегодня все нормальные браузеры поддерживают серверные gzip архивы, например html-страница с контентом, стилями и графикой весит 16 кб, а если сервер её сожмет gzip'ом - то она будет весить уже приблизительно 4 кб! Есть разница? :)

 

Опустим бла бла бла и сразу к делу.

 

1. Вы уже оптимизировали css, js, png|gif|jpg (если нет то бегом сюда - www.duris.ru или на аналогичный сервис)

2. На вашем сервере должен быть включен модуль mod_gzip.c

3. Добавляем в index.php всего одну сроку (в начало кода!)

<?PHP
ob_start( 'ob_gzhandler' ); //gzip


4. Но лучше и проще, это - открываем .htaccess и добавляем в него такой код:

<ifModule mod_expires.c>
    ExpiresActive On
    ExpiresDefault "access plus 3600 seconds"
    ExpiresByType image/gif "access plus 2592000 seconds"
    ExpiresByType image/jpeg "access plus 2592000 seconds"
    ExpiresByType image/png "access plus 2592000 seconds"
    ExpiresByType text/css "access plus 604800 seconds"
    ExpiresByType text/javascript "access plus 604800 seconds"
    ExpiresByType application/x-javascript "access plus 604800 seconds"
</ifModule>

<ifModule mod_headers.c>
    <filesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|swf)$">
        Header set Cache-Control "max-age=2592000, public"
    </filesMatch>
    <filesMatch ".(css|js)$">
        Header set Cache-Control "max-age=604800, public"
    </filesMatch>
    <filesMatch ".(html|txt)$">
        Header set Cache-Control "max-age=172800, public, must-revalidate"
    </filesMatch>
</ifModule>

<ifModule mod_headers.c>
    <filesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
        Header unset ETag
        FileETag None
    </filesMatch>
</ifModule>

<IfModule mod_deflate.c>
    <FilesMatch ".(css|js|x?html?|php|xml)$">
        SetOutputFilter DEFLATE
    </FilesMatch>
</IfModule>

<ifModule mod_gzip.c>
    mod_gzip_on Yes
    mod_gzip_dechunk Yes
    mod_gzip_item_include file .(css|js|x?html?|php|xml)$
    mod_gzip_item_include handler ^cgi-script$
    mod_gzip_item_include mime ^text/.*
    mod_gzip_item_include mime ^application/x-javascript.*
    mod_gzip_item_exclude mime ^image/.*
    mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>

 

4. Проверяем серверные заголовки в панели GTmetrix и скачем от радости! :)