Hastighed er lige med penge for et e-handelssite. Jo hurtigere din side loader, jo bedre bliver købsoplevelsen. En bedre brugeroplevelse betyder forbedret SEO, øget ROI og gladere kunder. Det fører i sidste ende til større omsætning og overskud.
Shoppere i dag forventer billeder og videoer i høj opløsning, live chat, brugeranmeldelser, lagerbeholdning i realtid, personalisering og et væld af andre dynamiske værktøjer.
Online-shoppere har et kort opmærksomhedsspænd. Derfor er alle de funktioner, de forventer for at få en hurtigere og mere smidig købsoplevelse, de samme, som bremser din e-handelsside, hvis du ikke udfører dem korrekt.
WooCommerce er den mest populære e-handelsplatform i verden og er gratis at bruge og tilpasse efter dine behov.
WooCommerce er blevet downloadet over 88 millioner gange til dato. Lige nu er den i brug på over 5 millioner hjemmesider.
I modsætning til andre populære shoppingplatforme behøver du ikke at betale en procentdel af din omsætning til WooCommerce, hvis du bruger det. Der er dog nogle faste omkostninger forbundet med at drive en WooCommerce-drevet butik.
Men der er en hage ved det! Da WooCommerce er gratis med begrænset support, er du selv ansvarlig for at holde den i topform. Den gode nyhed er, at det er nemt at tage sig af det, hvis du ved, hvad du laver!
Vil du vide, hvordan du gør din WooCommerce-side hurtigere og mere pålidelig?
Så er denne guide lige noget for dig!
Og husk, at dit ultimative mål er at øge din butiks omsætning. Så husk at downloade vores gratis e-bog, 10 Ways to Boost Your WooCommerce Product Page Conversions.
Hvorfor hastighed er vigtig for en onlinebutik
Førstehåndsindtrykket betyder noget, og hastigheden er det første, en bruger lægger mærke til på din hjemmeside. I en undersøgelse foretaget af Google forlod 53% af mobilbrugerne en side, hvis det tog længere end 3 sekunder at indlæse den.
“2 sekunder er grænsen for, hvornår et e-handelswebsted er acceptabelt. Hos Google sigter vi efter under et halvt sekund.”
– Maile Ohye, teknisk leder, Google
I en anden global undersøgelse sagde 80% af brugerne, at de finder en hjemmeside, der loader langsomt, mere frustrerende end en, der er midlertidigt nede. Den samme undersøgelse viste også, at 73% af brugerne ville skifte til en konkurrerende hjemmeside, hvis en hjemmeside er for langsom til at loade.
Selv en forsinkelse på 100 millisekunder i sidens svartid kan skade brugeroplevelsen og onlineomsætningen. Ifølge Akamai påvirker en forsinkelse på 100 millisekunder konverteringsraten med 7%, mens en forsinkelse på 2 sekunder øger afvisningsprocenten med hele 103%.
Hvis dit website genererer en daglig omsætning på 1.000 dollars, kan en forsinkelse på 100 millisekunder i sideindlæsningstiden koste dig 25.550 dollars i tabt omsætning om året.
Jo større virksomhed, jo større fald. For eksempel forventede Amazon et indtægtstab på 1,6 milliarder dollars årligt, hvis deres sideindlæsningstid blev forsinket med bare ét sekund.
Ovenstående data antyder, at hvis din hjemmeside er 6 sekunder eller mere om at loade, mister du dobbelt så mange brugere, som hvis din hjemmeside loader på under 3 sekunder.
Bortset fra brugeroplevelsen påvirker din hjemmesides hastighed også SEO. Hjemmesidens hastighed og ydeevne spiller en stor rolle i Googles algoritme til rangering af hjemmesider.
Google er gået over til mobile-first indeksering for over 50% af de sider, der vises i deres søgeresultater. På trods af dette tyder data fra HTTPArchive.org på, at den gennemsnitlige indlæsningstid for mobilsider, der kører WordPress er blevet forværret i løbet af det sidste år.
I spidsbelastningsperioder som Cyber Monday og Black Friday er det endnu vigtigere at holde din hjemmeside kørende så hurtigt som muligt. Med det udbrud af tilbud, der er, er det afgørende at sikre, at kunderne ikke forlader din side for at lukke salget.
I betragtning af disse statistikker kan det give dig en betydelig fordel i forhold til dine konkurrenter at gøre din WooCommerce-butik hurtigere.
Måling af hastigheden i en WooCommerce-butik
Hvad du ikke kan måle, kan du ikke forbedre!
Nu hvor du har forstået, hvorfor hastighed er vigtig for din WooCommerce-butik, er det tid til at lære, hvordan man måler den. Det er vigtigt at vide, hvordan du måler forbedringerne, når du forsøger at gøre dit WordPress-site hurtigere.
En hastighedstest er et perfekt værktøj til at teste din WooCommerce-butiks responsivitet. Men hvis du ikke gør det ordentligt, kan din side virke langsommere, når du har foretaget en ændring, selvom den er hurtigere.
Vi anbefaler, at du kommer i gang med et af disse værktøjer til hastighedstest af hjemmesider: WebPagetest, Pingdom, Google PageSpeed Insights eller GTMetrix.
Du kan også bruge det gratis WordPress-plugin Query Monitor til at finde de temaer, plugins og funktioner, der klarer sig dårligt. Det hjælper dig med at debugge ineffektive databaseforespørgsler, oppustede funktioner, PHP-fejl, HTTP API-kald osv.
Intet hastighedstestværktøj er perfekt, men vælg et og hold dig til det. Du kan arbejde dig frem mod andre muligheder senere.
Der er forskel på faktisk performance og opfattet performance. Brugeroplevelsen betyder mere end den tekniske trolddom, der driver webstedet.
Brug derfor de teknikker, der er nævnt nedenfor, til at forbedre dit websteds samlede brugeroplevelse i stedet for bare at få en højhastighedsscore.
Sådan får du fart på WooCommerce
En hastighedstestrapport vil give dig en handlingsplan til at optimere din langsomme WooCommerce-side. Er du spændt? Lad os komme i gang!
1. Optimer WooCommerce-indstillinger til ydeevne
Lad os starte med det grundlæggende ved at optimere WooCommerce-plugin-indstillingerne.
Først skal du ændre URL’en til din login-side. Som standard er login-URL’en på alle WordPress-websteder domain.com/wp-admin/. Den er nem at huske, men den udgør et stort problem: Alle kender den, også bots og hackere.
Hvis du ændrer din login-URL til noget unikt, beskytter du dig mod brute force-angreb fra ondsindede aktører. Det vil også hjælpe dig med at bekæmpe hastighedsbegrænsende HTTP-fejl som 429 Too Many Requests.
Gratis plugins som WPS Hide Login og Rename wp-login.php gør denne opgave super nem.
Hvis dit e-handelssite også har en blog, kan du begrænse antallet af indlæg i dit blogfeed. WordPress sætter denne grænse til 10 indlæg som standard, men du kan sætte en lavere grænse.
Selv om det kan virke trivielt, kan du spare mange penge, hvis du har en blog med meget trafik (se her, hvordan du får mere trafik til din hjemmeside). Du kan finde denne indstilling under WordPress Dashboard → Indstillinger → Læsning.
Dernæst skal du deaktivere pingbacks på din hjemmeside. De genererer som regel værdiløs spam. Jo færre forespørgsler din side genererer, jo bedre.
Hvis du har mange brugerkommentarer på dine indlæg eller sider, så giver WordPress dig også mulighed for at dele dem op i mindre bidder. Den samme indstilling gælder for opdeling af anmeldelser på dine produktsider.
Hold dette tal mellem 10 og 20 for at optimere indlæsningstiden for din produktside.
Du kan deaktivere produktanmeldelser under WooCommerce → Indstillinger, hvis du ikke kan lide at have dem i din butik. Dette vil hjælpe med at fremskynde dit websted, da det eliminerer indlæsning af et par scripts og widgets.
Til sidst skal du fjerne alle unødvendige/forældede temaer og plugins fra din hjemmeside. Jo færre temaer og plugins du har installeret, jo lettere er det at vedligeholde dem og fejlfinde problemer med ydeevnen.
2. Få et hurtigt WooCommerce-tema
Det er vigtigt at bruge det rigtige WooCommerce-tema. Der findes hundredtusindvis af temaer derude, så det er altid en udfordring at vælge det, der er perfekt til dig.
Et smukt tema med fantastiske indbyggede funktioner kan lyde godt på papiret, men det kan floppe i faktisk brug. Hvis du har en e-handelsside, skal du sikre dig, at den er fuldt kompatibel med WooCommerce.
WP Rocket testede en række populære WooCommerce-temaer for hastighed og kom frem til følgende resultater.
Astra, OceanWP og GeneratePress er også Kinstas favoritter, som foreslået i artiklen om WordPress-hastighed. De er ultrahurtige, lette WordPress-temaer. Du vil finde 10+ yderligere meget hurtige temaer i denne vejledning.
Når de kombineres med en sidebygger som Elementor eller Beaver Builder, kan de hjælpe dig med at oprette næsten ethvert slags websted.
Storefront er et gratis tema, der tilbydes af WooCommerce, mens Shoptimizer, Divi og WoondrShop er premium-temaer. Da disse temaer er bygget til at drive en e-handelsside, er det ikke nødvendigt at installere tredjeparts plugins for at få alle de funktioner, du ønsker.
Hvis du har et lille budget, er det helt fint at starte med et gratis tema og senere opgradere til en premium-løsning.
Vi anbefaler, at du lader page buildere ligge for at reducere bloat. Gå i stedet efter et tema, der understøtter WordPress‘ blokeditor Gutenberg.
Når du skal vælge et tema, foreslår vi, at du laver en liste over alle de funktioner, du har brug for i din onlinebutik. Gå derefter efter et tema, der dækker de fleste af dine funktionskrav. Dette vil hjælpe dig med at reducere afhængigheden af oppustede multi-purpose temaer og tredjeparts plugins.
Det bringer os til det næste forslag.
3. Spar på plugins og WooCommerce-udvidelser
WordPress har mere end 54.000 gratis plugins i sit repository. Der er endnu flere premium-plugins tilgængelige derude. Så det er nemt at lade sig rive med og installere snesevis af dem.
Mange populære plugins, især performance- og sikkerhedsrelaterede, fungerer ikke godt i visse hostingmiljøer.
Hvis du synes, det er svært at beslutte, hvilket plugin du skal installere, kan du gå gennem Kinstas håndplukkede liste over de bedste WordPress-plugins til forskellige formål. Fra SEO til billedkomprimering, du finder helt sikkert nogle perler derinde.
WooCommerce-funktionaliteten kan udvides med den brede vifte af gratis og premium WooCommerce-udvidelser. De fungerer på samme måde som plugins.
I modsætning til hvad mange tror, er antallet af plugins, du installerer, ikke altid årsag til problemer med ydeevnen. Men det gælder kun, så længe plugins er bygget med den bedste kodningspraksis.
Det bliver besværligt at kvalitetstjekke alle de plugins, du installerer, når der er for mange af dem. Og det er i betragtning af, at du har evnerne og ekspertisen til at tjekke dem grundigt.
Nogle få plugins skaber endda konflikter med andre plugins. Når du har dusinvis af plugins på din hjemmeside, stiger sandsynligheden for, at der opstår en plugin-konflikt, eksponentielt.
Vær derfor klog på, hvilken type plugins og WooCommerce-udvidelser du installerer.
4. Øg grænsen for WordPress-hukommelse
WordPress tildeler som standard 32 MB hukommelse til PHP. Hvis det løber ind i problemer, vil det automatisk forsøge at øge denne grænse til 40 MB (for et enkelt site) eller 64 MB (for et multisite).
I de fleste tilfælde vil denne hukommelsesgrænse ikke være nok til et WooCommerce-site. Du kan endda modtage en fejlmeddelelse på dit dashboard som f.eks:
“Allowed memory size of xxxxxx bytes exhausted“
Det anbefales at øge denne grænse til 256 MB. Lav altid en sikkerhedskopi af en fil, før du redigerer den. Hvis noget går galt, kan du erstatte den redigerede fil med den originale.
5. Komprimer billeder og optimer levering
Billeder udgør størstedelen af enhver hjemmesides sidestørrelse, og det gælder i endnu højere grad for en e-handelsside. WooCommerce-websteder er fyldt med produktbilleder og bannere.
Hvis du ikke optimerer billedernes størrelse og levering, kan de få din hjemmeside til at gå i stå 🐌
HTTPArchive sporer størrelsen og mængden af mange populære websider. Her er en visuel repræsentation af deres tilstand af WordPress-websteder i 2021:
Selvom videoer er en tungere ressource end billeder, indlæses de i de fleste tilfælde on demand. Derfor påvirker de ikke den opfattede sideindlæsningshastighed så meget som billeder gør.
Ifølge HTTP Archives State of the Images-rapport kan du spare 545 KB pr. side ved at lazy-loade skjulte og offscreen-billeder.
Ved at sætte dine JPEG-komprimeringsniveauer til 85 eller lavere, kan du yderligere spare 40,3 KB pr. side. Denne beregning kommer direkte fra Lighthouse, Googles hastighedstestværktøj til mobile hjemmesider.
Følg disse 5 regler for at optimere billeder til din WooCommerce-butik (og internettet generelt):
- Vælg det rigtige format til dine billeder (JPEG, PNG, SVG, WebP).
- Komprimer billederne effektivt ved hjælp af de rigtige værktøjer.
- Brug responsive billeder til at optimere leveringen til forskellige enheder.
- Lazy-load offscreen og skjulte billeder.
- Offload billedlevering til hurtige CDN’er.
WooCommerce 3.3 introducerede forbedringer af billedstørrelsen, som f.eks. on-the-fly ændring af størrelsen på miniaturebilleder, rettelse af slørede billeder og ændring af størrelsen på miniaturebilleder i baggrunden. Alle disse funktioner gør det overflødigt at bruge et plugin som Regenerate Thumbnails til WooCommerce-relaterede billeder.
Hvis du starter med en ny installation, kan du komprimere dine billeder, før du uploader dem til din hjemmeside. Her er nogle af de bedste anbefalinger til online billedkomprimering:
Har du allerede mange billeder på din hjemmeside? Så kan du bruge et WordPress-plugin til at automatisere billedoptimering. Her er dem, der konsekvent har klaret sig bedst efter vores erfaring:
De fleste af disse plugins muliggør også lazy-loading af billeder. WordPress ‘ kerneteam planlægger at tilføje lazy-loading af billeder som en indbygget funktion. Dette vil udnytte den nye HTML-attribut til <img>-tags.
En sidste ting om billedoptimering, dog. Undgå at bruge billedkomprimeringsplugins så meget som muligt, især dem, der bruger din servers ressourcer til at komprimere billederne.
Brug i stedet en tjeneste, der overlader billedkomprimeringsopgaven til en ekstern server. Eller endnu bedre, ændre størrelsen på og komprimere dine billeder, før du uploader dem til din hjemmeside.
Hvis du vil have en grundig vejledning, er Kinstas artikel om billedoptimering til web og ydeevne en god ressource til at komme i gang.
6. Lever statiske ressourcer via CDN
Et Content Delivery Network (CDN) er en gruppe servere, der er placeret strategisk rundt omkring i verden. Disse serverplaceringer er kendt som Points of Presence (PoP’er).
Et CDN’s primære funktion er at cache og levere statiske ressourcer som billeder, JavaScript, CSS osv. Mere kraftfulde CDN’er kan også hoste og levere dynamisk indhold som lyd og video.
Selv hvis din hjemmeside kører på den hurtigste server i verden, er den stadig begrænset af sin geografiske placering. Et WordPress CDN vil mindske afstanden mellem den enkelte bruger og sidens ressourcer, hvilket reducerer både netværksforsinkelse og Time To First Byte (TTFB).
Afhængigt af hvor anmodningen kommer fra, tildeler den automatisk den nærmeste CDN PoP til at levere de cachelagrede ressourcer. Resultatet er en hurtigere hjemmeside og en bedre brugeroplevelse.
Hvis du er Kinsta-kunde, leverer vi uden ekstra omkostninger for dig kun placeringer, der tilbyder Googles bedste C2-maskiner. Du kan vælge den region, der fungerer bedst for dig og dine brugere, og vælge mellem 21 datacentre på fem kontinenter.
Din WooCommerce-butik kan køre med maksimal hastighed med vores 260+ CDN POP’er.
For eksempel, hvis din WooCommerce-butik er hostet på en server i USA, og en bruger fra Indien forsøger at åbne dit websted, vil CDN’en servere webstedets aktiver fra den nærmeste PoP. Her ville det være fra Bengaluru (Indien).
Generelt gælder det, at jo højere antallet af PoP’er er, og jo større deres globale spredning er, jo hurtigere vil din hjemmeside være for dine brugere.
Kinsta satte sit CDN på prøve, og resultaterne taler for sig selv. For brugere på geografiske steder, der er betydeligt længere væk fra hosting-serveren, reducerede brugen af et CDN indlæsningstiden med over 50%.
Bortset fra caching inkluderer mange CDN’er andre præstationsforbedrende funktioner såsom overlegen on-the-fly billedkomprimering, HTTP/2-support, hotlink-beskyttelse og yderligere sikkerhed.
For at få en hurtigere WooCommerce-butik anbefaler vi, at du får et hurtigt CDN. Nogle populære CDN’er, du kan tjekke ud, er:
7. Fjern ubrugte scripts og stylesheets
De fleste WordPress-temaer og plugins indlæser scripts og stylesheets på alle sider på dit website. De indlæser disse aktiver, selv når de ikke bruges på siden.
Contact Form 7 indlæser f.eks. sine scripts og stylesheets på alle sider. Dens formularer bruges måske kun på kontaktsiden, men aktiverne indlæses på alle siderne. Ganske unødvendigt!
Hvis du fjerner disse ubrugte aktiver fra siderne, vil det hjælpe dig med at reducere bloat og gøre sideindlæsningstiderne hurtigere. WooCommerce og dets udvidelser (f.eks. Smart Coupons og Follow-Ups) er modtagelige for dette problem.
For eksempel er det unødvendigt at indlæse scripts relateret til betalingsgateways på din butiks hjemmeside eller shopside. Du kan begrænse sådanne scripts til kun at blive indlæst på checkout- og ordrebekræftelsessiderne. På samme måde kan du fjerne scripts og styles til slidere og karruseller fra din checkout-side.
Hvis du vil vide, hvilke aktiver du skal fjerne, kan du kigge på vandfaldsdiagrammet i din rapport om hastighedstesten af dit website. Det giver dig en idé om de unødvendige aktiver, der indlæses.
Fanen Netværk under Chrome-browserens DevTools er også et godt sted at komme i gang. Det giver dig et omfattende overblik over, hvordan og hvad en webside indlæses.
Fjern de scripts og styles, der ikke er nødvendige for sidens funktion. Start med at optimere din hjemmeside og dine landingssider, da det er de første indgange for de fleste af dine brugere.
Du kan bruge funktionerne wp_dequeue_script og wp_dequeue_style til at fjerne scripts og styles, du ikke har brug for. En nem måde at opnå det samme på er gennem et plugin kaldet Asset CleanUp: Page Speed Booster.
Asset CleanUp scanner for alle scripts og stylesheets, der bliver indlæst på en side. Du kan deaktivere dem, der ikke bruges på siden. Test siden for korrekt design og funktionalitet, når du er færdig med at foretage ændringerne.
Pro-versionen af pluginet giver dig mulighed for at indstille async- eller defer-attributter til aktiverne. Ved at anvende denne indstilling fjernes JavaScript fra sidens kritiske rendering path. Det skulle hjælpe med at forbedre din sides indlæsningstid.
En anden fordel ved at fjerne unødvendige CSS- og JS-aktiver er, at din hjemmeside vil foretage færre HTTP-anmodninger.
Som et gratis alternativ kan du bruge kombinationen af Autoptimize og Async JavaScript-plugins til at opnå de samme resultater. Hvis du vælger Autoptimize-pluginet, er her vores komplette trin for trin-guide til de bedste indstillinger.
8. HTTP/2 er ekstremt vigtigt
Hvis vi skrev denne artikel for et par år siden, ville vi have kaldt dette afsnit “Reducer antallet af HTTP-anmodninger.” Takket være betydelige forbedringer i, hvordan browsere kommunikerer med hjemmesider (og omvendt), er behovet for denne optimering nu forældet.
HTTP 1.1 var den første store opdatering af HTTP-protokollen, og den blev færdiggjort helt tilbage i 1997. Det var før sociale medier, streamingtjenester, smartphone-apps og endda WordPress. Internettet er vokset eksponentielt siden da.
HTTP/2 forbedrede HTTP 1.1-protokollen og gjorde sit indtog i 2015 for at holde trit med internettets voksende krav. Det medførte fantastiske forbedringer i hastighed, effektivitet og sikkerhed.
Præstationsforøgelsen med HTTP/2 skyldes flere årsager:
- Bedre multiplexing og parallelisme over en enkelt TCP-forbindelse.
- HPACK-komprimering til headers med Huffman-kodningsalgoritme.
- ALPN-udvidelse til hurtigere kryptering.
- Proaktive server pushes i stedet for at vente på anmodninger.
Alt det jazz giver én afgørende fordel: at få hjemmesider til at loade hurtigere, selv når de er host for forskellige typer af ressourcer.
Typisk serverer WooCommerce-butikker en masse ressourcetunge aktiver som billeder, stylesheets og scripts. Sider som disse vil drage stor fordel af at skifte til HTTP/2.
Du kan bruge HTTP/2-testværktøjet fra KeyCDN til at kontrollere, om dit websted er konfigureret til at arbejde med HTTP/2. Fra nu af understøtter alle større browsere HTTP/2. Der er ingen grund til, at du ikke skulle drage fordel af dens massive præstationsfordele.
Hvis din hostingudbyder ikke understøtter HTTP/2 endnu, skal du begynde at lede efter en ny. Kinsta understøtter HTTP/2 og TLS 1.3 på alle sine servere og CDN.
Desuden er HTTP/3 lige rundt om hjørnet og er indstillet til at få websteder til at indlæse endnu hurtigere.
9. Cache WooCommerce for at gøre det hurtigere
Caching er midlertidig lagring af ressourcer (cache) fra en anmodning, så efterfølgende anmodninger kan udføres hurtigt. Cachen kan gemmes enten på serveren eller på brugerens enhed.
Det er en af de nemmeste måder at gøre din WooCommerce-butik hurtigere på. Og det er også den vigtigste.
- Brugeren sender en anmodning til en hjemmeside via sin browser. For eksempel skriver de www.kinsta.com i deres browser.
- Browseren laver derefter en anmodning om en webside (HTML-dokument), der skal vises til brugeren. En DNS-server håndterer denne anmodning, hvilket resulterer i afsløring af hosting-serverens IP.
- Returnering af websiden håndteres af en applikation (f.eks. WordPress, Joomla osv.), der er hostet på en webserver. Med statiske hjemmesider er en applikation måske ikke engang nødvendig.
- Applikationen kører scripts (f.eks. PHP, JavaScript osv.) og (5) forespørger databasen (f.eks. MySQL, MongoDB osv.) for at opbygge en webside. Den returnerer derefter websiden til browseren, som gengiver den og viser den til brugeren.
Hvis alt fungerer problemfrit, bør alle ovenstående trin højst tage et par sekunder at udføre.
Men det er kun én anmodning fra en enkelt bruger. Hvad nu, hvis der er flere anmodninger fra tusindvis af brugere på samme tid? Det vil lægge en enorm belastning på serveren og i sidste ende føre til en langsommere hjemmeside.
Det er her, caching kommer til undsætning. Det reducerer den mængde arbejde, der kræves for at generere en sidevisning, og reducerer dermed WordPress‘ afhængighed af PHP og en database. Caching gør WordPress næsten lige så hurtigt som statiske hjemmesider, hvis ikke det samme.
Der er to hovedtyper af webcaching, hver med deres egne undergrupper:
Caching på serversiden
Cache på klientsiden
Caching får ikke kun hjemmesiden til at loade hurtigere, men det reducerer også belastningen på serveren. Kinstas dybdegående artikel om WordPress-cache er en god ressource til en detaljeret forklaring.
Hvis din WooCommerce-butik er hostet hos Kinsta, er caching taget hånd om på serverniveau. Derfor behøver du ikke bruge et cache-plugin.
Kinsta konfigurerer cache-regler, så de fungerer problemfrit med WooCommerce. Dette sikrer, at dine brugere har en jævn checkout-oplevelse uden bump.
Hvis din hostingudbyder ikke håndterer caching på serverniveau, er du nødt til at være afhængig af tredjeparts caching-plugins for at gøre arbejdet for dig. Selvom de ikke er en ideel løsning, er noget altid bedre end ingenting.
Her er vores bedste anbefalinger af caching-plugins til WordPress:
- WP Rocket (premium)
- W3 Total Cache (gratis)
- Cache Enabler (gratis)
For flere muligheder, tjek Kinstas indlæg om WordPress-cache-plugins.
10. Ryd op i din WooCommerce-database
En database er en organiseret samling af alle dit websteds data. I en WooCommerce-butik omfatter den:
- Webstedsindhold såsom produktsider, kategorier, tags, brugerdata, anmeldelser, indstillinger for hele webstedet, tema, plugins osv.
- Transaktionsdata såsom ordredetaljer, betalinger, lagerbeholdning osv.
Hver gang en bruger besøger din butik, beder de om dit webstedsindhold, som for det meste er statisk og ikke ændrer sig meget. Men når de afgiver en ordre, laver de en dynamisk anmodning.
Hvis du ikke optimerer din butiks database, kan det tage for lang tid at behandle disse forespørgsler. I sidste ende fører en langsom serverresponstid til en langsom hjemmeside. Derfor skal du rydde op og optimere databasen ved at fjerne unødvendigt skrammel.
Her er 6 måder at fremskynde og finjustere din WooCommerce-database på.
Slet gamle revisioner
Hvis din WooCommerce-butik har været i drift i et stykke tid, vil dens sider, indlæg og produkter være fyldt med gamle revisioner. Det er på tide at rydde op i dem.
Den nemmeste måde at gøre det på er gennem plugins som WP-Sweep eller WP Rocket.
Hvis du er god til WP-CLI, kan du også oprette forbindelse til din server via SSH og køre et par enkle kommandoer for at gøre det samme. Her er, hvordan du kan gøre det.
Begræns antallet af gemte revisioner
Du kan undgå at have mange gamle revisioner ved at begrænse antallet af revisioner for indlæg og sider. Hvis du er tilbøjelig til at opdatere indholdet på din hjemmeside ofte, vil dette hjælpe dig med at forhindre, at revisionerne løber løbsk.
En nem måde at indstille grænsen på er ved at tilføje nedenstående kodestykke til din wp-config.php fil. Sørg for at tilføje det før den linje, hvor ABSPATH er defineret.
define('WP_POST_REVISIONS', 15);
Jeg har sat grænsen til 15 i koden ovenfor. Du kan ændre den til det antal revisioner, du ønsker, men prøv at holde den under 15.
Alternativt kan du bruge et gratis plugin som WP Revisions Control til at gøre det samme.
Deaktiver revisioner helt (hvis de er unødvendige)
Du kan deaktivere revision er helt fra din hjemmeside. Alt, hvad du skal gøre, er at tilføje følgende kode til din wp-config.php-fil. Som før skal du sikre dig, at du tilføjer dette uddrag over linjen, hvor ABSPATH er defineret.
define('WP_POST_REVISIONS', false);
Eller du kan bruge et gratis plugin som Disable Post Revision til at gøre det samme med et enkelt klik.
Før du deaktiverer revisioner, foreslår vi, at du sletter alle de gamle revisioner, der stadig er til stede. På den måde vil din hjemmesides database være helt fri for revisioner fremover.
Ryd op i udløbne transienter
Transienter er cachelagrede data med et brugerdefineret navn og en udløbsperiode. De gemmes normalt i WordPress-databasen under tabellen wp_options.
Transients ligner Options, bortset fra at de har en ekstra egenskab i form af udløbstid. De er nyttige til at gemme midlertidige data som f.eks. svar fra en ekstern API eller store forespørgsler.
WordPress Transients API definerer, hvordan man håndterer transienter og sletter udløbne transienter automatisk. Men tingene går ikke altid som planlagt.
Nogle gange kan en korrupt transient cache skabe næsten en million uønskede poster uden nogen ende i sigte. Kundesessioner kan hobe sig op over tid og skabe tusindvis af unødvendige rækker i dine databasetabeller. I sådanne tilfælde kan en oppustet database tvinge dit website i knæ.
Det gratis Delete Expired Transients-plugin er en nem måde at slippe af med alle udløbne transienter.
Ryd op i dine databasetabeller
Din WooCommerce-database gemmer alt, hvad der er nødvendigt for at drive din e-handelsbutik. Efterhånden som data tilføjes, fjernes og flyttes rundt i tabellerne i din database, bliver den ineffektiv og ender med at gemme mange ting, der ikke er vigtige for at drive din butik.
Du skal rydde ud i disse unødvendige data ved at rydde op i dine databasetabeller. Især wp_options-tabellen er tilbøjelig til at blive oppustet og skade databasens ydeevne.
Databaseoprydning er nøglen til at holde dit WordPress-site kørende så hurtigt som muligt.
At optimere din database manuelt er en tidskrævende proces. Du kan bruge det gratis WP-Optimize-plugin til at tjekke, hvilke databasetabeller der har unødvendige data, og slette de spildte pladser. Det kan også genskabe lagerplads, der er gået tabt på grund af datafragmentering.
Du kan planlægge WP-Optimize til at rydde op og optimere din database regelmæssigt.
Deaktiver ikke-kritiske funktioner, der belaster databasen
WooCommerce-temaer og plugins kommer med en masse fede funktioner, der virker gode fra starten, men ender med at smuldre databasen.
Et eksempel er brugen af plugins til “Populære produkter” og “Relaterede produkter”. Disse funktioner kan forårsage enorme forespørgsler på hele sitet, især hvis du har mange produkter. Hvis du har brug for disse funktioner, skal du prøve at indsætte dem manuelt på dine sider. Plugins som Advanced Custom Fields kan være en stor hjælp her.
Et andet eksempel er billedoptimeringsplugins, der komprimerer billeder på den samme server, hvor webstedet er hostet, i stedet for at gøre det eksternt. Dette ender med at bruge en masse af din servers ressourcer.
Hold dig også væk fra plugins, der tilføjer tællere til din side. For eksempel at tilføje antallet af visninger/indlæg/kommentarer ved siden af et brugernavn. En lang diskussion med flere brugere involveret vil stresse din database til at knuse disse tal.
Dette råd gælder også for brug af sociale tællere. Minimer brugen af autogenererede tællere for at maksimere databasens ydeevne.
Ligesom husholdning er finjustering af din WordPress-database en løbende proces.
Med dette i tankerne har Kinsta implementeret et automatiseret system til at bekæmpe problemer med databasens ydeevne. Baseret på dit websteds behov scanner og finjusterer det automatiserede system din MySQL-database en gang om ugen for at sikre maksimal databaseydelse. Hvis systemet opdager noget ud over det sædvanlige, som ikke kan løses automatisk, giver det sysadmin-teamet besked om at tage øjeblikkelig handling.
Hvis din hjemmeside er hostet et andet sted, er her et par databaseoptimerings-plugins, der kan gøre dit arbejde lettere:
Påmindelse: Tag altid en backup, før du redigerer din database eller WordPress-kernefiler.
11. Optimer din butik til Mobile-First Experience
I januar 2020 var der over 4 milliarder internetbrugere i verden. Der er næsten lige så mange mobile internetbrugere. Det forventes at vokse til 5+ milliarder i 2024.
Mobile enheder overhalede desktops i den globale webtrafik i 2019 og genererede 52,6% af de samlede sidevisninger. I nogle lande som Indien og Nigeria står mobiltelefoner for mere end 70% af alle sidevisninger.
Ifølge en undersøgelse med mere end 500 millioner online-shoppere i 37 lande stod smartphones for 65% af besøgene og 46% af e-handelsordrerne.
Overraskende nok er konverteringsraten for mobiltelefoner mindre end halvdelen af den for desktops. Der er et enormt potentiale for vækst her.
Du kan starte med at gøre din WooCommerce-butik mobilvenlig. Du kan bruge Googles Mobile Friendly Test-værktøj til at tjekke, om din side lever op til minimumsstandarderne for mobil anvendelighed.
Testen viser dig et øjebliksbillede af, hvordan din hjemmeside ser ud på en mobil enhed. Den viser også eventuelle problemer med mobil brugervenlighed, hvis den finder nogen.
Den nemmeste måde at gøre din WordPress-hjemmeside mobilvenlig på er at bruge et responsivt tema. Alle de temaer, der er nævnt tidligere i dette indlæg, er responsive fra start og ser godt ud på mobile enheder.
Mobilkunder bryder sig ikke om at scrolle i det uendelige. Derfor skal du holde dine butikssider så slanke som muligt. Lad være med at overfylde dem med for meget indhold.
Hvis du har masser af produkter i din butik, skal du gøre det lettere for dine mobilkunder at finde dem gennem søgning. Du kan installere WooCommerce Product Search-pluginet for at hjælpe dine kunder med at finde produkter hurtigt med live produktfiltre.
Endelig skal du strømline checkout-oplevelsen for dine online-shoppere. Jo færre trin, der skal til for at afgive en ordre, jo bedre bliver shoppingoplevelsen. Her er et par WooCommerce-udvidelser, der kan hjælpe dig med dette:
- WooCommerce Social Login – Eliminerer behovet for tidskrævende kontooprettelse eller login-proces. Lad dine brugere logge ind med deres sociale konti som Facebook, Twitter, Google osv.
- Variationsprøver og fotos – Sig farvel til irriterende dropdown-menuer til at vælge produktvariationer. Giv i stedet dine brugere lettilgængelige knapper til alle dine produktmuligheder.
- One Page Checkout – Lad ikke dine kunder forlade din hjemmeside så let. Giv dem mulighed for at købe det, de ønsker, med det samme uden ekstra trin. Hvis du synes, at gæstecheckout passer godt til din butik, kan du se på, om du kan aktivere det.
- Checkout Field Editor – Tilføj, fjern eller ændr felter fra din checkout-side. Hvis du f.eks. kun sælger digitale produkter, behøver du ikke at indsamle leveringsadresser.
- Bolt / Stripe / AmazonPay / PayPal – Betalinger er en plage for den mobile shoppingoplevelse. Du kan vælge mellem forskellige WooCommerce-betalingsgateway-udvidelser for at gøre det lettere at indsamle betalinger.
I sidste ende handler mobilshopping om mere end bare at foretage et køb. Mange brugere bruger det primært til at slå produktoplysninger op og tjekke/sammenligne priser. Gør oplevelsen i din onlinebutik god for dine brugere på deres mobile enheder.
12. Slå Get Refreshed Fragments AJAX Request fra
Når en bruger foretager ændringer i sin indkøbskurv, bruger WooCommerce AJAX-anmodningen Get Refreshed Fragments til at opdatere indkøbskurvens indhold dynamisk. At opdatere siden med indkøbskurven uden at genindlæse den virker godt ud fra et brugeroplevelsesperspektiv.
Men det gør ofte hjemmesider langsommere, især dem, der er hostet på delte servere. Desuden er der mange sider, der ikke ender med at bruge denne funktion.
For at verificere det, testede vi en opdateret WooCommerce-butik på Pingdom Tools, og her er resultaterne:
Selvom wc-ajax=get_refreshed_fragments-anmodningen kun fylder 1,1 KB, tager det 0,76 sekunder at udføre den. Hvis din side tager 3 sekunder eller mindre at indlæse, er det over 25% af sidens indlæsningstid. Denne testside er hostet på en cloud-VPS, så du kan forestille dig indlæsningstiderne på en billigere hostingplan.
Dette indlæg fra WebNots dækker problemet mere detaljeret. Du kan bruge de gratis plugins Disable Cart Fragments eller Disable Cart Fragments by Optimocha til at deaktivere denne belastende anmodning.
Hvis du deaktiverer denne anmodning, anbefales det at aktivere indstillingen ‘Redirect to the cart page after successful addition’ i dit WooCommerce → Products-indstillingspanel.
Hvis du aktiverer denne adfærd, sikrer du, at brugeren bliver omdirigeret til siden med indkøbskurven, når han/hun har tilføjet et produkt til sin indkøbskurv.
Optimering af WooCommerce-administrationspanelet
Hastighed er ikke kun en vigtig faktor for din butiks frontend. En hurtig backend er lige så afgørende for, at du nemt kan administrere din butik og foretage hurtige ændringer, når det er nødvendigt.
At arbejde effektivt på dit WooCommerce-administratorpanel er nøglen til at være produktiv. Det frigør også din tid til at gøre mere vigtige ting for din WooCommerce-butiks succes, som online markedsføring.
Nedenfor er et par måder at fikse et langsomt WooCommerce-dashboard på.
Frontend-optimeringer først, backend-optimeringer derefter
Opstår problemet kun i WordPress’ admin-dashboard og ikke på hele hjemmesiden? Hvis det er sidstnævnte, skal du først anvende alle de optimeringer, der er nævnt tidligere.
Hvorfor? Fordi i de fleste tilfælde Fordi det i de fleste tilfælde også vil optimere backend, hvis du får din WooCommerce-butik til at loade hurtigere på frontend. Vi kan tilskrive dette frigørelse af ressourcer på din server.
Hvis dit admin-dashboard halter, selv efter at du har optimeret frontend, så fortsæt med de følgende forslag.
13. Fjern Bloat og opdater alt regelmæssigt
Sørg for at opdatere WordPress, WooCommerce, plugins, udvidelser og temaet ofte. Hvis et tema eller plugin ikke længere understøttes af udviklerne, er det tid til at overveje at droppe dem.
Hvis et tema/plugin fylder unødvendigt meget på dit dashboard, skal du også begynde at lede efter bedre alternativer. For eksempel kan du overveje alternativer til plugins, der viser aggressive annoncer i dit dashboard.
Dette problem er så udbredt, at der findes plugins, der udelukkende er dedikeret til at fjerne bloat fra nogle af de mest populære WordPress-plugins.
14. Deaktiver objekt- og database-cache
Cache-plugins er en fantastisk måde at gøre dit WordPress-site hurtigere på. Men hvis de ikke er konfigureret korrekt, kan de føre til uventede resultater. Det inkluderer at gøre din backend langsommere.
For eksempel er W3 Total Cache et af de mest populære caching-plugins til WordPress. Det er gratis, understøtter masser af caching-indstillinger, laver JS- og CSS-minificering, integreres med et CDN og bruges af mere end 1 million hjemmesider.
W3 Total Cache har følgende cache-indstillinger:
- Side-cache.
- Opkode-cache.
- Database-cache.
- Objekt-cache.
- Browser-cache.
- Fragment-cache.
Det er forvirrende at have mange muligheder, især for begyndere, der ikke forstår, hvad hver type caching gør.
Object- og databasecache gør hjemmesiden hurtigere ved at reducere antallet af databaseforespørgsler, men de gør det på bekostning af at flytte arbejdet til serverens hukommelse.
Ideelt set burde dette ikke udgøre et problem, hvis din hosting-server er smart eller kraftig nok. Hvis din WordPress-side f.eks. hostes hos Kinsta, behøver du ikke bekymre dig om caching, da det allerede er implementeret på serverniveau.
Desværre er det ikke tilfældet med alle hostingudbydere.
I det scenarie er du nødt til at være afhængig af et tredjeparts caching-plugin som W3 Total Cache. Dets enkle indstillinger gør det supernemt at aktivere alle typer cache med blot et enkelt klik.
I panelet W3 Total Cache → Generelle indstillinger skal du deaktivere objektcache og/eller databasecache. Tjek derefter, om du kan se nogen forbedringer i dit adminpanels reaktionsevne.
At eksperimentere med cachen er ikke så enkelt som at markere eller fjerne markeringer i dine plugin-indstillinger. Du bør også tjekke, om din side fungerer korrekt, når du har foretaget ændringerne og skyllet din gamle cache.
Kinsta-kunder kan øge deres samlede optimering ved at drage fordel af kodeminificeringsfunktionen, der er indbygget direkte i MyKinsta-dashboardet. Denne funktion giver kunderne mulighed for at aktivere automatisk CSS- og JavaScript-minificering med et enkelt klik, hvilket effektivt fremskynder deres websteder med nul manuel indsats.
15. Fjern plugins med højt ressourceforbrug
Nogle WordPress-plugins er en stor ressourcesluger på din webserver. De ender med at bruge det meste af din servers CPU og RAM.
Du kan bruge det gratis Query Monitor-plugin til at finde de besværlige plugins. Det viser dig alle de scripts, stilarter og HTTP API-call, der indlæses af din hjemmeside, sammen med deres størrelse og indlæsningstid. Hold øje med dem, der har det største antal forespørgsler og de langsomste indlæsningstider.
På testsiden nedenfor indlæses Classic Editor-pluginet langsomst på admin-siden. Andre plugins som Loginizer, All-in-One WP Migration og WP Bakery (tidligere Visual Composer) dukker også op som potentiel bloat.
Vi fandt ud af, at migrerings- og Classic Editor-plugins er unødvendige. Fjernelsen af disse to plugins forbedrede admin-hastigheden betydeligt.
WooCommerce-butikker med et internationalt publikum bruger oversættelsesplugins som WPML til at betjene webstedet dynamisk på flere sprog. Det er et fantastisk plugin med mange funktioner, men det kan også gøre din admin-backend meget langsommere.
Du kan opnå en vis præstationsfordel ved at skifte til et magert oversættelsesplugin som Polylang. Det har ikke så mange funktioner, men fungerer godt i de fleste tilfælde.
Plugins, der har mange løbende processer/scanninger, vil gøre din WordPress-backend langsommere. Nogle eksempler inkluderer sitemap-generatorer, analysegrafer og -diagrammer, sidebyggere og chat-plugins.
16. Brug de rigtige CDN-indstillinger til WordPress
CDN hjælper med at levere din WooCommerce-butik lynhurtigt til brugere over hele verden. Det gør det ved at gemme et snapshot af din sides ressourcer og levere dem fra den nærmeste server til brugeren.
De fleste CDN’er deaktiverer som standard caching på WordPress-backend. Men nogle CDN’er gør det ikke, og det kan gøre din butiks administrationspanel meget langsommere. I et sådant tilfælde skal du udelukke dit admin-dashboard fra CDN’ens cache for at forbedre dets ydeevne.
Hvis du bruger Cloudflare, kan du oprette en Page Rule for at deaktivere Cloudflare-funktioner på WordPress-administratorsider. Sådan gør du det:
- Gå til sektionen Page Rules under dit Cloudflare-dashboard.
- Tilføj *example.com/wp-admin/* i URL-feltet.
- I indstillingsfelterne skal du vælge Cache Level og Bypass options.
- Du kan også tilføje ekstra indstillinger som Disable Performance og Disable Security (anbefales ikke). Disse indstillinger er valgfrie.
- Klik derefter på Save and Deploy.
Det bør tage omkring 3 minutter, før indstillingerne træder i kraft.
Hvis du bruger KeyCDN, kan du bruge deres WordPress Cache Enabler Plugin til at gøre det samme. For andre CDN’er skal du kontakte deres support for at finde ud af det.
17. Strømlining af WordPress Heartbeat API
WordPress Heartbeat API muliggør opdateringer i næsten realtid ved at opretholde en regelmæssig forbindelse mellem din browser og din server. API’en sender forespørgsler til serveren hvert 15.-60. sekund og udløser derefter events (eller callbacks), når den modtager data.
Det giver mulighed for nogle fantastiske funktioner som automatisk lagring af indlæg, låsning af indlæg og advarsler om udløb af login. Men når du er logget ind som administrator, kan det gøre dit administratorpanel langsommere at sende et par forespørgsler til serveren hvert minut.
WP Rockets gratis Heartbeat Control-plugin giver dig mulighed for at styre hyppigheden af disse API-anmodninger på dashboardet, frontend og post editor. Det giver dig endda mulighed for helt at deaktivere API’en.
Start med at øge hyppigheden af tiden. Hvis det ikke løser din WooCommerce-backends hastighedsproblemer, kan du overveje at deaktivere Heartbeat API.
Hvis alle de ovenstående optimeringer stadig ikke løser din WooCommerce-butiks hastighedsproblemer, så…
WooCommerce-hastighed starter med kvalitetshosting
Ligesom en bil med flade dæk bliver din side ikke hurtigere, uanset hvor mange optimeringer du foretager, hvis den er hostet på en elendig server. En væsentlig del af din hjemmesides performance afhænger af kvaliteten af din hosting.
Der findes forskellige typer hosting til WordPress-sites, som falder ind under to hovedkategorier: Administreret og uadministreret. Den første er perfekt for de fleste brugere, da hostingudbyderen håndterer alle serveroptimeringer for WordPress. Sidstnævnte er bedre egnet til teknisk dygtige brugere, der selv kan tilpasse og administrere serveren.
Til en WooCommerce-hjemmeside skal du vælge Administreret WordPress Hosting. Husk på, at administreret hosting har tendens til at være dyrere end ikke-administreret hosting.
Du kan vælge mellem fire hovedtyper af administreret WordPress-hosting. Hver af dem har sine egne fordele og ulemper, så vælg den, der passer til dit budget og dine mål. Jeg har sammenlignet dem i infografikken nedenfor for forskellige funktioner.
Hver type hosting kan tilbydes under flere planer til forskellige priser. Så når du leder efter en hosting inden for dit budget, skal du se på de funktioner, der tilbydes, for at afgøre, om den opfylder dine krav.
WooCommerce-websteder er utroligt dynamiske af natur. De genererer en masse data og forespørgsler, som ikke kan caches.
For eksempel er checkout-siden unik for hver bruger og kan ikke serveres fra en cache. Derfor skal serveren være robust nok til at køre din side problemfrit, selv hvis den tiltrækker lav trafik.
De anbefalede funktioner, du bør kigge efter, når du beslutter dig for en WooCommerce-hostingplan, er:
- Caching på serverniveau med WooCommerce-specifikke cache-regler på plads.
- 2 til 4 PHP-arbejdere til at håndtere WooCommerces ucachelagrede anmodninger uden at time dem ud.
- WordPress-hukommelsesgrænse på 128 MB eller mere (256 MB er standard på Kinsta).
- Skalerbar infrastruktur til at håndtere stigninger i trafik og belastning.
- Automatiske daglige backups (helst hver time) for at sikre, at dine e-handelsdata er sikre og trygge.
- En fuldt sikker hostingplatform med sikkerhedsfunktioner som regelmæssige malware-scanninger, IP Geolocation og blokering af misbrugte IP’er, gratis SSL, SFTP, SSH, HTTP/2 og TLS 1.3.
- Nginx eller LiteSpeed webserversoftware.
- Understøttelse af udviklervenlige funktioner: PHP 8, LXC-containere, WP-CLI, Git, MariaDB, Scenemiljøer osv.
- Høj uptime med datacentre spredt over hele verden. Gå efter den, der har servere tæt på, hvor din målgruppe er.
- Cloudflare-integration for øget performance og sikkerhed.
- Et pålideligt 24/7 supportteam til hurtig løsning af eventuelle problemer.
- Gode brugeranmeldelser og en fantastisk track record.
Med disse krav i baghovedet kan du roligt udelukke Delt Hosting.
En Virtual Private Server (VPS) er ligesom delt hosting, bortset fra at du har en virtuel plads på en delt server, som kun er dedikeret til dig. Hvis du har et stramt budget, kan du komme i gang med en mellemklasse VPS-plan. Men hvis din side tiltrækker mere trafik, bliver du snart nødt til at opgradere.
Det efterlader os med Cloud Hosting og Dedicated Server. Begge er gode til WooCommerce-websteder, hvis de opfylder dine krav.
Priserne for dedikerede serverplaner er i den høje ende sammenlignet med cloud hosting-planer, som kan variere fra ~50 USD/måned til tusindvis af dollars pr. måned.
Kinstas cloud-hostingplaner til virksomheder opfylder alle de anbefalede WooCommerce-krav. Dens containerbaserede hosting er perfekt til WooCommerce, da den automatisk skaleres til at håndtere pludselige trafik- og belastningsstigninger.
Hvis du vil udvide funktionerne yderligere, tilbyder Kinsta add-ons som Redis, ekstra backups, Nginx reverse proxy og meget mere.
Nedenfor er et eksempel på præstationsgevinster, efter at Kinsta migrerede et e-handelswebsted til Google Cloud Platforms nye Compute-Optimized VMs (C2).
Fra ~665 ms til ~500 ms, det er en stigning i ydeevnen på hele ~25%!
Hvis du bruger mange penge på markedsføring, skubber du alle dine leads væk, hvis din hjemmeside er langsom, så det er værd at vælge de hurtigste WordPress-hostingløsninger.
I sidste ende er det bedre at bruge et par ekstra dollars hver måned på kvalitetshosting i stedet for at bruge timer på at rive dig i håret og undre dig over, hvorfor dit websted stadig har en høj afvisningsprocent.
Sammenfatning
Tid er bogstaveligt talt penge for et e-handelssite. En hurtig WooCommerce-butik øger brugeroplevelsen, SEO, omsætningen og ROI.
Selvom du ikke behøver at følge alle de tips til hastighedsoptimering, der er anført i dette indlæg, anbefaler vi, at du gennemgår dem alle. Det vil hjælpe dig med at identificere eventuelle flaskehalse på din hjemmeside. Ingen kan lide at vente på, at en side indlæses. Lad os få fart på WooCommerce!
Skriv et svar