Site tuning (WordPress, 2022): verschil tussen versies

Uit De Vliegende Brigade
Naar navigatie springen Naar zoeken springen
Regel 48: Regel 48:
 
* De ''Fully Load Time'' kan sterk variëren en is afhankelijk van bv. third-party code. Meestal is deze 1-2 seconde hoger dan the ''Load time''. Voor WooCommerce-sites kan dit al snel 3-5s hoger zijn
 
* De ''Fully Load Time'' kan sterk variëren en is afhankelijk van bv. third-party code. Meestal is deze 1-2 seconde hoger dan the ''Load time''. Voor WooCommerce-sites kan dit al snel 3-5s hoger zijn
 
* Sommige WooCommerce-pagina's kunnen deze scores niet halen, bv. ''cart'' en ''checkout'' ivm. verwerking van data.
 
* Sommige WooCommerce-pagina's kunnen deze scores niet halen, bv. ''cart'' en ''checkout'' ivm. verwerking van data.
 +
 +
=== Backend ===
 +
 +
Het is moeilijk om iets zinnigs te zeggen over de laadtijden van ''backend-pagina's'' (alle pagina's die beginnen met ''/wp-admin/''), omdat deze meestal niet gecached worden en omdat er meer rekenwerk aan te pas komt:
 +
 +
* Plugin-pagina: Het kan snel 5-20s vergen voor de plugin-pagina om op te bouwen, omdat veel plugins eerst verbinding zoeken met licentie-servers
 +
* Als je in ''Screen options'' hebt ingesteld dat er veel producten of veel orders op een pagina getoond moeten worden, kost dat tijd
 +
* Richtlijn: 0,8-3s voor backend-pagina's, als er niet iets bijzonders aan de hand is.
  
 
== Cr ==
 
== Cr ==

Versie van 21 jan 2021 11:15

Dit artikel gaat over het optimaliseren van de laadsnelheid, of performance van WordPress-sites, in het bijzonder voor WooCommerce-sites met duizende producten en uitgebreide taxonomieën. Mocht je je afvragen of WordPress wel geschikt is voor dergelijke sites: Er bestaat zelfs een vervanging voor de standaard-database-klasse, om overweg te kunnen met meerdere database-servers - Dit is uiteraard geen garantie dat WordPress geschikt is voor enige specifieke site, maar het geef me vertrouwen dat WordPress serieus wordt gebruikt voor grootse zaken.

Twee geweldige artikelen, als optimalisatie nieuw voor je is:

Het gaat om de laadsnelheid

Er bestaan een hoop tools die op de meest geweldige manieren allerlei fantastische dingen meten. Sommige tools vertalen dat in één of meer tijdwaardes, terwijl andere tools dat vertalen naar scores.

Volgens mij komt het uiteindelijk neer op wat intuïtief de laadsnelheid is. Datgene wat je zou meten, als je met een stopwatch op een 'neutrale plek op het internet' bijhoudt hoe lang het duurt om een pagina te laden: Het is altijd duidelijk wanneer een pagina geladen is, en het is ook altijd duidelijk wanneer het laden is begonnen - Namelijk op het moment dat je op de betreffende knop of link klikt. Dit is ook precies wat bezoekers ervaren.

Kwantitatief

  • Medewerker Internet Today (2016): Alles onder de 2s is ok, maar alles boven de 1,3s moet een goede reden hebben
  • Medewerker Google Partners (2017?): Alles boven de 3s is problematisch, en moet je verhelpen.

Wat ik aanhoud [1]:

  • Max. 2s - Alles hierboven is problematisch en moet verholpen worden
  • Streef naar max. 0,5s.

Google Core Web Vitals

Google heeft een handjevol criteria onder de naam Core Web Vitals. Ik heb niet alle details paraat, maar dit is zo'n beetje wat goede scores zijn:

Entiteit Opmerkingen
TTFB Time To First Byte: 0,1-0,2s
FCP First Contentful Paint [2], [3]
LCP Largest Contentful Paint: Max. 2,5s. Onder 1s is snel
Load time aka. Document complete, Onload time - 1,5-3s

Opmerkingen:

  • De Fully Load Time kan sterk variëren en is afhankelijk van bv. third-party code. Meestal is deze 1-2 seconde hoger dan the Load time. Voor WooCommerce-sites kan dit al snel 3-5s hoger zijn
  • Sommige WooCommerce-pagina's kunnen deze scores niet halen, bv. cart en checkout ivm. verwerking van data.

Backend

Het is moeilijk om iets zinnigs te zeggen over de laadtijden van backend-pagina's (alle pagina's die beginnen met /wp-admin/), omdat deze meestal niet gecached worden en omdat er meer rekenwerk aan te pas komt:

  • Plugin-pagina: Het kan snel 5-20s vergen voor de plugin-pagina om op te bouwen, omdat veel plugins eerst verbinding zoeken met licentie-servers
  • Als je in Screen options hebt ingesteld dat er veel producten of veel orders op een pagina getoond moeten worden, kost dat tijd
  • Richtlijn: 0,8-3s voor backend-pagina's, als er niet iets bijzonders aan de hand is.

Cr

Inventaris

Denk bij optimalisatie zoal aan:

  • Meten van performance → Site-snelheid
  • Site-optimalisatie: Dit is een verzamelterm voor van alles en nog wat, waaronder het uitzetten van plugins die je niet gebruikt
  • Caching - wo. object caching, CDN's & caching-servers zoals Varnish
  • Content offloading
  • Server-optimalisatie: PHP-versie, hardware-specs, db- & php-optimalizatie, meer?
  • Gebruik van meerdere servers
  • Afbeeldingen: WordPress lijkt afbeeldingen niet vanzelfsprekend optimaal te schalen, zoals Drupal dat doet. Daarnaast worden geïmporteerde afbeeldingen gekopiëerd naar meerdere presets, die misschien niet allemaal nodig zijn
  • Taxonomieën: De wijze van implementatie van taxonomieën, kan een flinke impact hebben op de performance van een site.
  • Uploads: Ik vermoed complicaties als duizende afbeeldingen in dezelfde map worden bewaard

Taxonomieën & performance

Tests in de zomer van 2020 wezen uit:

  • Catagorieën lijken geen impact te hebben op performance, zolang je ze niet gebruikt als filters, maar alleen als shopping-pagina's
  • Categorieën hebben een flinke impact op performance, op het moment dat je categorie-filters gebruikt op winkelpagina's
  • Attributes hebben een flinke impact op de performance van winkelpagina's, zelfs als er amper gebruik wordt gemaakt van filters.

Dit was getest met een site met deze specs:

  • 16.000 Producten, 32.000 afbeeldingen
  • 500 hoofdcategorieën (?)
  • Duizenden kenmerken (?)
  • Geen posts en misschien vijf gewone pagina's

Afbeeldingen - Originele bestanden te zwaar?

Is 111kb acceptabel voor een afbeelding van 892x902? Naast het origineel, het bewerkte exemplaar, dat nog maar 20kb groot is. Ik denk dat het antwoord duidelijk is

WordPress lijkt originele afbeeldingen niet te verkleinen, en als zodanig te gebruiken (of ik gebruik geen afbeeldingen die zo bizar groot zijn, dat WordPress ze aanpast). Voorbeeld van zo'n afbeelding (jpg):

  • 892x902
  • 111k.

Is 111k een redelijke grootte voor een bestand van 892x902? Ik denk van wel, maar ik kon het antwoord zo snel niet online vinden. Een manier om te checken: Op imgonline.com zo'n afbeelding uploaden, en reduceren tot 20k, met behoud van de resolutie

Afbeeldingen - Alle presets relevant?

Als je afbeeldingen upload, worden naast de originele afbeeldingen, nog een aantal presets gegenereerd. Afhankelijk van het soort site, kan dit aantal variëren. Een standaardsite heeft er al snel vier:

* thumbnail      150 pixels vierkant
* medium         300 pixels breed
* medium_large   768 pixels breed
* large          1024px pixels breed

Voorbeeld van een webwinkel, waarin er blijkbaar zeven presets zijn:

2,9k  - image-01-100x100.jpg
4,8k  - image-01-150x150.jpg - Thumbnail
13k   - image-01-298x300.jpg
14k   - image-01-300x302.jpg - Medium
23k   - image-01-440x443.jpg
36k   - image-01-600x604.jpg
51k   - image-01-768x773.jpg - Medium_large
111k - image-01.jpg - 892x902 (afmetingen variëren enigszins)

Merk op dat Large ontbreekt. Vermoedelijk omdat de geüploade afbeelding kleiner is dan dat formaat.

Uitbesteden

Geen zin om dit zelf te doen? Te moeilijk? Weet niet? Overig? Ongetwijfeld kan dat. In de loop van 2020 heb ik een enkele keer terloops online gezocht naar specialisten op dit vlak, maar zonder overtuigende resultaten. Hierbij opnieuw een poging. Het is nu januari 2021

Algemeen & intermediairs

WooCommerce-specialisten, maar niet per se performance-specialisten

Specialisten

Fiverr:

Zie ook

Bronnen