Четверг , Май 24 2018
Home » Web сервера » Оптимизация » Ускоряем загрузку сайта на wordpress за 10 минут.

Ускоряем загрузку сайта на wordpress за 10 минут.

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

 

Ускоряем загрузку сайта на wordpress за 10 минут.

Что нужно чтобы сайт на WordPress стал быстрее ветра ?

1) Нам понадобиться адекватный хостинг, быстрый надежный и не дорогой, но с вкусными плюшками например beget.ru или jino.ru сам я пользуюсь хостингом от beget но на том и другом есть поддержка memcached кэша на beget всего за 1 руб в сутки можно получить 128 мб места под кэш в оперативной памяти, цены на джино не знаю но знаю что там тоже есть поддержка мемкэша. Для полноценной работы нам понадобиться плагин WP-FFPC. Если вы счастливый пользователь этого хостинга то качаем и устанавливаем плагин из панели управления вашего сайта. Если ваш блог обновляется редко то можете изменить параметры и увеличить стандартное время кэша — там оно прописано 300 сек поставив 300000.

2) Если вы не являетесь счастливым пользователем вышеуказанных хостингов и у вас нет опции подключения memcache. Тогда вам пригодиться плагин Hyper Cache качаем этот не обновляемся до других версии ибо они медленные. Вставляем в файл wp-config.php:

define( 'WP_CACHE', true );

Далее переходим в настройки плагина и прописываем следующее:
Ускоряем загрузку сайта на wordpressУскоряем загрузку сайта на wordpress

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

Ниже этих настроек трогать ничего не нужно. Сохранили едем дальше

3) Третий этам это минификация для нее используем плагин Autoptimize с помощью него сжимаем тело  html минифицируем js, и css файлы минифицировать css файлы не рекомендую, так как первая загрузка из-за нее очень медленная, проще сделать компрессию файла самостоятельно и закинуть на сайт.

Кликаем по Hide advanced settings

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

После этих настроек трогать ничего не нужно. Если у вас вдруг перестали работать какие либо виджеты или плавающее меню пропишите после запятой в поле исключения jquery.js после этого все должно заработать.

4) Сделаем загрузку изображений с поддомена например cdn.gigamania.ru с помощью функции. Добавим ее  в файл functions.php:

function my_cdn_upload_url() {
    return 'http://cdn.gigamania.ru/wp-content/uploads';
}
add_filter( 'pre_option_upload_url_path', 'my_cdn_upload_url' );

Замените имя сайта на свой поддомен. Теперь изображения будут загружаться с него.

Загружаем jquery c cdn google. Рекомендую этот метод даже настаиваю на его применении вами. Но в этом случае вам будет нужно отключить сжатие скриптов и сжатие css файлов оставив только сжатие HTML в плагине Autoptimize. Включаем загрузку фреймворка jquery с cdn google прописав функцию:

function my_scripts_method() {
wp_deregister_script( 'jquery' );
wp_register_script( 'jquery', '//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js', false, null, true );
wp_enqueue_script( 'jquery' );
}
add_action( 'wp_enqueue_scripts', 'my_scripts_method' );

5) Убираем версии css, js файлов — это тоже полезно. так как браузеры не кэшируют url содержащие знаки вопроса. Для того чтобы избавиться от этого необходимо прописать в файл functions.php который находиться в вашей теме:

function _remove_script_version( $src ){
$parts = explode( '?', $src );
return $parts[0];
}

//Убирает версию файла для js
add_filter( 'script_loader_src', '_remove_script_version', 15, 1 );
//Убирает версию файла для css
add_filter( 'style_loader_src', '_remove_script_version', 15, 1 );

6) Уменьшим качество создаваемых превьюшек с помощью функции добавленной в functions.php

add_filter( 'jpeg_quality', create_function('', 'return 60;' ) );

7) Скачаем плагин EWWW Image Optimizer и Regenerate Thumbnails с помощью первого оптимизируем изображения уменьшив их размер, с помощью второго создадим новые превьюшки с 60% качеством тем самым уменьшив размер страницы на пару мегабайт если изображений очень много.

8) Отключаем загрузку шрифтов от google c помощью плагина Remove Google Fonts References. Настроек у плагина нет.

9) Теперь со стороны сервера включим сжатие и кэширование изображений и других файлов браузером прописав в .htaccess. Такая конфигурация подойдет для любого более-менее нормального хостинга.

#Включаем mod_deflate для gzip  сжатия файлов на серверах apache2
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/plain text/css application/json
AddOutputFilterByType DEFLATE text/javascript application/javascript application/x-javascript
AddOutputFilterByType DEFLATE text/xml application/xml text/x-component
<filesmatch "\.(ttf|otf|eot|svg)$" >
    SetOutputFilter DEFLATE
</IfModule>

 
#Включаем gzip на серверах nginx или nginx+apache
<IfModule mod_gzip.c>
# Устанавливаем заголовок Vary: Accept-Encoding на nginx
gzip_vary on 
mod_gzip_on Yes
mod_gzip_item_include file \.js$
mod_gzip_item_include file \.css$
mod_gzip_item_include file \.html$
mod_gzip_item_include file \.txt$
</IfModule>
 
 
# Устанавливаем заголовок Vary: Accept-Encoding на apache2
<IfModule mod_headers.c>
<filesmatch "\.(js|css|xml|gz|html)$">
   Header append Vary: Accept-Encoding
</FilesMatch>
</IfModule>
 
# используем mod_expires
<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault A86400 
ExpiresByType image/x-icon A2592000
ExpiresByType application/x-javascript A2592000
ExpiresByType text/css A2592000
ExpiresByType image/gif A604800
ExpiresByType image/png A604800
ExpiresByType image/jpeg A604800
ExpiresByType text/plain A604800
ExpiresByType application/x-shockwave-flash A604800
ExpiresByType video/x-flv A604800
ExpiresByType application/pdf A604800
ExpiresByType text/html A900
</IfModule>

 

Ну вот и все можете тестировать свой сайт 😉

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *