Do's en dont's voor meer snelheid & betere hosting
Wat gaan we doen?
Wie ben ik?
Waarom is snelheid belangrijk?
Hoe kan ik zelf m’n snelheid meten?
Hoe kan ik zelf m’n site sneller maken?
Hoe kan ik m’n hosting beoordelen?
Wie ben ik?
Gijs Hovens
Sinds 2008 WordPress gebruiker
Online Marketing
Twitter: @ghovens / @savviiHQ
Mail: [email protected]
Savvii?
Genoeg reclame, meer weten? Vraag ons.
Ik ben hier
Ik ook
Waarom snellere site?
Waarom een snellere site?
Waarom een snellere site?“You may have heard that here at Google we're obsessed with speed, in our products and on the web. As part of that effort,
today we're including a new signal in our search ranking algorithms: site speed. Site speed reflects how quickly a website
responds to web requests.”
bron: http://googlewebmastercentral.blogspot.nl/2010/04/using-site-speed-in-web-search-ranking.html
Waarom een snellere site?
bron image: http://moz.com/blog/how-website-speed-actually-impacts-search-ranking
Hoe snel is snel genoeg?
Google: First Byte Time van 200ms
Akamai: Load Time van <2 sec.
Regel: 1e content zichbaar binnen 1 sec.
Meten is weten
webpagetest.org tools.pingdom.com
tig locaties 3 locaties
tot 9 runs 1 run
originele exp. no-cache
Hoe interpreteer je de resultaten?
First Byte Time: 1e byte van de html terug
● DNS lookup● Connectie opzetten● Wachten….● First Byte terug (html)● Assets ophalen
DNS Lookup Connectie opzetten Wachten...
1st byte HTML
Assets ophalen
Hoezo wachten?
Webserver: Ontvangst GET Request
Webserver: doorzetten naar process manager (PHP-FPM)
PHP-FPM: Database queries
PHP-FPM: Genereren HTML
Webserver: HTML Response (200 OK)
Wat kost nu tijd?
Geen page-caching:
‘wait time’
Wat kost nu tijd?
Wel page-caching:
‘transfer time’
Hoe kan het dan sneller? Easy-way
Makkelijk: Caching (proxy cache, w3total cache)
maar….
Kan niet altijd (winkelmandjes, ingelogde gebruikers) & is symptoombestrijding
Wat is caching?
Hoe kan het dan sneller? Hard-way
Moeilijker: Optimaliseren applicatie
Simpele tips:
● Less is more (plugins, css, JS)● Geen logica is sneller (GA hardcoded in
thema)
Hoe herken je langzame plugins?
Moeilijk, maar je kunt hier op letten:
● Schrijven veel data in WP-options tabel● Gebruiken ingewikkelde logica (gerelateerde
posts bijv.)● Doen veel kleine taken snel achter elkaar
(broken link checkers, backup plugins)
Hoe verbeter je transfer time?
Compressie plaatjes (photoshop, smush.it)
Verminderen plaatjes (sliders)
Minify & combine CSS
Minify & combine JavaScript
Sprites
Voor Minify
Na Minify
Hoe herken je snelle hosting?
Webserver
apache nginx
process based event based
elke ‘klant’ na elkaar even aan de kant stappen tot ‘bestelling’ klaar is
wordt langzaam onder hoge load sneller onder hoge load
vaak zelf door gebruiker te tunen (.htaccess) tuning door hosting partij
Hoe herken je snelle hosting?
Hoe herken je snelle hosting?
Server: nginx
Hoe herken je snelle hosting?
Keep-alive: enabled
Hoe herken je snelle hosting?
Compressie: enabled
Hoe herken je snelle hosting?
Caching: leverage browser-cache
Caching: varnish, memcached, XCache
Hoe herken je snelle hosting?
Bij SSL: SPDY, OSCP stapling, STS headers
Qualys SSL Test