Onder de motorkap van de HondenPage

Hoi hoi, de laatste tijd is de layout van de hondenpage aangepakt maar ook onder de motorkap is er veel veranderd. Het leek me leuk om dit even uit te leggen.

Voorheen was de gemiddelde opbouwtijd van deze pagina 2,6 seconden. Dat is nu terug gebracht tot 1,6 seconde. Hiervoor heb ik een aantal aanpassingen gemaakt. De opbouwtijd is overigens wat anders dan de laadtijd van de pagina. Een heel ingewikkelde pagina kan snel laden maar toch langzaam opbouwen.

1. Gecombineerde stylesheets.
Stylesheets zijn losse bestanden die een browser gebruikt om de opmaak van een pagina te bepalen. Er staat bijvoorbeeld in dat de hondenpage 1128px breed is, de achtergrondkleur wit, etc etc etc. Hiervoor gebruikte ik per pagina verschillende stylesheets. Nu is dat teruggebracht tot 1, geoptimaliseerde stylesheet per pagina. Dat scheelt per pagina een aantal verzoeken naar de server waardoor de pagina sneller laad.

2. Geoptimaliseerde afbeeldingen
De afbeeldingen die je op de HondenPage ziet zijn verder geoptimaliseerd. Dat scheelt vaak wel de helft van de bestandsgrootte.

3. Gecombineerde javascripts
Javascript is een taal die jouw browser snapt, hiermee kan ik dus jouw browser een heel klein beetje programmeren. Op het moment dat jij op een link klikt kan ik bijvoorbeeld met javascript er voor zorgen dat niet heel de pagina herladen wordt maar slechts een klein deel. De editor voor het forum gebruikt ook veel javascripts. Door al deze javascipts te comnbineren en te verkleinen haal ik ook een behoorlijke snelheidswinst

4. Uitgesteld javascript
Vroeger was het heel normaal om javascript al aan het begin van de pagina te laden. Dat heeft het voordeel dat je altijd, ergens halverwege de pagina zeker weet dat het javascript dat je wilt gebruiken ook beschikbaar is op dat punt. Het nadeel is dat jouw browser eerst het javasccript binnen moet halen voordat het de pagina op gaat bouwen. zonde van de tijd dus. Daarom laad ik nu al het javascript pas aan het einde van de pagina.
Relatief onbelangrijke javascripts (zoals de facebook button) worden zelfs helemaal uitgesteld totdat jouw browser helemaal klaar is met het laden van de pagina.

5. Snellere layout
De huidige layout laadt als allereerste het belangrijkste gedeelte van de hondenpage. De bovenkant en het midden. Pas daarna worden de zijbalken ingeladen. Dat zorgt er voor dat je eigenlijk direct kan beginnen met het bekijken van de pagina

6. Minder advertenties
Het aantal advertenties voor vaste bezoekers is een heel stuk teruggebracht. Na een aantal pagina's zie je nog maar in 50% van de gevallen een advertentie. Dat is mooit want advertenties kosten ook tijd om te laden !


Volgens mij is alles uitgebreid getest en werkt het heel behoorlijk. Mocht je nog wat tegenkomen ververs dan eerst de pagina. Is het dan niet opgelost stuur mij dan een pb, dan los ik het op.


De komende tijd ga ik er voor zorgen dat de hondenpage nog beter te lezen wordt op mobieltjes (je kunt altijd met je mobiel naar m.hondenpage.com gaan !) en tablets !


Geniet van deze mooie dag !


Arjen

Volgens mij heb ik destijds de verkeerde opleiding gekozen  Ik vind dit soort dingen altijd reuze intressant!

Bedankt voor de extra snelheid en geniet van het zonnetje.

Ik merk wel degelijk verschil, zelfs op mijn smartphone!
Good job!

Super weer! Je bent er altijd maar druk mee bezig, Arjen! En dat allemaal voor ons, hondengekken
Toppie

Het zegt me helemaal niks haha!
Ik ben niet zo'n wizzkid, maar minder reclame is wel fijn

Qua snelheid weet ik het niet, ik heb ook een nieuwe laptop die sowieso een stuk sneller is dan mijn hoogbejaarde model van hiervoor.

Good job in ieder geval, ondanks dat het me weinig zegt