Разгоняем свой сайт

Рассмотрим несколько простых и парочку более сложных способов ускорения работы сайта и существенно сократим трафик между клиентом и сервером

Что для этого нужно:

1. Оптимизируем JS. Для этого есть сервисы: 1 - 2 - 3

2. Оптимизируем CSS. И для этого есть сервис - 1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - 9 - 10

После оптимизации JS и CSS мы ускорили наш сайт на 10-20%.

3. Включаем gzip.

Теперь самое простое и самое гениальное решение - серверным способом, а именно в htaccess запускаем следующее:сайт источник http://yapro.ru Sat Feb 13 2010 13:36:52 GMT+0300

<IfModule mod_gzip.c>
mod_gzip_on       Yes
mod_gzip_dechunk  Yes
mod_gzip_item_include file      \.(html?|xml|css|js|php|jpg|png|gif)$
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>

*xml - выделил т.к. у меня используется для хранения данных.

4. Если есть возможность и умение, выполните RAID-ускорение

5. Так же советую почитать рекомендации по ускорению и выполнить анализ сайта с помощью сервиса webo.in

Итог: после этих «танцев с бубном» скорость загрузки сайта должна увеличиться на 30-50%.

Для тех, кто желает понять и разобраться подробнее, продолжим с нескольких полезных советов сайта AskApache.com

Сжатие файлов стилей (.css) и JavaScript файлов (.js)

Если на вашем сервере установлен Apache 2, то просто добавьте следующие директивы в ваш файл .htaccess, а лучше в httpd.conf:

<FilesMatch "\.(js|css)$">
SetOutputFilter DEFLATE
</FilesMatch>

Директива SetOutputFilter DEFLATE добавляет модуль mod_deflate, который сжимает файлы, к выходным фильтрам, а блок FilesMatch ограничивает действие этого фильтра только файлами js и css. Все просто и легко. Теперь смотрим на результат. Для этого пользователям FireFox рекомендую воспользоваться связкой FireBug + YSlow.

Разгоняем свой сайт

Результат говорит сам за себя. Также, как вариант, можно вручную сжать нужные файлы и хранить на сервере уже в сжатом виде. Это снизит нагрузку на сервер, но в случае внесения изменений, придется вновь пережимать файлы. Теперь про поддержку сжатых файлов браузерами. Для этого обратимся на сайт http-compression.com. Ситуация такова:

  • Microsoft Internet Explorer. Поддерживает сжатие с версии 4.0.
  • Mozilla Firefox. Сжатие поддерживается всеми версиями. (Еще один повод пользоваться огненой лисой).
  • Netscape Navigator. Поддержка сжатия началась с версии 4.06, но с серьезными ошибками, которые были устранены с версии 6.02.
  • Opera. Полная поддержка сжатия включена, начиная с версии 5.12.

Использование HTTP заголовка Expires

Графика, флеш, js-файлы, файлы стилей и пр. довольно редко обновляются на сайте, поэтому пользователю, который к вам попал не в первый раз, незачем вновь скачивать эти файлы, раз они не изменились. Чтобы "научить" браузер пользователя не скачивать эти файлы, а брать их из кеша, существует HTTP заголовок Expires. Он устанавливает время, до которого браузер может использовать файл из собственного кеша. Уточнение: Данные заголовки, помимо браузера, используют также прокси-сервера, кеширующие сервера и т.п. В файле httpd.conf или .htaccess пишем следующее:

<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
</FilesMatch>

Опять же, перечисляем расширения файлов, на которые должно распространяться действие директивы. И указываем время Thu, 15 Apr 2010 20:00:00 GMT. Т.е. около 3 лет, но можно и больше

Заголовки Cache-Control

С помощью заголовка Cache-Control можно указать, как долго прокси-сервера могут хранить файлы в кеше. Добавление в заголовок must-revalidate заставляет проверять также значение ETag для обнаружения изменений.

# 480 недель

<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=290304000, public"
</FilesMatch>

# 2 дня

<FilesMatch "\.(xml|txt)$">
Header set Cache-Control "max-age=172800, public, must-revalidate"
</FilesMatch>

# 2 часа

<FilesMatch "\.(html|htm)$">
Header set Cache-Control "max-age=7200, must-revalidate"
</FilesMatch>

Либо вместе с заголовком Expires

<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "public"
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
</FilesMatch>

Отключение заголовка ETag

Механизм ETag (Entity Tag) предназначен для обнаружения новых версий запрошенных файлов. Когда сервер отсылает клиенту файл, он добавляет заголовок ETag, в который записывает хеш отправляемого файла. Клиент же, при повторном запросе, добавляет заголовок If-None-Match, значение которого равно хешу файла в кеше. Если значение совпадают, то сервер возвращает ответ HTTP/1.1 304 Not Modified, а если не совпадают, тогда возвращает новую версию файла. Таким образом, удаление заголовка ETag в ответах сервера отключает этот механизм. Что заставляет кеш клиента использовать только значения Expires и Cache-Control (если вы не используете Expires и Cache-Control не удаляйте ETag!). Выигрыш такого подхода в том, что между клиентом и сервером отпадает надобность обмениваться запросами проверки новых версий (If-None-Match и 304 Not Modified).

Отключение заголовка делается следующим образом:сайт источник http://yapro.ru Sat Feb 13 2010 13:36:37 GMT+0300

Header unset ETag
FileETag None

А вот пример обмена запросами между клиентом и сервером с использованием ETag.

Ответ сервера на первый запрос файла /i/yahoo.gif:

HTTP/1.1 200 OK
Last-Modified: Tue, 12 Dec 2006 03:03:59 GMT
ETag: "10c24bc-4ab-457e1c1f"
Content-Length: 50064

Повторный запрос файла /i/yahoo.gif и ответ сервера:

GET /i/yahoo.gif HTTP/1.1
Host: us.yimg.com
If-Modified-Since: Tue, 12 Dec 2006 03:03:59 GMT
If-None-Match: "10c24bc-4ab-457e1c1f" HTTP/1.1 304 Not Modified

Удаление заголовка Last-Modified

Удаление заголовка Last-Modified вместе с заголовком ETag позволит полностью избежать использования запросов проверки новых версий файлов If-Modified-Since и If-None-Match. Таким образом файлы будут кешироваться только на основании значений Cache-Control и Expires. Примечание: Не удаляйте Last-Modified и ETag для .html файлов. Делается это следующим образом:

<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css)$">
Header unset Last-Modified
</FilesMatch>

Вот и все.

Личеры идут лесом

Для тех кого достали левые юзеры и личеры, добавьте правило в файл .htaccess

RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yapro.ru [NC]
RewriteRule \.(jpg|jpeg|png|gif|ico|css|js)$ - [NC,F,L]

Как говорится, ничего личного господа :)

Кэширование

Для тех, кому перечисленного выше окажется мало, может почитать про кэширование бинарного кода динамических страница в PHP.

В поле зрения попали APC, eAccelerator, Memcached, XCache.сайт источник http://yapro.ru Sat Feb 13 2010 13:36:29 GMT+0300

  1. PHP – рецепты и настройка под большие нагрузки
  2. Тесты производительности различных cache storage, в тест попали APC, XCache, Memcached
  3. Установка APC под Windows
  4. Установка eAccelerator под Linux и Windows
  5. Ускоряем PHP. eAccelerator и другие акселераторы
  6. Использование memcached в высоконагруженных проектах

Помните: продуманное и правильное использование сжатия и кеширования позволит существенно сократить трафик между клиентом и сервером. Успехов.

Источники: apachedev.ru, proft.com.ua и wearymax.ru

Оцени публикацию:
  • 3,15
Оценили человек: 3
  •  

Похожие статьи:


Комментарии посетителей:
  • У меня браузер (ФФ4) всё равно запрашивает картинки и избавится от запроса 304 не получается. Вставьте, пожалуйста, полный пример .htaccess'а
    21 мая 2011, 01:03 коммент полезен : 0 # Андрей
    • 304 означает Not Modified (Не изменялось) т.е. файл подгружается с жесткого диска юзера, а не с сервера. Поздравляю, у Вас все получилось.
      21 мая 2011, 15:22 коммент полезен : 0 # Admin
  • а вообще избежать запроса 304 возможно? Например для мелких файлов, 304 от 200 не сильно отличается, больше времени на соединение уходит. Вот зачем браузеру вообще делать запрос, если файл у него есть и "срок годности" у файла 10 лет? Или я фантазирую?
    21 мая 2011, 23:05 коммент полезен : 0 # Андрей
  • а если Вы замените файл на сервере, что в этом случае будет показывать браузер - старый файл! это ведь будет неправильно, согласны? поэтому и сделали 304 - документ не изменился с указанного момента.
    21 мая 2011, 23:43 коммент полезен : 0 # Admin
    • имя файла изменить можно. Так cms для css и js для уверенности делают. Ну если нельзя, то нельзя. Спасибо за прояснение ситуации. Очень понравилась статья. Кратко и то что надо.
      22 мая 2011, 00:17 коммент полезен : -1 # Андрей
  • > а если Вы замените файл на сервере, что в этом случае будет показывать браузер - старый файл! это ведь будет неправильно, согласны? ----
    Не дописал, shift+Enter отправил статью, хотел перенос. Если файл может изменяться, то надо надо дописывать заголовки типа must-revalidate (заставлять проверять дату последней модификации). Или не кешировать надолго. Всё таки много запросов маленьких файлов оч тормозят сайт
    22 мая 2011, 00:21 коммент полезен : 0 # Андрей
  • если у Вас много маленьких файлов, которые не будут долго изменяться, то делайте CSS-спрайты, это такие сборники изображений в одном файле. Но если честно, то даже большое кол-во изображений не может сильно притормаживать загрузку сайта, ведь они статичные.
    22 мая 2011, 06:58 коммент полезен : 0 # Admin

Предложения и пожелания:
Ваше имя: Ваш E-mail:
Введите изображенные цифры:
Captcha

HTML (19)

CSS (36)

PHP (21)

MySQL (14)

JavaScript (57)

Flash (6)

XML (3)

Apache (34)

Дизайн (35)

Продвижение (30)

Программы (25)

Unix (11)

Интересное (37)


Последние комменты:

Новые заметки:

Защита сервера от ошибок в phpMyAdmin

HTML5 - новые виды атак

Социальные рекомендации Twitter в Google

Ашманов про стартапы

Skype Distributed Database Architecture

Erlang - лекарство при высоких нагрузках

Amazon Web Services: инструменты обеспечения масштабируемости и отказоустойчивости

Обсуждения на форуме:

Новый раздел

Шаблонизация

YaPro - Полная сборка системы

Дубли файлов, эскизы изображений, редактирование шаблонов

Общая регистрация в CMS и phpBB3

Помощь в разработке шаблона

Идея модуля музыкальной системы

Ошибка в тексте? Выделите её мышкой и нажмите: Ctrl + Enter| Здравствуйте, Гость | Войти | Регистрация| Карта сайта | RSS ленты
О проекте | Скачать CMS | Видеоуроки | Документация | Плагины | Форум | Идеи | Новости | Веб-мастеру | Контакты

YaPro CMS в Живом Журнале

YaPro CMS в Твитере

YaPro CMS в Одноклассниках

YaPro CMS в Яндекс.Блогах


youtube.com/watch?v=7hFivbgIEqk

При полном или частичном использовании материалов данного сайта, ссылка на сайт "yapro.ru" обязательна как на источник информации.
Автоматический импорт материалов и информации с сайта запрещен.
Copyrights © 2007 - 2012 YaPro.Ru


Главная » Веб-мастеру » Apache »