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: gijs@savvii.nl

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

http://www.webpagetest.org/result/141105_C2_569eee19cc6e57be0c3a6dc9cef54f7e/

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

Meer informatie?

Neem contact met ons op via savvii.nl!