Onderhoud & beheer

Performance

Performance is een net woord voor snelheid: hoe vlot je site reageert op wat een bezoeker doet. Dat kun je meten, tot op de milliseconde. Niet op gevoel, en niet met één cijfer uit een testsite, maar met de tijden die je echte bezoekers op hun eigen telefoon meemaken.

Wat is performance-optimalisatie?

De tijd lekt bijna altijd op drie plekken weg. Foto's die veel groter worden binnengehaald dan ze getoond worden, zoals een vakantiekiek van vier megabyte in een vakje van een paar centimeter. Scripts van anderen die achter elkaar in de rij staan te wachten, zoals je cookiemelding en je chatvenster. En een site die tijdens het opbouwen van één pagina tientallen keren dezelfde vraag aan de database stelt.

Wat een seconde winst je oplevert, verschilt per site. Daarom nemen we geen mooi getal uit een onderzoek over, maar meten we bij jou. Voor en na, met dezelfde meetlat.

Wat een snellere website je oplevert

Performance is geen doel op zich. Het haalt redenen weg om weg te klikken. Op vier plekken zie je dat terug in je eigen cijfers.

Minder mensen die wegklikken: Een pagina die binnen een seconde iets laat zien, houdt mensen vast die anders teruggaan naar Google. Vooral op een telefoon met matig bereik, en dat is bij de meeste sites die we meten het grootste deel van het verkeer.

Google vindt het ook fijn: Google kijkt naar je laadtijd en of je pagina niet staat te springen tijdens het laden. Die cijfers staan in je Search Console.

Een lagere rekening voor je server: Een site die minder van de server vraagt, heeft minder server nodig. Bij drukke sites verdient een deel van het werk zich terug in je maandbedrag.

Je eigen mensen wachten minder: Snelheid geldt ook achter de inlog. Iemand die bij het opslaan van elke pagina vijf seconden wacht, is die tijd elke dag opnieuw kwijt.

Voor wie is dit

Aan je performance werken loont zodra bezoekers je site op hun telefoon gebruiken, en er iets te winnen valt bij aanvragen, aanmeldingen of bestellingen.

  • Je site voelt traag op een telefoon, terwijl het op je laptop prima gaat
  • Google meldt in je Search Console dat je pagina's te traag zijn
  • Je webshop wordt precies traag op het moment dat er een actie loopt
  • Je beheeromgeving laat je seconden wachten als je een pagina opslaat
  • Je hebt een snelheidsplugin geïnstalleerd en het maakte nauwelijks verschil

Wat je krijgt

  • Een meting vooraf bij je echte bezoekers, niet alleen een cijfer uit een testsite
  • Foto's in een modern bestandsformaat, op de maat waarop ze getoond worden
  • Pagina's die worden onthouden in plaats van steeds opnieuw opgebouwd
  • De zware zoekopdrachten in je database, opgespoord en anders geschreven
  • Een overzicht van alle scripts van anderen, met per stuk wat hij aan tijd kost
  • Een meting achteraf met dezelfde meetlat, zodat je ziet wat het opleverde

Hoe we het bouwen

Eerst meten waar de tijd blijft. We beginnen met de tijden van je eigen bezoekers en een overzicht van wat de server per pagina staat te doen. Daar komt bijna altijd één ding uit dat veel zwaarder weegt dan de rest, en dat is zelden het ding waar iedereen naar wees.

Dan snoeien, in de goede volgorde. We pakken aan wat de meeste winst per uur werk oplevert. Meestal foto's, een handvol zware zoekopdrachten, en twee scripts die niets nuttigs doen maar wel iedereen laten wachten.

En dan vastzetten. Tot slot spreken we een grens af: wordt een pagina trager dan dat, dan valt het op voordat hij live gaat. Zonder die grens sluipt de performance er binnen een jaar weer uit, met de beste bedoelingen, één plaatje tegelijk.

Wat kost performance-optimalisatie?

Aan de performance van een bedrijfssite werken is een afgebakende klus. Daar zit de meting vooraf in, het werk zelf, en de meting achteraf.

Bij een webshop of applicatie met koppelingen loopt dat op. De winst zit daar niet in foto's, maar in het onthouden van pagina's en in het aantal keren dat je site tijdens het laden een ander systeem bevraagt.

Het daarna vasthouden kost weinig. Dat zit in je onderhoud, waarin we de meting herhalen en aan de bel trekken zodra het wegzakt.

Waarom Mediavisie Web

Wij meten eerst en bouwen daarna. Dat klinkt logisch, maar performance wordt meestal verkocht als een pakketje maatregelen zonder dat iemand heeft gekeken waar de tijd bij jou blijft. Dan betaal je voor werk aan onderdelen die je probleem niet waren.

We bouwen en beheren zelf, dus we kunnen ook in de code van je site. Wie alleen kant en klare uitbreidingen mag installeren, blijft bij een zware zoekopdracht steken in symptomen.

En je krijgt de meting mee, in cijfers die je zelf kunt nakijken. Geen groen vinkje uit een tooltje, maar de tijden die je bezoekers echt meemaakten.

Waar je op moet letten

Een deel van je laadtijd is niet van jou. Cookiemeldingen, chatvensters, meetscripts en advertenties komen van buiten. Wij meten precies wat ze kosten, maar het gesprek erover voer je met de partij die ze erop heeft gezet. En reken er niet op dat een snellere site vanzelf meer omzet oplevert. Snelheid haalt een reden weg om af te haken, meer niet. Is je aanbod onduidelijk, dan is het straks alleen sneller onduidelijk.

Wat het kost

Dezelfde pagina, andere bagage

Twee keer hetzelfde ontwerp op een middelmatige telefoon. Het verschil zit niet in de code maar in wat er meekomt.

Met alles erop

0,0 s

  • Cookiebanner
  • Chatwidget
  • Drie trackers
  • Ongeoptimaliseerd beeld
  • Vier lettertypen

Opgeruimd

0,0 s

  • Beeld in AVIF
  • Twee lettertypen
  • Eén tracker, uitgesteld

Nagespeeld op basis van wat deze onderdelen gemiddeld kosten, geen live meting.

De grootste winst

Hetzelfde beeld, drie keer opgeslagen

Beeld is bijna altijd het zwaarste op een pagina. Zelfde foto, zelfde afmeting, alleen een ander formaat.

JPEG

0 kB

Wat er meestal wordt geüpload

WebP

0 kB −60%

Overal ondersteund sinds 2020

AVIF

0 kB −80%

Kleinst, iets trager te maken

De techniek eronder

Alle techniek

Waar we het mee bouwen.

  • Meten

    Lighthouse

    Meet snelheid, toegankelijkheid en techniek per pagina. Draait bij ons automatisch mee, niet één keer bij oplevering.

  • Meten

    PageSpeed Insights

    De cijfers waar Google zelf op stuurt, gemeten bij echte bezoekers en niet alleen in het lab.

  • Netwerk

    Cloudflare

    Ervoor als schild en als versneller. Vangt aanvallen af en levert bestanden vanaf een punt bij je bezoeker in de buurt.

  • Cache

    Redis

    Houdt vast wat net is uitgerekend. Scheelt bij portalen en webshops het meeste wachten.

  • Server

    Nginx

    De webserver ervoor. Doet het uitserveren van bestanden en de cache voordat PHP eraan te pas komt.

  • Bouwstap

    esbuild

    Bundelt de voorkant per sjabloon, zodat een pagina alleen laadt wat hij nodig heeft. De hele bouw duurt milliseconden.

Werkwijze

Hoe we het aanpakken.

Van het eerste gesprek tot doorbouwen na livegang. Vier fases, en je weet bij elke fase wat er af is en wat er nog komt.

  1. 1 tot 2 weken

    Uitzoeken

    Wat er moet komen en wat er al ligt

    We brengen in kaart welke systemen mee moeten, wie het straks beheert en waar het vorige traject op vastliep. Daar komen de uitzonderingen boven water die later de planning bepalen.

    Lees verder over Uitzoeken
  2. Eén week

    Afbakenen

    Van wensenlijst naar een plan met een prijs

    We knippen het werk in stukken die los opgeleverd kunnen worden, en zetten er een prijs en een volgorde op. Daarbij spreken we af wat er in de eerste versie zit en wat later komt.

    Lees verder over Afbakenen
  3. 6 tot 12 weken

    Ontwerpen en bouwen

    Eerst de schermen, dan de techniek eronder

    Je kijkt vanaf de eerste week mee op een testomgeving. We leveren in rondes op, te beginnen met het deel dat het meeste werk uit handen neemt, zodat je stuurt op wat je ziet.

    Lees verder over Ontwerpen en bouwen
  4. Doorlopend

    Doorbouwen

    Na livegang begint het pas

    Updates, bewaking en nieuwe functies, met een vast aanspreekpunt dat je project kent. We meten wat er gebruikt wordt, en dat bepaalt waar we het volgende kwartaal aan werken.

    Lees verder over Doorbouwen

Wij werken onder andere voor

Aan de slag

Iets te bouwen?

Vertel wat er moet komen. We denken mee over techniek, haalbaarheid en wat het kost, ook als het plan nog niet rond is.

Een project bespreken
Ontdek jouw mediavisie