Forbedre nettbutikkens hastighet

Denne siden ble skrevet ut den Oct 22, 2021. Gå til https://help.shopify.com/nb/manual/online-store/store-speed/improving-speed for nyeste versjon.

Det er flere faktorer som påvirker hastigheten i nettbutikken din, og du har kontroll over noen av dem.

Hvis du ikke vet hvor rask nettbutikken din er i dag, kan du se Nettbutikkhastighet-rapporten.

Faktorer du ikke kan kontrollere

Kundens enhet, nettverk og plassering

Kunder som besøker nettbutikken din befinner seg over hele verden, og har ulike enheter og internettilkoblinger. Det betyr at butikken din kan laste raskere eller tregere hos dem, avhengig av disse faktorene.

Hvis en kunde kontakter deg om hastigheten i butikken din, kan du be kunden sjekke at de har siste versjon av nettleseren, at de nylig har tømt bufferen og at internett-leverandøren ikke opplever feil eller dårlig yteevne.

Shopify-infrastruktur

Shopify driver nettbutikken din på raske, globale servere, og begrenser ikke båndbredden i butikken. Du kan sjekke status for Shopify-butikken din på Shopify Status.

Shopify forbedrer kontinuerlig kode og infrastruktur. Noen av disse forbedringene kan reflekteres i hastighetspoengene dine.

Nedenfor er noen funksjoner som påvirker hastigheten i nettbutikken din.

Content Delivery Network (CDN)

CDN står for content delivery network. Shopify gir forhandlere et CDN i verdensklasse som drives av Fastly, som sikrer at nettbutikken din laster raskt over hele verden. Du kan sjekke CDN-statusen på Fastly-statussiden.

Lokalt nettleserbuffer

Butikken din bufrer, eller lagrer, midlertidig noen elementer i kundens lokale lagring. Neste gang kunden besøker nettbutikken din, kan nettleseren laste inn ressurser fra bufferet i stedet for å sende en ny forespørsel til serveren.

Shopify setter nettleserbufring for ressurser som kan bufres til ett år for hver fil. Filer som kan bufres inkluderer bildefiler, PDF-er, JS-filer og CSS-filer.

Hurtigbuffer på serversiden

I tillegg til lokal nettleserbufring, bufrer Shopify sider på serversiden. Første gang en side lastes kan den være tregere, men senere sideinnlastinger er raskere fordi kundene mottar en bufret kopi.

Ressursene i Liquid-taggen content_for_header

Liquid-taggen {% content_for_header %} setter inn ressurser som brukes av mange ulike funksjoner i nettbutikken, inkludert ytelsesanalyse og valgfrie funksjoner som dynamiske kasseknapper. Innlasting av denne taggen og tilknyttede ressurser påvirker hastigheten i butikken din. Shopify optimaliserer taggen og ressursene for å gjøre dem raskere.

Faktorer du kan kontrollere

Nedenfor er noen av faktorene som kan påvirke hastigheten i nettbutikken din, og hvordan du kan adressere dem.

Apper

Når du legger til apper for å endre funksjonaliteten eller utseendet til nettbutikken, legger de til kode i temaet slik at de kan kjøre. Noe av koden kan fjernes eller omorganiseres for å forbedre ytelsene i nettbutikken. Hvis du ikke bruker en app, kan du fjerne den.

Hvis du tror at en app gjør butikken din tregere, bør du gjøre følgende:

  • Deaktiver appfunksjoner du ikke bruker, eller fjern appen hvis du ikke trenger den. Vurder balanser mellom funksjoner i nettbutikken og hastighet.
  • Hvis du fjerner en app bør du vurdere å fjerne koden som ble lagt til som en del av installasjonsprosessen for appen. Noen apper hjelper deg med denne prosessen ved å pakke inn koden sin med {% comment %}-taggene som oppgir appnavnet.

Fjerning av ubrukt appkode er en beste praksis som unngår at det kjøres kode for ubrukte funksjoner, og gjør temakoden din enklere å lese.

  • Kontakt app-utvikleren din.
  • Lei inn en Shopify-ekspert for mer assistanse.

Temaer

Teamer består av Liquid-, HTML-, CSS- og JavaScript-kode. Når du redigerer eller tilpasser temaer, kan filstørrelsen øke og påvirke hastigheten i nettbutikken.

Hvis du tror at noe i temaet ditt gjør nettbutikken tregere, bør du gjøre følgende:

Tema- eller appfunksjoner

Enkelte funksjoner kan, når de aktiveres, også påvirke hastigheten i butikken. Noen pop-up-funksjoner for hurtigvisning forhåndslaster for eksempel informasjon fra hver produktside når en samlingsside laster. Innlasting av ekstra data som kundene ikke bruker kan påvirke hastigheten i nettbutikken uten at det tilfører verdi.

Hvis du tror en funksjon gjør butikken din tregere, kan du gjøre følgende:

Kompleks eller ineffektiv Liquid-kode

Du kan redigere nesten all Liquid-koden som brukes til å vise butikken din. Det finnes effektive og mindre effektive måter å skrive Liquid-kode på. Kompliserte operasjoner som gjøres mange ganger kan øke behandlingstiden for Liquid-koden, som påvirker den overordnede hastigheten i nettbutikken.

Hvis du for eksempel vil sortere produktene i en samling etter pris, bør du gjøre det før du kjører en løkke gjennom produktene i samlingen, og ikke som en del av løkkekoden. Dette er fordi rekkefølgen på produktene ikke endrer seg for hvert enkelt produkt, og beregning av rekkefølgen øker behandlingstiden for forespørselen.

Hvis du er bekymret for at koden din ikke er optimalisert, kan du gjøre følgende:

OBS: Shopify Theme Inspector for Chrome er ment for forhandlere og partnere som er komfortable med å lese og redigere kode. Hvis du ikke er komfortabel med å lese eller redigere kode, kan du leie inn en Shopify-ekspert som kan veilede deg. En Shopify-ekspert kan også hjelpe deg med å forbedre ytelsene i nettbutikken med resultatene fra dette verktøyet.

Bilder og videoer

Overdimensjonerte bilder og bilder som er skjult for visning kan påvirke innlastingen av andre og viktigere deler av en side. Hvis brukerne må vente på store bilder som lastes, kan de oppfatte butikken din som treg.

Shopify legger til noen sikkerhetstiltak for å hindre deg fra å overbelaste nettbutikken med bilder eller videoer. For eksempel:

  • Du kan ikke ha mer enn 50 produkter på en samlingsside eller 25 seksjoner på startsiden.
  • Mange temaer utsetter innlasting av bilder som ikke vises på skjermen for øyeblikket.
  • Mange temaer laster også inn en bestemt størrelse av et bilde basert på skjermstørrelsen det vises på.

Disse sikkerhetstiltakene hindrer imidlertid ikke helt bilder og videoer fra å påvirke ytelsene i nettbutikken din.

Hvis du tror at bilder gjør butikken din tregere, kan du gjøre følgende:

  • Gjennomgå veiledningen for bildeoptimalisering.
  • Hold lysbildefremvisninger av utvalgte bilder til 2-3 lysbilder, eller bruk ett utvalgt bilde.
  • Be temautvikleren din om råd for beste metode for å bruke bilder på temaet.
  • Lei inn en Shopify-ekspert for mer assistanse.

Skrifttyper

Du kan velge mellom flere skrifttyper for teksten i nettbutikken. Hvis du imidlertid bruker en skrift som ikke finnes på kundens datamaskin fra før, må skriften lastes ned før teksten kan vises. Dette påvirker lastetiden for butikken din.

For å unngå nedlasting av en ny skrifttype til kundens datamaskin kan du bruke en systemskrift. En systemskrift er en skrifttype som allerede er installert på de fleste datamaskiner.

Du kan velge en skriftfamilie i mono-, serif- eller sans-serif-familien. Du kan fortsatt bruke skriftstiler, som fet eller kursiv, når du bruker en av disse skriftfamiliene.

Skrifttypen som vises på kundens datamaskin er avhengig av operativsystemet deres. Under er noen eksempler på skrifttyper som kan brukes til å vise tekst når du velger en systemskriftfamilie:

  • 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

Feilsøkingsverktøy

Du kan bruke følgende verktøy til å undersøke hastigheten i nettbutikken din.

Hvis du er utvikler, kan du ytterligere optimalisere temaet for ytelser med Shopify-verktøy og beste praksis. Finn ut mer på Shopify.dev.

Lighthouse

Shopifys Nettbutikkhastighet-rapport bruker Lighthouse for å måle hastigheten til nettbutikken. Du kan kjøre din egen Lighthouse-rapport med Google PageSpeed Insights for å se mer detaljerte beregninger for sider i butikken din. For å finne ut mer om hva disse beregningene betyr, kan du se dokumentasjonen for Google Lighthouse ytelsespoeng. Du kan også leie inn en Shopify-ekspert som kan hjelpe deg med å forstå beregningene og foreslå forbedringer.

OBS: Fordi testforholdene er annerledes når de kjøres fra Google PageSpeed Insights, kan poengsummen din være en annen enn den som er oppført i Nettbutikkhastighet-rapporten. Finn ut mer om Shopifys testmiljø.

Shopify Theme Inspector for Chrome

Shopify Theme Inspector for Chrome er et profileringsverktøy som bruker et flammediagram for å vise behandlingsytelser for Liquid. Dette verktøyet hjelper deg med å identifisere hvilke kodelinjer som forsinker sider i nettbutikken. Finn ut hvordan du bruker Shopify Theme Inspector.

OBS: Denne utvidelsen er ment for forhandlere og partnere som er komfortable med å lese og redigere kode. Hvis du ikke er komfortabel med å lese eller redigere kode, kan du leie inn en Shopify-ekspert som kan veilede deg. En Shopify-ekspert kan også hjelpe deg med å forbedre ytelsene i nettbutikken med resultatene fra dette verktøyet.

Få hjelp med hastighet i nettbutikken

Hvis du bruker et gratis tema fra Shopify, kan Shopify-brukerstøtte være i stand til å hjelpe deg med grunnleggende ytelsesforbedringer.

Hvis du bruker et tredjepartstema og trenger hjelp, må du kontakte temautvikleren eller leie inn en Shopify-ekspert.

Hvis du har et utviklingsteam eller en byråpartner, kan du også ta kontakt med dem for mer hjelp.

Er du klar til å begynne å selge med Shopify?

Prøv det gratis