К основному контенту

Кеширование

Если  в ответе сервера отсутствуют явно указанные заголовки кеширования или в заголовках указано слишком короткий период хранения ресурсов, появляется сообщение PageSpeed Insights - "Используйте кеш браузера".

Для повторного отображения страниц с кешированием необходимо меньше времени, т.к. нет необходимости загружать ресурсы с сервера. Заголовки кеширования должны применяться ко всем статичным ресурсам, а не только к некоторым из них (например, изображениям). Кешируемые ресурсы включают файлы JavaScript и CSS, графические и другие файлы (мультимедийное содержание, файлы PDF и т. д.).

Продолжительность хранения статических ресурсов в кеше должна составлять не менее недели. Внешние ресурсы (объявления, виджеты и др.) должны храниться не менее 1 дня. Рекомендуется использовать следующие установки для всех кешируемых ресурсов:

В заголовке Expires следует указать период от недели (минимум) до года (рекомендуется). Лучше использовать Expires, чем Cache-Control: max-age, так как он более широко поддерживается. Не устанавливайте срок больше одного года: это является нарушением правил RFC.

Заголовки Expires, Cache-Control max-age

Эти заголовки указывают, в течение какого периода браузер может использовать кешированные ресурсы, не запрашивая на веб-сервере их возможные обновления. Эти "сильные" заголовки действуют в обязательном порядке. После их установки и загрузки ресурса, браузер не будет отправлять запросы GET на веб-сервер до истечения срока действия или очистки кеша пользователем.

В целом, ресурсы должны кэшироваться либо на очень короткий срок (если они могут измениться), либо на неопределённый (если они статичны).

Заголовки Last-Modifed и ETag

Эти заголовки указывают, как браузер должен устанавливать тождественность файлов при кешировании. В заголовке Last-Modified для этого используется дата. Заголовок ETag использует любой уникальный идентификатор ресурса (чаще всего это версия файла или хеш контента). Last-Modified – "слабый" заголовок, так как браузер применяет эвристические алгоритмы, чтобы определить, запрашивать ли элемент из кеша.

Эти заголовки позволяют браузеру эффективно обновлять кешированные ресурсы, отправляя запросы GET каждый раз, когда пользователь явным образом перезагружает страницу. Условные запросы GET не возвращают полный ответ, если ресурс не изменился на сервере, и таким образом обеспечивают меньшую задержку, чем полные запросы.

Для всех кешируемых ресурсов нужно обязательно указывать один заголовок из пары Expires и Cache-Control max-age, а также один заголовок из пары Last-Modified и ETag. Использовать и Expires, и Cache-Control: max-age излишне, как и указывать Last-Modified и ETag одновременно.

Если ресурс время от времени изменяется, браузер может кешировать его до момента изменения, о чем сервер автоматически сообщит браузеру. Для этого каждой версии ресурса присваивается уникальный URL. Например, у вас есть ресурс под названием my_stylesheet.css. Мы можем переименовать этот файл, назвав его my_stylesheet_fingerprint.css. При изменении ресурса изменяется и его цифровой отпечаток, и, следовательно, его URL. Как только URL изменился, браузер повторно загружает ресурс. Цифровые отпечатки позволяют использовать длительные сроки действия, даже если ресурс часто изменяется.

Чаще всего для создания цифровых отпечатков используется 128-битное шестнадцатеричное число, представляющее собой закодированный кеш содержимого файла.

Apache

Для включения кеширования в веб-сервере Apache используется модуль - mod_expires:
See the Pen WEMPGe by George Wise (@ink-jet) on CodePen.

Nginx

Cache-control в Nginx определяется с помощью инструкции expires:
server {
...
location ~* ^.+\.(rss|atom|jpg|jpeg|gif|png|ico|rtf|js|css)$ {
expires max;
}
...
}

Сторонние скрипты

Для ускорения загрузки сторонних скриптов можно по расписанию скачивать их  свежие версии:
<?php

function downloadJs($file_url, $save_to)
{
    $content = file_get_contents($file_url);
    file_put_contents($save_to, $content);
}

// Указываем URL, затем папку от корня сайта и имя файла с расширением.
// Проверьте чтобы на папке были права на запись 777/755
// Метрика
downloadJs('https://mc.yandex.ru/metrika/watch.js', realpath("./js") . '/watch.js');

// Google Analytics
downloadJs('http://www.google-analytics.com/analytics.js', realpath("./js") . '/analytics.js');

// Для скриптов без расширения
downloadJs('http://code.jivosite.com/script/widget/NuT1gBLsC6', realpath("./js") . '/NuT1gBLsC6');

?>
в планировщике заданий добавляем выполнение команды:
wget -q -O - /dev/null http://vasilenko.info/downloadjs.php >/dev/null 2>&1

Дополнительные материалы:

Комментарии