Je online bedrijf kan alleen maar slagen als je weet hoe je problemen met de prestaties van WooCommerce oplost. Hoe sneller je e-commerce website is voor je gebruiker, hoe beter hun online winkelervaring. En hoe positiever hun ervaring als gebruiker is, hoe groter de kans dat ze (nog) een bestelling plaatsen. En dat vertaalt zich door naar meer sales en meer omzet. Daarom zijn de snelheid en prestaties van je WooCommerce webshop de kern van je succes.
Onderzoek laat zien dat 46% van de gebruikers niet terugkeert naar een website die niet goed presteert. Om die reden lopen webshops vaak potentiële verkopen mis door problemen met hun snelheid of laadtijden. Wanneer je website niet maximaal geoptimaliseerd is, kan je zelfs nog meer omzet mislopen tijdens seizoenspieken in je verkeer op feestdagen zoals Black Friday en Cyber Monday, of in de drukke decembermaand.
Alhoewel je allerlei technieken kan gebruiken om je e-commerce website sneller te maken, kan het best lastig zijn om snel een acuut probleem in de prestaties van je website op te lossen. Dit vereist namelijk onder meer het proactief monitoren van de algehele staat van je website. En dat is precies waar een Application Performance Monitoring tool zoals Kinsta APM je mee kan helpen. Een APM is een tool die de prestaties van een toepassing voor je in de gaten houdt.
In dit artikel lees je over de verschillende onderdelen van een e-commerce site, waarom je een APM tool nodig hebt om de prestaties van je webshop in de gaten te houden, en hoe je de Kinsta APM kan gebruiken om de prestaties van je WooCommerce website op topniveau te houden.
En onthoud dat je uiteindelijke doel is om de omzet van je winkel te verhogen. Download dus zeker ons gratis e-book; 10 manieren om je WooCommerce productpaginaconversies te verhogen.
Ben je er klaar voor? Aan de slag dan!
De verschillende onderdelen van een e-commerce website
Om een e-commerce website op maximale snelheid te laten draaien, zijn alle componenten belangrijk. Van de hostinginfrastructuur en het e-commerce platform, tot de integraties met externe software en het afrekenproces, elke stap telt.
Of je nou craft biertjes of trainingen voor drones verkoopt, een e-commerce platform zoals WooCommerce maakt het supersimpel om eenvoudig een online winkel te starten.
De diverse uitbreidingen maken daarbij het makkelijk om de functionaliteit van je webshop verder uit te breiden met essentiële componenten.
Maar hoe meer schakels je in je ketting hebt, hoe lastiger het is om de zwakste schakel te vinden. Deze grotere complexiteit verhoogt de kans op problemen met de snelheid en betrouwbaarheid van je website. Het maakt het ook lastiger om snel te reageren op acute problemen, en ze op te kunnen lossen, liefst voordat je klanten er hinder van ondervinden.
De oplossing? Het gebruik van een Application Performance Monitoring tool.
We hebben de Kinsta APM specifiek ontworpen om de prestaties van WordPress sites te monitoren, inclusief de WooCommerce winkels die gehost worden bij Kinsta.
De voordelen van Kinsta APM voor WooCommerce websites
De problemen met de snelheid of betrouwbaarheid van je WooCommerce website kunnen serieuze schade aan je online bedrijf toebrengen, op verschillende manieren. Je kan de Kinsta APM gebruiken om deze problemen te voorkomen of op te lossen. Enkele voordelen zijn bijvoorbeeld:
Meer verkopen en omzet
Snelheid is essentieel voor de winst van een e-commerce website. Om de prestaties van je website zo hoog mogelijk te houden moet je allerlei gegevens kunnen begrijpen en DevOps vaardigheden hebben. Kinsta APM maakt dit een stuk makkelijker voor jou óf je medewerkers. Het belangrijkste verschil dat de Kinsta APM voor je zal maken, zit dus in hogere sales en omzet.
Betere gebruikerservaring
Het kan lastig zijn om erachter te komen hoe tevreden je gebruikers zijn, aangezien de gemiddelde gebruiker zonder een woord te zeggen, je site verlaat. Sterker nog, het kan zijn dat ze linea recta naar je concurrent gaan. Een handig APM tool zoals Kinsta APM geeft je het inzicht in de prestaties van je website dat je nodig hebt om ervoor te zorgen dat je klanten helemaal tevreden zijn met je WooCommerce winkel.
Beperkt merkschade
In het digitale tijdperk is reputatie alles. Gebruikers hopen niet alleen dat je e-commerce website perfect functioneert. Ze verwachten ook niks minder. Wanneer ze dus onderbroken worden door een storing op je website of doordat je website te traag is, verlies je niet alleen die ene verkoop, maar ook reputatie en vertrouwen in je merk. Kinsta APM verlaagt de kans daarop door je te helpen je website zo goed mogelijk te laten presteren.
Verhoogt productiviteit en gemak
Een beter werkende website vertaalt zich direct door naar productievere medewerkers. Zo is je development-team bijvoorbeeld minder tijd kwijt aan het oplossen van problemen met prestaties. Je ondersteuningsteam hoeft minder tickets te verwerken. Je marketingteam kan meer campagnes draaien in dezelfde tijd. Kortom, iedereen is productiever en werkt prettiger wanneer de website, van voor en achter, soepel draait.
Maakt tijd vrij voor innovatie
Het experimenteren met innovatieve strategieën om je groei te versterken is één van de belangrijkste aspecten van e-commerce marketing Of je nou een developer of marketeer bent, de eenvoud van Kinsta APM zorgt voor betere samenwerking, waardoor iedereen zich kan richten op effectievere groeistrategieën. Het zorgt ook voor betere probleemoplossing, waardoor je sneller nieuwe functies kan uitrollen, met meer zelfvertrouwen.
Verlaagt de kosten voor hosting en IT-infrastructuur
Door bottlenecks voor je prestaties te vinden die je anders niet zou zien, helpt Kinsta APM je om alles uit je hostinginfrastructuur te halen wat er in zit. Het maakt het mogelijk om je WooCommerce website perfect af te stellen. Verder kan Kinsta APM problematische plugins, extensies en externe diensten detecteren, waardoor je sneller onderpresterende IT diensten kan afstoten.
Zo los je problemen met de prestaties van WooCommerce op met de Kinsta APM
Nu is het tijd om eens te kijken naar echte voorbeelden uit de praktijk om te zien hoe je Kinsta APM kan gebruiken om prestatieproblemen bij WooCommerce op te lossen.
De basics van Kinsta APM
Belangrijke dingen eerst. Voordat je je helemaal verdiept in het oplossen van problemen op je WooCommerce website met Kinsta APM, moet je eerst weten wat de verschillende termen zijn en hoe je de inzichten van de tool kan interpreteren. Om meteen te beginnen kan je een kijkje nemen op onze Kinsta APM kennisbank.
Als je meer vragen hebt over Kinsta APM, kan je ook even de Kinsta APM FAQ lezen.
De WooCommerce testwebsite en setup
Kinsta APM werkt alleen bij WordPress websites die gehost worden bij Kinsta. Voor dit artikel heb ik een WooCommerce testwebsite opgezet om de meest voorkomende problemen bij webshops te simuleren. Ik heb een echte domeinnaam gebruikt om ervoor te zorgen dat er een daadwerkelijke SSL/TSL handshake wordt uitgevoerd.
Hieronder zie je de gegevens van de testwebsite:
- Server Stack: Nginx 1.19.4, PHP 7.3.24-3, MariaDB 5.5.5
- WordPress versie: WordPress 5.5.3
- Thema: Astra Theme 2.6.1
- Belangrijkste plugins: WooCommerce 4.7.1, WooCommerce Cart Abandonment Recovery, verplichte plugins van Kinsta en Akismet Anti-spam.
Verder heb ik de website iets aangepast met custom plugins voor het laten zien van unieke voorbeelden. Het belangrijkste doel hierbij is te laten zien hoe je Kinsta APM in verschillende situaties kan gebruiken om verschillende problemen met de prestaties van WooCommerce op te lossen.
1. WooCommerce APM voorbeeld: trage externe API calls tijdens het afrekenen
Veel e-commerce websites gebruiken externe integraties om de belangrijkste processen te regelen, zoals betalingen en de verzending. Veel WooCommerce website gebruiken ook externe plugins zoals MailChimp en MailerLite voor e-mailmarketing.
Maar de externe diensten kunnen een forse impact hebben op de prestaties van je WooCommerce website. En als deze je afrekenproces vertragen, kan je dit niet negeren.
In dit voorbeeld duurde het te lang voor de website antwoordde wanneer een gebruiker een product in hun karretje plaatste. Soms duurde het zelfs meer dan 5 seconden voordat de website antwoordde. Dit zorgt voor achtergelaten winkelkarretjes en minder omzet. Tijd om het aan te pakken.
Laten we Kinsta APM eens gebruiken om het probleem te analyseren.
Om dit te doen ga je eerst naar het MyKinsta dashboard van je site, en vervolgens naar het deel Monitoring.
Klik op de knop Activeren onder Prestatie monitoring om Kinsta APM de gegevens over je website te laten verzamelen.
Mocht je Kinsta APM al eerder hebben ingeschakeld (zoals in dit voorbeeld), dan kan je de prestaties van de afgelopen tijd zien in de grafiek en in de tabel.
Nadat ik Kinsta APM heb ingeschakeld, heb ik de site getest en even gewacht totdat de data over de prestaties in het Kinsta APM dashboard verschijnen.
Het beste kan je even een minuut of 5 wachten voordat je de data gaat bekijken. Daardoor heeft Kinsta APM genoeg data over je prestaties om relevante resultaten te laten zien.
Met het dropdownmenu – links van de knop Activeren/Uitschakelen – kan je veranderen over welke periode Kinsta APM de prestatiegegevens toont.
In de grafiek Totale transactietijd zie je dat de Externe calls de meeste ruimte innemen. Dat geeft al een belangrijke indicatie dat externe diensten waarschijnlijk de oorzaak van de vertraging zijn.
Vervolgens kan je naar beneden scrollen naar de tabel Langzaamste transactie om de verzoeken en achtergrondtaken te zien die het langst duurden om uit te voeren.
Je ziet dat verzoeken naar de URL /single-product het meeste tijd kostten. Op een WooCommerce website verwijst dit endpoint naar een willekeurige productpagina.
Klik op de /single-product transactie om een selectie van de langzaamste transacties te zien.
Hier zien we dan de traagste transactie-sample 5,535.14ms kostte, oftewel meer dan 5 seconden. Dat is ruim boven wat je zou kunnen verwachten. We klikken op dit transactie-sample om meer te weten te komen.
Je ziet nu de Tijdlijn van de transactie-trace van het sample. Dit geeft je de gegevens op basis van een tijdslijn met alle processen die uitgevoerd zijn tijdens deze transactie.
Scrol naar beneden door de tijdlijn tot je de spans vindt.
Kinsta APM markeert spans die direct aandacht vereisen met de kleur rood.
In dit geval zijn dat de spans slow.payment-api.com en update_card_payment. Klik op beide spans om meer details te zien, met een volledige stack-trace en andere relevante informatie.
Door naar Span details te kijken, kan je concluderen dat het een extern HTTP verzoek is.
In Stack trace kan je alle processen zien die bij dit HTTP verzoek horen. Zo zien we dat WC_Form_Handler::add_to_cart_action hierbij betrokken is. Verder zien we ook een script dat niet in de WordPress kern zit, dat payment-api.php heet.
Schrijf deze ergens op. Maar we moeten ook nog een andere span onderzoeken.
Laten we de details erbij pakken.
Dit is waar Kinsta APM echt z’n kracht kan laten zien. Het laat alle gerelateerde processen voor deze span zien, en geeft je er ook wat context bij. Zo ziet je dat het een PHP script/functie is die update_card_payment heet, binnen de payment-api plugin.
Je hebt nu genoeg bewijs verzameld om te weten waar je kan beginnen met je probleemoplossing.
Nu zou ik verder gaan met kijken naar de payment-api plugin, en specifiek naar een PHP script of functie die update_card_payment heet.
Als jij of je medewerkers niet de technische kennis hebben om dit soort problemen op te lossen, kan je altijd een WordPress developer inhuren om dit te fixen.
Verder zou ik ook contact opnemen met de maker van de plugin om eens naar hun betalings API te kijken, aangezien deze erg traag reageert. Kinsta APM kan je zo de juiste richting opsturen om de onderliggende oorzaak van problemen met je snelheid te vinden. Wat jij verder doet met deze kennis is natuurlijk aan jou.
2. WooCommerce APM voorbeeld: traag WooCommerce admin dashboard
De prestaties van de back-end van je webshop zijn net zo belangrijk als de front-end. Een traag WooCommerce admindashboard verlaagt je productiviteit, terwijl een snelle backend je efficiëntie juist verhoogt en ervoor zorgt dat je snel kan reageren op bestellingen en vragen van klanten.
Een efficiënt WooCommerce dashboard maakt het ook mogelijk om meer zaken te regelen die belangrijk zijn voor het succes van je webwinkel, zoals digitale marketing.
Idealiter beginnen back-end optimalisaties met front-end optimalisatie, aangezien het sneller laten draaien van de front-end meestal ook de problemen aan de backend oplost. Met Kinsta APM ben je echter niet meer afhankelijk van dergelijke vuistregels en giswerk. Je ziet namelijk precies hoe je hele website functioneert, en je kan dus direct specifieke problemen identificeren.
In dit voorbeeld is het admindashboard nogal traag voor de admin en winkelmanagers. Dat is niet ideaal voor de dagelijkse werkzaamheden bij de online winkel.
Laten we Kinsta APM eens gebruiken om het probleem te analyseren.
Nadat ik Kinsta APM inschakelde, wachtte ik 15 minuten voordat ik met de data over de prestaties aan de slag ging. Tijdens het wachten heb ik de WooCommerce back-end net zo gebruikt als ik dat normaal doe.
De grafiek Overall transaction time geeft aan dat PHP processen het meeste tijd in beslag nemen, gevolgd door externe calls.
Als we kijken naar de tabel Slowest transactions krijgen we een beter idee van welke verzoeken de meeste tijd gebruiken.
In de grafiek hierboven zien we duidelijk dat twee transacties de meest tijd opvreten: /wp-admin/admin-ajax.php en /wp-admin.
Een hoog Admin-Ajax verbruik is één van de meest voorkomende problemen bij WordPress sitebeheerders. Laten we deze transactie eens verder bekijken.
Alle admin-ajax.php transactie-samples hadden bijna dezelfde duur. Maar een transactieduur van meer dan 10 seconden is absurd hoog.
Laten we de traagste sample eens bekijken.
Scrol naar beneden naar de Tijdlijn van transactie-trace om de spans te zoeken die het belangrijkst zijn. In de meeste gevallen zoals Kinsta APM deze ook markeren met rood.
Maar dat lukt niet altijd, zoals ook in dit geval:
Je ziet twee spans met extreem hoge tijden: snail_admin_refresh PHP proces en suspicious-link.com GET extern HTTP verzoek.
Door de details van de span te bekijken zal je bij de plugin uitkomen die dit PHP proces uitvoert. In dit geval is het een plugin met de naam snail-admin-refresh-notice. Ik heb deze speciaal geschreven om een lelijke notificatie in het WordPress dashboard te geven, net zoals sommige populaire WordPress plugins dat doen.
Als we naar de stack-trace van de span suspicious-link.com GET kijken, zie je dat deze samenhangt met dezelfde plugin.
In dit voorbeeld is de oorzaak van de vertraging meteen duidelijk. Maar dat is niet altijd het geval. Wanneer meerdere gebruikers het WooCommerce dashboard tegelijkertijd gebruiken, kan dit de resources van de server nog zwaarder belasten. Hierdoor kan het dashboard zelfs ontoegankelijk worden voor sommige gebruikers.
Door je de onderliggende oorzaak van slechte prestaties te helpen vinden, helpt Kinsta APM je om je WooCommerce dashboard altijd zo goed mogelijk te laten draaien.
3. WooCommerce APM voorbeeld: trage winkel- en productpagina’s
Gebruikers wachten niet tot trage pagina’s zijn geladen, zeker niet wanneer dit een winkel- of productpagina is. Volgens het onderzoek van Google naar gebruiksgemak verlaat de gemiddelde gebruiker een pagina wanneer het meer dan 2,5 seconden kost om te laden.
Er kunnen allerlei redenen zijn waarom een winkel- of productpagina van WooCommerce langzaam laadt:
- De winkelpagina moet teveel producten in één keer laden.
- De grootte van de productpagina is te groot door niet-geoptimaliseerde afbeeldingen, scripts, externe verzoeken, etc.
- De winkel- of productpagina laadt wellicht een hoop dynamische content die niet gecachet kan worden bij elke pagina.
- Een plugin of het thema gebruikt custom scripts voor elke productpagina om extra functies mogelijk te maken (bijvoorbeeld counters met keren gedeeld, of gerelateerde producten).
In dit voorbeeld zullen we trage productpagina’s analyseren op onze WooCommerce testsite. Het duurt abnormaal lang voordat ze reageren, wat meestal een ramp betekent voor je conversies.
Laten we Kinsta APM inschakelen en eens wat productpagina’s proberen te laden.
Ik test ze tenminste 5 minuten voordat ik de data ga bekijken.
Op de grafiek Totale transactietijd time zie je een scherpe toename in tijd voor de MySQL query’s. En als we naar de tijdstippen kijken is dat allemaal recent.
Laten we een kortere periode kiezen zodat we kunnen focussen op deze recente transacties. Hierdoor worden alle oudere prestatiegegevens buiten onze huidige analyse gehouden.
Laten we nu eens kijken naar de tabel Langzaamste transacties om te zien welke verzoeken het meeste tijd verbruiken.
Zoals te verwachten, verbruikt de /single-product transactie het grootste deel van de tijd. WooCommerce gebruikt dit verzoek wanneer een gebruiker naar een specifieke productpagina gaat.
De langste duur (136,516.63 ms) is absurd hoog.
Laten we dat eens beter bekijken.
Ik klik op het langzaamste sample om meer informatie te krijgen. Door te scrollen in de Tijdlijn van transactie-trace krijgen we een beter idee van de oorzaak van deze snelheidsproblemen.
Je ziet dat Kinsta APM hier het probleemgeval heeft gemarkeerd met rood. Op basis van het icoontje zie je dat het een databasequery is.
Kinsta APM analyseert de stack-trace van deze span en identificeert de plugin voor je die deze problematische database query aanmaakt.
In dit geval heet de plugin woocommerce-related-products. Dit is een WooCommerce uitbreiding die dynamisch een slider maakt met gerelateerde product binnen elk productpagina, op basis van diverse criteria.
Onder Span details zie je ook het database-statement dat ik in deze WooCommerce uitbreiding hebt toegevoegd om dit probleem te simuleren.
Voor grote WooCommerce winkels met honderden (of duizenden) producten, kan het introduceren van een nieuwe functies of het veranderen van een huidige functie, dergelijke onverwachte problemen veroorzaken. Problemen zoals dit zie je vrij vaak. Kinsta APM maakt het makkelijker om dit soort zaken te analyseren en op te lossen.
Samenvatting
We leven in een bliksemsnelle wereld, waar alles 24/7 beschikbaar is. Of je nou een kleine mkb’er bent of een grote onderneming, WordPress en WooCommerce maken het supersimpel om dingen online te verkopen. En je kan snelle thema’s vinden voor allebei (snelle WordPress thema’s en snelle WooCommerce thema’s).
De gebruikerservaring is van vitaal belang voor het succes van je online winkel, en dat hangt sterk af van de prestaties van je website. Maar zoals we in dit artikel hebben laten zien kan het moeilijk zijn om de prestaties van een WooCommerce winkel te monitoren.
In dit artikel heb je geleerd hoe je Kinsta APM kan gebruiken om WooCommerce prestatieproblemen op te lossen, zoals lange API calls, een traag dashboard, of langzame databasequery’s. Doordat je niet langer naar de oorzaak van je problemen hoeft te gissen, zorgt Kinsta APM ervoor dat je problemen snel kan opsporen en oplossen.
Ga meteen aan de slag met Kinsta APM, zodat je weer net een stapje voorloopt op je concurrenten in de competitieve markten van tegenwoordig!
Laat een reactie achter