10 Tips om je site sneller te maken

Nate Koechley en zijn collega’s bij Yahoo! UI zijn al een tijdje bezig aan een onderzoek naar hoe ze hun websites sneller kunnen maken. Zijn sessie op Kings of Code zat dan ook boordevol handige tips die we hier even op een rijtje zetten. Er zit geen mirakeloplossing tussen maar vele kleintjes maken één groot.

Nate focuste vooral op de frontend omdat die meer dan 90% van een website in beslag neemt terwijl er meestal enkel wordt gesleuteld aan die 10% backend. Toch is snelheid op zich niet het belangrijkste, zolang de website maar sneller lijkt voor de bezoekers.

  1. Zorg ervoor dat de je Expires headers goed zijn ingesteld. Wanneer je optimaal gebruik maakt van de browser cache kan je gigantisch veel requests vermijden waardoor je site sneller wordt. Kijk maar eens naar de grafiek: 17 Requests zijn te samen goed voor 157kb. Wanneer we de Expires headers goed instellen gebeuren er nog slechts
    * 3 requests (ongeveer 3.6kb).* Jammer genoeg werkt de cache in de praktijk niet zo goed als op papier. Ongeveer een 20% van de terugkerende bezoekers zal met een lege cache op je site komen.
  2. Cookies zorgen voor vertragingen. Hoe groter de cookie, hoe meer vertraging er zich zal voordoen. We spreken hier wel over milliseconden, maar denk aan ons motto: vele kleintje…
  3. Zorg voor minder hits. Je kan bijvoorbeeld met CSS Sprites werken om verschillende afbeeldingen als één afbeelding te versturen, maar ook minder JavaScript en CSS bestanden gebruiken.
  4. Verstuur je bestanden met GZip. De overgrote meerderheid van de browsers ondersteunt GZip en de invloed hiervan op de snelheid is groot. GZip dus je HTML maar ook je CSS, JavaScript, XML… Denk eraan dat dit enkel met tekstbestanden kan, dus geen afbeeldingen en PDF’s.
  5. Zet je CSS bovenaan de pagina. Zo vermijd je de gevreesde Flash of Unstyled Content, en belangrijk gebruik de <link> tag en niet @import. Dat is gewoon een pak sneller.
  6. Zet je JavaScript onderaan. JavaScript moet eerst worden uitgevoerd voor er verder kan worden ingeladen, het houdt dus de rest van de pagina op.
  7. JavaScript? Haal het door een Minifier. Je kan de grote van je JavaScript bestanden gemakkelijk een kwart kleiner maken door het door een Minifier te halen. Zie JSMin of Packer.
  8. Vermijd redirects. Gebruik ze enkel wanneer ze absoluut nodig zijn. Redirects zorgen voor een extra Expires headers en extra oponthoud.
  9. Vermijd dubbele scripts. Internet Explorer gaat een dubbel script sowieso terug opnieuw oppikken, de andere browsers zijn iets vergevingsgezinder.
  10. Schakel ETags uit. Tenzij je weet hoe je ETags kan gebruiken om je site sneller te maken schakel je ze beter uit. Een slecht ingestelde ETag zal ervoor zorgen dat er geen bevestiging kan worden gegeven over het bestaan van de cache.

Eigenlijk hoort er nog een extra tip bij: Download de Yslow plugin voor Firefox. Deze vertelt je waar je nog iets kan verbeteren om je site sneller te maken.

Leave A Comment




    Leave a Reply

    Your email address will not be published. Required fields are marked *