Sådan forbedrer du din webshops ydeevne
Der er flere faktorer, som påvirker din webshops ydeevne. Du kan kontrollere nogle af dem.
Se rapporten Webydeevne for at få mere at vide om, hvordan din webshop klarer sig i dag.
På denne side
Faktorer, du ikke kan kontrollere
Disse faktorer kan påvirke ydeevnen i din butik, men de kan ikke styres af indstillinger eller justeringer, som du kan foretage af din Shopify-butik. Dette omfatter faktorer fra dine kunder, som f.eks. deres enheder eller internethastighed, samt faktorer fra Shopify, som f.eks. opdateringer af Shopifys infrastruktur.
Din kundes enhed, netværk og lokation
Kunder, der besøger din webshop, bor i hele verden og har forskellige enheder og internetforbindelser. Dette betyder, at din butik muligvis indlæses hurtigere eller langsommere alt afhængigt af disse faktorer.
Hvis en kunde kontakter dig angående hastigheden i din butik, skal du bede kunden om at kontrollere, at han eller hun bruger den nyeste version af den benyttede browser, har ryddet cachelageret for nyligt, og at hans eller hendes internetudbyder ikke oplever udfald eller forringet ydeevne.
Shopifys infrastruktur
Shopify hoster din webshop på hurtige, globale servere og begrænser ikke din butiks båndbredde. Du kan kontrollere statussen for din Shopify-butik på Shopify-status.
Shopify foretager løbende forbedringer af sin kode og infrastruktur. Nogle af disse forbedringer kan blive afspejlet i dine ydeevneparametre.
Her er nogle af de funktioner, der kan påvirke hastigheden i din webshop.
Netværk, der leverer indhold (CDN)
CDN står for “content delivery network” (netværk, der leverer indhold). CND opbevarer dine billeder og andre filer, som f.eks. indholdet på siden Indhold > Filer i din Shopify-administrator. CND er det sted, som Shopify bruger til at levere et CDN i verdensklasse til shopejere via Cloudflare. Dette sikrer, at din webshop indlæses hurtigt over hele verden. Du kan kontrollere CDN-statussen på Cloudflare-statussiden.
Cachelagring i lokal browser
Din butik lagrer midlertidigt nogle elementer i dine kunders lokale lagerplads. Næste gang kunderne besøger din webshop, kan browseren indlæse ressourcerne fra cachen i stedet for at sende en ny anmodning til serveren.
Shopify angiver cachelagring i browseren for ressourcer i din butik, der kan lagres i cachen. Dette sker for ét år for hver fil. Filer, der kan lagres i cachen, omfatter billedfiler, PDF-filer, JS-filer og CSS-filer.
Cachelagring af side på serverside
Shopify lagrer sider i cachen på serversiden udover cachelagring i lokale browsere. Første gang siden indlæses, kan det tage længere tid, men indlæsninger af siden på et senere tidspunkt er hurtigere, fordi kunderne modtager en cachelagret kopi.
Aktiverne i Liquid-objektet “content_for_header
”
Liquid-objektet “``” indsætter aktiver, der benyttes af en række funktioner i webshoppen, herunder analyser af ydeevnen og valgfrie funktioner såsom dynamiske betalingsknapper. Hvis du indlæser dette objekt og dets relaterede aktiver, vil det påvirke hastigheden i din butik. Shopify optimerer tagget og dets aktiver for at gøre det hurtigere.
Faktorer, du kan kontrollere
Herunder er nogle af de faktorer, der kan påvirke din webshops ydeevne samt, hvordan du kan løse dem.
Apps
Når du tilføjer apps for at ændre funktionaliteten eller udseendet af din webshop, føjer de kode til dit tema for at kunne køre. Nogle koder kan fjernes eller flyttes rundt for at forbedre din webshops ydeevne. Du kan fjerne koden, hvis du ikke bruger en app.
Hvis du mener, at en app gør din butik langsommere, kan du gøre følgende:
- Deaktiver de appfunktioner, du ikke bruger, eller fjern appen, hvis du ikke har brug for den. Tænk på balancen mellem funktionalitet og hastighed i din webshop.
- Hvis du fjerner en app, bør du overveje at fjerne den kode, der blev tilføjet som en del af appens installationsproces. De fleste apps fjerner automatisk deres kode for dig, men du kan kontakte appens udvikler for at være helt sikker. Nogle apps hjælper dig med denne proces ved at ombryde deres kode i
{% comment %}
-tags, der nævner appens navn. Hvis du fjerner ubrugt appkode, er det den bedste fremgangsmåde til at undgå at køre koder for ubrugte funktioner. Det gør også din temakode lettere at læse. - Kontakt din appudvikler.
Temaer
Temaer består af Liquid-, HTML-, CSS- og JavaScript-kode. Når du redigerer eller tilpasser temaer, kan filerne blive større og derved påvirke din webydeevne.
Hvis du mener, at noget i dit tema gør din butik langsommere, kan du gøre følgende:
- Deaktiver de temafunktioner, du ikke bruger. Tænk på balancen mellem funktionalitet og hastighed i din webshop.
- Overvej at bruge en systemskrifttype.
- Rådfør dig med temaudvikleren. Hvis du bruger et gratis tema fra Shopify, kan du kontakte Shopify Support for at få vejledning.
- Hvis du bruger et tema fra tredjepart, kan du kontakte temaudvikleren eller ansætte en Shopify-partner.
- Overvej at installere et tema, der er optimeret til ydeevne, såsom Dawn.
Tema- eller appfunktioner
Visse funktioner kan også påvirke din webshops ydeevne, når de er aktiveret. Nogle pop op-vinduer til hurtig visning forhåndsindlæser f.eks. oplysninger fra alle produktsider, når en kollektionsside indlæses. Når der indlæses ekstra data, som dine kunder ikke bruger, kan det påvirke din indlæsningshastighed uden at tilføje værdi.
Hvis du mener, at en funktion gør din butik langsommere, kan du gøre følgende:
- Brug et heatmap-værktøj til at se, om dine kunder bruger bestemte funktioner. Deaktiver funktionerne, hvis de ikke bruges.
- Deaktiver funktionen, hvis du ikke har brug for den. Tænk på balancen mellem funktioner og ydeevne i din webshop.
- Rådfør dig med udviklerne af dit tema og dine apps, og spørg dem, om de forudindlæser data.
Kompleks eller ineffektiv Liquid-kode
Du kan redigere næste alt i Liquid, der bruges til at gengive din butik. Der findes både effektive og ineffektive måder at skrive Liquid-kode på. Hvis du gentagne gange udfører komplekse handlinger, kan det øge gengivelsestiden for Liquid – dette påvirker dinwebydeevne.
For eksempel, hvis du vil sortere produkter i en samling efter pris, bør du gøre det, før du gennemgår produkterne i din samling, og ikke som en del af loop-koden. Dette skyldes, at rækkefølgen af produkterne ikke ændrer sig for hvert produkt, og at beregne produkternes rækkefølge tilføjer ekstra behandlingstid til forespørgslen.
Du kan foretage følgende handlinger, hvis du er bekymret for, at din kode ikke er optimeret:
- Kør Shopify Theme Inspector til Chrome for at identificere, hvilke kodelinjer, der gør siderne i din webshop langsommere.
- Ansæt en Shopify-partner til at hjælpe dig med at finde ineffektiv eller ubrugelig kode.
Billeder og videoer
Skjulte billeder der er for store kan forstyrre indlæsningen af andre vigtigere dele af en side. Hvis brugere skal vente på , at store billeder indlæses, kan de opfatte din butik som langsom.
Shopify tilføjer nogle sikkerhedsforanstaltninger, som forhindrer dig i at overbelaste din webshop med billeder og videoer. For eksempel:
- Du må ikke have mere end 50 produkter på en kollektionsside eller 25 afsnit på din startside.
- Mange temaer udskyder indlæsningen af billeder, der ikke vises på skærmen.
- Mange temaer indlæser også en specifik størrelse billeder afhængigt af den skærmstørrelse, som billedet vises på.
Disse sikkerhedsforanstaltninger forhindrer dog ikke, at billeder og videoer kan påvirke din webshops ydeevne.
Hvis du mener, at billeder gør din butik langsommere, kan du gøre følgende:
- Læs vejledningen til billedoptimering.
- Brug kun 2-3 dias til diasshow med udvalgte billeder eller ét udvalgt billede.
- Rådfør dig med udvikleren af dit tema for at få at vide, hvordan du bedst bruger billeder sammen med deres tema.
Skrifttyper
Du kan vælge mellem flere forskellige skrifttyper til teksten i din webshop. Bemærk: Hvis du bruger en skrifttype, der ikke findes på din kundes computer, skal skrifttypen downloades, før teksten kan vises. Dette påvirker indlæsningstiden for din butik.
Hvis du vil undgå at skulle downloade en ny skrifttype på dine kunders computere, kan du bruge en systemskrifttype. En systemskrifttype er en skrifttype, der allerede er installeret på de fleste computere.
Du kan vælge en mono-, serif- eller sans serif-skrifttypefamilie. Du kan stadig bruge typografier, såsom fed eller klursiv, når du bruger en af disse skrittypefamilier.
Den skrifttype, der vises på din kundes computer, afhænger af kundens operativsystem. Herunder er nogle eksempler på de skrifttyper, der kan bruges til at gengive tekst, når du vælger en systemskrifttypefamilie:
- Mono: Menlo, Consolas, Monaco, Liberation Mono eller Lucida Console
- Sans-serif: BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu eller Helvetica Neue
- Serif: Iowan Old Style, Apple Garamond, Baskerville, Times New Roman, Droid Serif, Times eller Source Serif Pro
Værktøjer til fejlfinding
Du kan bruge følgende værktøjer til at undersøge din webshops ydeevne.
Tip: Hvis du er udvikler, kan du optimere dit tema yderligere i forhold til ydeevnen ved hjælp af Shopifys værktøjer og bedste fremgangsmåder. Få mere at vide på Shopify.dev.
PageSpeed Insights
Shopifys rapport Webydeevnekontrolpanel bruger Core Web Vitals til at måle, hvordan rigtige brugere oplever din webshop. Du kan køre dine egne rapporter ved hjælp af Google PageSpeed Insights for at få mere detaljerede parametre for siderne i din butik.
Shopify Theme Inspector til Chrome
Shopify Theme Inspector til Chrome er et profileringsværktøj, der viser ydeevnen for Liquid-gengivelser via en graf med flammer. Dette værktøj giver dig mulighed for at identificere, hvilke kodelinjer der gør siderne i din webshop langsommere. Få mere at vide om, hvordan du bruger Shopify Theme Inspector.
Få support til webshopydeevne
Hvis du bruger et gratis tema fra Shopify, vil Shopify Support muligvis kunne hjælpe dig med grundlæggende forbedringer af din effektivitet.
Hvis du bruger et tema fra tredjepart og har brug for hjælp, kan du kontakte udvikleren af dit tema eller ansætte en Shopify-partner. Få mere at vide om at ansætte en Shopify-partner.
Hvis du har et udviklingsteam eller et partnerbureau, kan du også kontakte dem for at få hjælp.