Ускоряем загрузку страниц в XenForo

[Nappsel]

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

​

Ускоряем XenForo

XenForo довольно «тяжелый» ресурс на сервере и в зависимости от активности ваших пользователей, может вдобавок постоянно нагружать вашу базу данных. Следуйте простым шагам ниже, чтобы узнать способы как ускорить XenForo и заставить движок работать быстрее, обеспечивая гарантированное возвращение ваших посетителей.

Краткая навигация

1. CDN для XenForo(ситуативно)
2. Используем кэширование
3. Оптимизируем изображения
4. jQuery: CDN или Local
5. Минимизируем CSS
6. Откладываем загрузку Javascript (перемещаем JS вниз)
7. Уменьшаем количество дополнений
8. Сокращаем HTTP запросы
9. Кэшируем данные через браузер

1. CDN для XenForo(ситуативно)

Хотим отметить, что данный пункт будет полезен только большим, международным сайтам.

Главная задача отдела эксплуатации Sports.ru и Tribuna.com — масштабирование сетевой инфраструктуры в условиях постоянного роста трафика (за 1,5 года трафик и кол-во запросов в секунду выросло в два раза), регулярных пиковых нагрузок и аудитории, распределенной по разным странам. Для решения этой задачи мы используем разные технологии; одна из них — создание собственной CDN (сети доставки контента), которая позволяет сократить нагрузку, усилить защиту от DDoS-a и ускоряет загрузку сайта в удаленных регионах

Реализация CDN для XenForo довольно быстрая и легкая. Делая это, вы можете быть уверены в том, что ваши изображения, JavaScript, CSS загружаются из разных мест по всему миру, что позволяет им доставляться быстрее до ваших посетителей. Например, KeyCDN имеет очень простую интеграцию с XenForo. Просто выполните следующие действия.

​

1. Создайте pull зону в вашем аккаунте на KeyCDN.
   
2. Добавьте следующий код в файл library/config.php используя ваш URL CDN, такой как
   У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация
   
   

   $config['externalDataUrl'] = 'http://yourzone-ab12.kxcdn.com/data';
   $config['javaScriptUrl'] = 'http://yourzone-ab12.kxcdn.com/js';

3. Войти в панель управления XenForo и перейдите во «Внешний вид» → «Стили» → [Ваш стиль] → «Настройки стиля» → «Основное».
   
4. В поле «Путь по умолчанию» замените styles/default на
   У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация
   и нажмите на "Обновить настройки стиля", чтобы применить новые настройки.

​

2. Используем кэширование

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

Дополнение для кэширования

Одним из популярных дополнений является

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

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

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

Если ваш форум работает на сервере Redis, то вот дополнение кэширования для него Zend Redis Cache.

Кэширование на серверном уровне

XenForo имеет документацию о том, как

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

для front-end, так и для back-end. Так же у нас имеется эта документация на русском: Ускоряем XenForo: включаем кэширование .

Однако совсем недавно появился еще один способ кэшировать данные на сервере для гостей и его мы опишем вам подробно. Сразу хотим отметить, что данный способ предназначен для Nginx fastcgi_cache + PHP-FPM.

Для начала вам потребуется установить дополнение Logged In Cookie , а затем добавить небольшие части кода в ваш конфиг Nginx.

nginx.conf
Ниже блока http {
или просто выберите конфигурацию домена и добавьте ниже блока server {

### FastCGI Cache ################
map $http_cookie $nocachecookie {
     default                   0;
    ~xf_fbUid                  1;
    ~xf_user                   1;
    ~xf_logged_in              1;
}

map $request_uri $nocacheuri {
       default              0;
    ~^/register             1;
    ~^/login                1;
    ~^/validate-field       1;
    ~^/captcha              1;
    ~^/lost-password        1;
    ~^/two-step             1;
}

fastcgi_cache_path              /tmp/nginx_fastcgi_cache levels=1:2 keys_zone=fastcgicache:200m inactive=30m;
fastcgi_cache_key               $scheme$request_method$host$request_uri;
fastcgi_cache_lock              on;
fastcgi_cache_use_stale         error timeout invalid_header updating http_500;
fastcgi_ignore_headers          Cache-Control Expires Set-Cookie;
### FastCGI Cache ################

php.conf
Выше последней строки }.
или в самом низу этого блока
location ~ \.php$ {

### fastcgi_cache ###
fastcgi_cache           fastcgicache;
fastcgi_cache_bypass    $nocachecookie $nocacheuri;
fastcgi_no_cache        $nocachecookie $nocacheuri;
fastcgi_cache_valid     200 202 302 404 403 5m;
fastcgi_cache_valid     301 1h;
fastcgi_cache_valid     any 1m;
add_header X-Cache      $upstream_cache_status;
### fastcgi_cache end ###

Сохраните, а затем перезапустите Nginx и PHP-FPM.

Вносим изменения в шаблон helper_login_form и login_bar_form.
Заменяем:

<label class="rememberPassword"><input type="checkbox" name="remember" value="1" id="ctrl_pageLogin_remember" tabindex="3" /> {xen:phrase stay_logged_in}</label>

На:

<input type="hidden" name="remember" checked="checked" value="1" />

Польза?
То же самое, что Varnish и LiteSpeed Full Page Cache.:-)

3. Оптимизируем изображения

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

Мы рекомендуем дополнение

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

, которое оптимизирует и сжимает изображения на вашем форуме.

Обработано 453к изображений, сохранено 134.9гб места на диске, сокращено на 55%. – talkbass.com​

Когда вы собрались сжимать и оптимизировать изображения, у вас есть два варианта как это сделать. Вы можете отложить сжатие изображений, используя дополнение

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

или вы можете сжимать их на стадии загрузки, то есть ваши пользователи будут испытывать небольшую задержку.

4. jQuery: CDN или Local

Получение посетителями jQuery через CDN, скорее всего, всегда будет быстрее, чем локальное, потому что вы можете распространять его из разных мест, которые ближе всего к посетителю. XenForo имеет встроенную опцию для изменения способа получения jQuery. Чтобы изменить его, достаточно зайти в «Настройки» → «Производительность» и в самом низу есть выбор библиотеки jQuery. Google CDN является неплохим выбором для начала.

​

5. Минимизируем CSS

XenForo имеет встроенную возможность уменьшать CSS. Для того, чтобы включить её, нужно перейти в «Настройки» → «Производительность» и поставить галочку рядом с Сжатие CSS.

​

Дополнение кэширования

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

, что мы упоминали ранее, так же имеет возможность сжатия CSS.

6. Откладываем загрузку Javascript (перемещаем JS вниз)

Для большинства случаев, мы настоятельно рекомендуем откладывать загрузку javascript и перемещать код вниз до тега </body>. По умолчанию, XenForo помещает JavaScript внутрь тега <head>, который является не лучшим местом для увеличения скорости загрузки страниц, а так же это полностью противоречит тому, что рекомендует Google Insights PageSpeed.

Существует бесплатное дополнение Defer JS , которое собирает все ваши JavaScript из верхней части страницы и перемещает их вниз. Это оказывает заметное влияние на время загрузки страниц.

Вы также можете отложить загрузку JavaScript и с помощью дополнения

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

, которое мы упоминали ранее.

7. Уменьшаем количество дополнений

Скорее всего, мало кто будет спорить с тем, что чем меньше установлено дополнений, тем лучше. Каждое дополнение увеличивает количество HTTP запросов, а так же в той или иной степени затрагивает JavaScript и CSS. Многие из тех советов по оптимизации, о которых мы говорили, являются так же дополнениями и мы рекомендуем вам проверять увеличение или падение скорости через некоторые специализированные сайты, например:

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

или

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

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

8. Сокращаем HTTP запросы

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

Для этого пройдите по следующему пути «Внешний вид» → «Стили» → [Ваш стиль] → «Шаблоны» и через быстрый поиск найдите шаблон «sidebar_share_page». Затем просто удалите его содержимое. В любое время, если вы захотите вернуть содержимое, вы можете просто Вернуть шаблон.

​

9. Кэшируем данные через браузер

Альтернативным способом кэширования вы можете использовать кэширование через браузер. Нужно просто добавить следующий код в файл .htaccess, это позволит, например, использовать сжатие Gzip, добавить истёкшие заголовки, а так же отключить ETags.

Gzip сжатие

Gzip сжатие веб-страниц и таблиц стилей на уровне сервера перед отправкой их в браузер.

<IfModule mod_deflate.c>
  # Compress HTML, CSS, JavaScript, Text, XML and fonts
  AddOutputFilterByType DEFLATE application/javascript
  AddOutputFilterByType DEFLATE application/rss+xml
  AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
  AddOutputFilterByType DEFLATE application/x-font
  AddOutputFilterByType DEFLATE application/x-font-opentype
  AddOutputFilterByType DEFLATE application/x-font-otf
  AddOutputFilterByType DEFLATE application/x-font-truetype
  AddOutputFilterByType DEFLATE application/x-font-ttf
  AddOutputFilterByType DEFLATE application/x-javascript
  AddOutputFilterByType DEFLATE application/xhtml+xml
  AddOutputFilterByType DEFLATE application/xml
  AddOutputFilterByType DEFLATE font/opentype
  AddOutputFilterByType DEFLATE font/otf
  AddOutputFilterByType DEFLATE font/ttf
  AddOutputFilterByType DEFLATE image/svg+xml
  AddOutputFilterByType DEFLATE image/x-icon
  AddOutputFilterByType DEFLATE text/css
  AddOutputFilterByType DEFLATE text/html
  AddOutputFilterByType DEFLATE text/javascript
  AddOutputFilterByType DEFLATE text/plain
  AddOutputFilterByType DEFLATE text/xml

  # Remove browser bugs (only needed for really old browsers)
  BrowserMatch ^Mozilla/4 gzip-only-text/html
  BrowserMatch ^Mozilla/4\.0[678] no-gzip
  BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
  Header append Vary User-Agent
</IfModule>

Истёкшие заголовки

Истёкшие заголовки говорят браузеру, должны ли они просить файл с сервера или они могут захватить его из кэша браузера.

<ifModule mod_expires.c>
     ExpiresActive On
     ############################################
     ## Add default Expires header
     ## http://developer.yahoo.com/performance/rules.html#expires
     <FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
     ExpiresDefault "access plus 1 year"
     </FilesMatch>
     </ifModule>

Итоги

Как вы можете видеть, есть немало способов ускорить загрузку страниц на движке XenForo. От подключения CDN до уменьшения HTTP запросов, оптимизации изображений, сжатия CSS, отложенной загрузки JavaScript, и изменения конфигов на уровне сервера. Кроме того, хороший хостер является менее не важным пунктом этой статьи.

Есть ли у вас другие способы и хитрости по ускорению XenForo или, возможно, мы что-то пропустили? Нам бы хотелось услышать об этом ниже в комментариях. А так же просим обратить внимание на то, что все действия вы выполняете на свой страх и риск, и если вам не помогло или вы не видите разницу, то это не значит, что мы врём. Каждый из этих способов проверялся множеством людей и есть те, кому они помогли, а так и те, кому нет.

 

[Totenkopf]

А плагина нет выполняющего ускорение?

 

[Nappsel]

Totenkopf, каким образом дополнение к XenForo должно вносить изменения в конфиг nginx, например? Вы бы прочитали дальше краткой навигации и вопроса бы такого не возникло.

 

[Totenkopf]

Totenkopf, каким образом дополнение к XenForo должно вносить изменения в конфиг nginx, например? Вы бы прочитали дальше краткой навигации и вопроса бы такого не возникло.

Извините, но про конфиг nginx не чего не знал, да тему прочитал бегло.
Встречный вопрос- на php хостинг смысла ставить нету? Расчет на 1000 уников в сутки.

 

[Sergey Miroshnichenko]

на php хостинг смысла ставить нету?

Есть. Или какой ответ вы рассчитываете услышать. Не было бы смысла, никто бы не ставил. XenForo - такая же CMS, как и другие и в вопросе выбора виртуальный хостинг/VDS/выделенный сервер тут всё выглядит также. Ну, разве что с некоторыми нюансами. Типа наличия установленного Elastic для Enhanced Search.
Nappsel, спасибо большое за полезный и актуальный материал!

 

[nv63]

Кэшируем данные через браузер. При добовление кода в файл .htaccess,

Internal Server Error
The server encountered an internal error or misconfiguration and was unable to complete your request.

Please contact the server administrator at webmaster@localhost to inform them of the time this error occurred, and the actions you performed just before this error.

More information about this error may be available in the server error log.

 

[Jager]

Где скачать GoodForNothing Kraken?

 

[Mirovinger]

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

 

[Jager]

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

Это я и сам знаю, мне надо на халяву, а не за бабло.

 

[Mirovinger]

Тогда не задавайте таких вопросов, а ищите, если здесь нет, то есть вероятность в гугле найти.

 

[Jager]

Тогда не задавайте таких вопросов, а ищите, если здесь нет, то есть вероятность в гугле найти.

Нету нигде. Кроме одного сайта. Но там надо 6 комментов набрать при ограничении 2 коммента в день. Вот наберу, даст бог скачаю и тогда у вас выложу.

 

[Mirovinger]

Конечно это не по теме, но значит плохо искали, я за минуту как минимум пять форумов нашёл, где можно свободно скачать или оставив коментарий.
Но одно но, не торопитесь использовать, а лучше сразу проверить на наличие лишнего кода и левых ссылок.

 

[Слот]

Искал причину с ошибкой на Кэшируем данные через браузер. При добавление кода в файл .htaccess, пользователь nv63 задавал этот вопрос, но так и нет ответа. У меня такая же ошибка после добавление кода. Подскажите пожалуйста как сделать то?

 

[neqste]

Грамотно написано, с пониманием что и для чего. Но в большинстве случаев бутылочным горлышком оказывается банальная тяжеловесная графика (гифки, огромное количество изображений), не редко подгружаемая откуда-то из-за бугра или с слишком нагруженного удаленного сервера. Так же, стоит заметить, что немаловажный фактор - недостаток вычислительной мощности ПК пользователя. Банальный стиль вроде "charm" может существенно тормозить форум.

Поэтому те, кто найдут эту интересную статью из гугла и наткнутся на мой комментарий - пожалуйста, банально уберите баннеры по несколько мегабайт, а так же смените дизайн. Иногда этого более чем достаточно.

 

[Слот]

Ну это явно не ко мне, мой вопрос совсем другой был выше и проблема совсем в другом.

 

[Sergey Miroshnichenko]

А что скажете насчёт опции Загружать шаблоны из файлов?.. Кто-нибудь включает, есть эффект?..

 

[Nappsel]

Sergey Miroshnichenko, да, у меня лично включён. Насчет значительной полезности этой функции не скажу, если польза есть, то она либо зависит от целого списка условий, либо очень незначительная.
Могу сказать так: у меня включена функция загрузки шаблонов из файлов + есть половина пунктов из этой статьи и несколько своих решений. Результат меня вполне устроил. Форум с 30 дополнениями, некоторые из них не самые маленькие; с включенными социальными кнопками, которые подгружаются со стороны; естественно FA и шрифты с гугла дают в конечном итоге 1.06s загрузку страницы. Правда это не первый вход и данные уже в кэше.

 

[viper]

В чём может быть проблема: при внесении

### FastCGI Cache ################
map $http_cookie $nocachecookie {
     default                   0;
    ~xf_fbUid                  1;
    ~xf_user                   1;
    ~xf_logged_in              1;
}

map $request_uri $nocacheuri {
       default              0;
    ~^/register             1;
    ~^/login                1;
    ~^/validate-field       1;
    ~^/captcha              1;
    ~^/lost-password        1;
    ~^/two-step             1;
}

fastcgi_cache_path              /tmp/nginx_fastcgi_cache levels=1:2 keys_zone=fastcgicache:200m inactive=30m;
fastcgi_cache_key               $scheme$request_method$host$request_uri;
fastcgi_cache_lock              on;
fastcgi_cache_use_stale         error timeout invalid_header updating http_500;
fastcgi_ignore_headers          Cache-Control Expires Set-Cookie;
### FastCGI Cache ################

не даёт сохранить файл с текстом
Ошибка: Настройки Nginx имеет неверное значение ?
Добавляю ниже блока server {

 

[Smalesh]

Это вообще где?

 

[viper]

это в файле nginx.conf, я вставил так :

server {
        тут идёт конфиг
        }
                ### FastCGI Cache ################
                map $http_cookie $nocachecookie {
                        default                   0;
                        ~xf_fbUid               1;
                        ~xf_user                1;
                        ~xf_logged_in         1;
                }

                map $request_uri $nocacheuri {
                       default                    0;
                       ~^/register             1;
                       ~^/login                 1;
                       ~^/validate-field     1;
                       ~^/captcha             1;
                       ~^/lost-password    1;
                       ~^/two-step            1;
                }

                fastcgi_cache_path              /tmp/nginx_fastcgi_cache levels=1:2 keys_zone=fastcgicache:200m inactive=30m;
                fastcgi_cache_key               $scheme$request_method$host$request_uri;
                fastcgi_cache_lock              on;
                fastcgi_cache_use_stale         error timeout invalid_header updating http_500;
                fastcgi_ignore_headers          Cache-Control Expires Set-Cookie;
                ### FastCGI Cache ################
        location / {
тут продолжение
                }

в общем вот такая лепёха :
nginx: [emerg] "map" directive is not allowed here in /etc/nginx/nginx.conf:96

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