WordPress speed improvements Ubuntu VPS (Zonder SSL)
Introductie: Deze tutorial zal een aantal verbeterpunten beschrijven om je wordpress sites sneller te laten werken.
Deze tutorial is geschreven voor een setup met (Maar zal waarschijnlijk voor de meeste gevallen ook voor de oudere versies werken):
- Ubuntu 16.04
- Apache 2.4
- PHP7
- MySQL 5.7
Een aantal basisinstellingen om wordpress vloeiend te laten werken:
Open de php.ini file:
sudo nano /etc/php/7.0/apache2/php.ini
De maximale tijd dat een script mag gebruiken in seconden:
max_input_time = 60
De maximale hoeveelheid geheugen dat een script mag gebruiken:
memory_limit = 128M
De maximale grote van POST data wat PHP mag accepteren:
post_max_size = 8M
De mogelijkheid om files te uploaden:
file_uploads = On
De maximale grote van de file uploads (Je moet gaan bedenken of je wel grote files nodig hebt. Anders zo laag mogelijk zetten.):
upload_max_filesize = 100M
Maximale aantal files die tegelijkertijd in een keer mogen worden geupload:
max_file_uploads = 100
Timeout voor socket based streams:
default_socket_timeout = 300
Nu nog een kleine aanpassing in de wp-config van je wordpress site:
sudo nano /var/www/vhosts/domein.nl/wp-config.php
Voeg voor de regel “/* That’s all, stop editing! Happy blogging. */” het volgende toe:
define(‘WP_MEMORY_LIMIT’, ‘128M’);
Statiche content laden van een domein zonder coockies:
Stap 1: Maak in je DNS manager een nieuwe A en mogelijk ook AAAA record aan.
static.domein.nl A 123.456.789.123
static.domein.nl AAAA 2001:db8::1
(Verander domein.nl in jouw domein en de ipadressen in de adressen van je VPS)
Stap 2: Pas de Apache configfile aan van je website:
Log in met SSH op je vps.
sudo nano /etc/apache2/sites-available/domein.conf
(Verander je domein.conf in de file die voor jouw site gebruikt wordt)
Plak de volgende config in je .conf:
<VirtualHost *:80>
ServerAdmin jouw@email.nl
ServerName static.domein.nl
DocumentRoot /var/www/vhosts/domein.nl/wp-content/
<Directory /var/www/vhosts/domein.nl/wp-content>
Options +MultiViews
AllowOverride AuthConfig Options FileInfo Limit
</Directory>
</VirtualHost>
(Pas het email adres, de ServerName, de DocumentRoot en Directory aan met jouw domein gegevens)
Doe daarna:
sudo apache2ctl configtest
en als het geen fouten opleverd:
sudo apache2ctl restart
Stap 3: Edit de wp-config.php van je wordpress installatie.
Ga dan naar de directory waar je wordpress site staat.
sudo nano /var/www/vhosts/domein.nl/wp-config.php
(Zet hier het pad naar je eigen wordpress installatie in)
Voeg hieraan de volgende regels toe voor /* That’s all, stop editing! Happy blogging. */
define(“WP_CONTENT_URL”, “http://static.domein.nl”);
define(“COOKIE_DOMAIN”, “domein.nl”);
define(“WP_PLUGIN_URL”, “http://static.domein.nl/plugins”);
Stap 4: Log in op phpmyadmin om de bestaande statische contens op het nieuwe url te zetten.
Klik in de linker lijst op de database van je wordpress site. Ga daarna naar “Query opbouwen” bovenin.
Scroll naar beneden tot je het vak met “SQL-query op database jouwdatabase” ziet.
Plak dan de volgende code in dat vak en verander domein.nl in je eigen domein.
UPDATE wp_posts SET post_content = REPLACE(post_content, ‘http://www.domein.nl/wp-content/uploads/’,’http://static.domein.nl/uploads/’)
Vanaf dit moment zal je site alle statische content vanaf de static.domein.nl laden. De browser kan op deze manier meer connecties tegelijk naar de server maken en de coockies worden niet meer voor deze content geladen.
Gebruik maken van browser cache:
Zet in je .htaccess file de volgende regels:
# 1 Maand voor de volgende file types
<filesMatch “.(css|jpg|jpeg|png|gif|js|ico)$”>
Header set Cache-Control “max-age=2592000, public”
</filesMatch>
De 2592000 staat voor het aantal seconden dat het vanaf de browser cache geladen moet worden in plaats van opnieuw op te halen van de server. In dit geval is dat 1 maand.
Voor de static.domein.nl data moeten we ook een .htaccess file aanmaken om dit voor elkaar te krijgen.
sudo nano /var/www/vhosts/domein.nl/wp-content/.htaccess
(vervang het pad voor het pad naar je eigen wordpress installatie)
Plak daar de volgende code in:
# 1 Month for most static assets
<filesMatch “.(css|jpg|jpeg|png|gif|js|ico)$”>
Header set Cache-Control “max-age=2592000, public”
</filesMatch>
Nu staat het voor de hierboven geconfigureerde statische content ook ingesteld.
Zend OPcache instellen voor PHP7:
Zend OPcache zorgt ervoor dat PHP scripts sneller uitgevoerd kunnen worden doormiddel van caching van de uitgevoerde code en optimalisatie daarvan.
Ik zal een aantal dingen kort uitleggen. Voor uitgebreide uitleg verwijs ik door naar bijvoorbeeld:
http://uk3.php.net/manual/en/opcache.configuration.php
We gaan beginnen met het configureren:
sudo nano /etv/php/7.0/apache2/php.ini
Hier zoeken we de regel:
;opcache.enable=0
Deze veranderen we in:
opcache.enable=1
Hiermee schakelen we de OPcache funtie in.
Daarna door naar de volgende regel:
;opcache.enable_cli=0
Ook deze schakelen we in:
opcache.enable_cli=1
Nu gaan we het gereserveerde geheugen instellen:
;opcache.memory_consumption=64
Verander deze in een ruimer getal als je meerdere php sites draait.
opcache.memory_consumption=128
De volgende regel is voor de gereserveerde ruimte voor interned strings:
;opcache.interned_strings_buffer=4
Zet deze iets hoger.
opcache.interned_strings_buffer=16
Nu zetten we de maximale hoeveelheid scripts in het geheugen.
;opcache.max_accelerated_files=200
Zet dit naar een hoger getal .
opcache.max_accelerated_files=10000
Nu zetten we nog het maximale verspilde geheugen, waarna de cache word herstart.
;opcache.max_wasted_percentage=5
Haal de ; weg.
opcache.save_comments=1
Herstart apache om de nieuwe instellingen actief te maken.
sudo apache2ctl restart
Je kan verder weinig zien of deze waarden goed zijn. Met de volgende lpugin krijg je wat meer inzicht en kan je ook een herstart forceren: https://nl.wordpress.org/plugins/opcache/
Gzip gebruiken om de files te comprimeren:
Edit de .htaccess file:
sudo nano /var/www/vhosts/domein.nl/.htaccess
(Pas het pad aan voor de instellingen van jouw VPS)
Voeg dan de volgende code toe:
<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>
Doe dit ook in de volgende .htaccess file voor de static content:
sudo nano /var/www/vhosts/domein.nl/wp-content
Javascript defered of asynchroon laden:
Dit is het makkelijkste te doen met een van de onderstaande plugins. Houdt er rekening mee dat niet alle themes en of plugins hier mee overweg kunnen. Mijn ervaring is dat sommige sliders er moeite mee hebben.
Probeer het een uit. Als het geen problemen opleverd, dan lekker aan laten staan. En anders gewoon weer verwijderen.
De beste optie is het asynchroon laden van de javascripts. Deze kan je instellen met de volgende plugin:
Mocht dit niet helemaal lekker werken, probeer dan de javascripts defered te laden:
Optimaliseren van plaatjes:
Dit kan je prima doen met een plugin, als je niet weet hoe je dit precies vooraf moet doen.
WP Smush kan dit bijvoorbeeld prima voor je doen. Je kan de al bestaande plaatjes door het pakket alsnog laten optimaliseren (De gratis versie kan er 50 per keer, dus als je er meer hebt, dan een aantal keer de optimalisatie draaien.)
Deze plugin kan het verder automatiseren, door het automatisch bij upload al voor je te doen.
De betaalde variant kan nog beter comprimeren, maar ik zou eerst eens lekker met de gratis versie gaan werken.
Preventie van hot linking van plaatjes en andere files:
Om ervoor te zorgen dat andere sites niet jouw plaatsjes en/of andere files laden vanaf jouw VPS, kan je wat aanpassingen doen in je .htacces files.
sudo nano /var/www/vhosts/domein.nl/.htaccess
en
sudo nano /var/www/vhosts/domein.nl/wp-content/.htaccess (Voor de statische content)
Wil je gewoon tegengaan dat deze worden geladen, voeg dan de volgende code toe aan de bovenstaande .htaccess files.
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://(www\.)?domein.nl/.*$ [NC]
RewriteRule \.(gif|jpg|js|css)$ – [F]
Wil je dat bij de linkende partij een ander plaatje komt te staan, voeg dan aan de bovenstaande .htaccess files de volgende code toe:
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://(www\.)?domein.nl/.*$ [NC]
RewriteRule \.(gif|jpg)$ http://domein.nl/boosmannetje.gif [R,L]