Att se din WordPress-webbplats laddas i snigelfart kan vara otroligt frustrerande. Efter att ha hanterat hundratals webbplatser här på WPBeginner har vi upptäckt att en av de största hastighetsdödarna är något du kanske inte ens ser: för många HTTP-förfrågningar.
Varje förfrågan om en bild, ett skript eller en fil lägger till lite mer laddningstid, vilket snabbt kan ackumuleras och få besökare att lämna. Den goda nyheten är att du inte behöver vara en utvecklare för att göra en stor skillnad i din webbplats prestanda.
Vi har satt ihop en lista över de exakta, nybörjarvänliga metoder vi använder för att minska dessa förfrågningar. Låt oss gå igenom de enkla stegen för att göra din webbplats märkbart snabbare.
Varför minska HTTP-förfrågningar i WordPress?
Har du någonsin undrat varför vissa webbplatser tar evigheter att ladda? Varje WordPress-sida är som ett pussel gjort av olika delar, som bilder, CSS-filer, JavaScript, videoinbäddningar och mer. Alla dessa komponenter måste samlas för att en sida ska visas.
Föreställ dig din webbläsare som en upptagen servitör som skyndar fram och tillbaka till köket för att samla varje ingrediens separat. Detta kan sakta ner saker och ting, särskilt om din webbplats är rik på visuella element och funktioner. Varje element bidrar till laddningstiden.
Dessutom förlitar sig våra webbplatser inte bara på vad som lagras på servern. De hämtar ofta från externa källor, som Google Analytics eller widgets för sociala medier. Medan dessa extrafunktioner kan göra din webbplats rikare och mer interaktiv, kan de, om de inte är optimerade, sakta ner din webbplats.
Dessa ooptimerade element kan bli tung bagage som frustrerar besökare som förväntar sig snabb laddning. En långsam webbplats kan leda till en sekunds fördröjning, vilket kostar dig konverteringar, sidvisningar och till och med kundnöjdhet, som lyfts fram i en studie från Strange Loop.
Relaterat inlägg: Den ultimata guiden för att öka WordPress hastighet & prestanda
Det är därför det är viktigt att minska HTTP-förfrågningar. Som vi har gjort här på WPBeginner, kan fokus på detta avsevärt förbättra din webbplats hastighet, öka användarnas engagemang och i slutändan gynna din verksamhet. Hastighet är inte bara en teknisk vinst, det är en strategisk fördel.
Hur man identifierar HTTP-begäranden
Innan vi visar dig hur du minskar HTTP-förfrågningar i WordPress, låt oss gå igenom hur du kan identifiera dem.
Du kan enkelt se HTTP-förfrågningarna som görs av din webbplats med hjälp av webbläsarens utvecklarverktyg. Detta visar dig en lista över de filer som behöver laddas för att visa webbsidan.
I Google Chrome kan du till exempel öppna utvecklarverktygen genom att gå till Visa » Utvecklare » Inspektera. Du kan också högerklicka på sidan och välja 'Inspektera' från menyn.
Navigera sedan till fliken 'Nätverk'. Ladda om sidan, så ser du en lista över alla resurser som laddats, inklusive interna och externa HTTP-förfrågningar.
För att enkelt se endast externa HTTP-förfrågningar, leta efter filterfältet högst upp i Nätverkspanelen och markera rutan "3rd-party requests". Detta döljer alla filer som laddas från din egen domän.
Om du bara vill se vissa typer av filer som kan påverka din laddningstid, som t.ex. JS (JavaScript) eller CSS, använd då helt enkelt knapparna högst upp för att filtrera listan.
Se upp för filer som är långsamma att ladda. Du kan titta i kolumnen 'Tid' för att se hur lång tid det tar för varje av dessa resurser att laddas. Sedan kan du klicka på rubriken för den här kolumnen för att sortera listan efter tid, och om du klickar på den en andra gång placeras de långsammast laddande filerna högst upp.
När du tittar på den fjärde kolumnen 'Initiator' kommer du ibland att se namnet på pluginet eller temat som laddade filen. Notera eventuella plugins eller teman som begär långsamt laddande filer.
Du kan använda tredjepartsverktyg som Pingdom för att få en mer detaljerad rapport. För mer information, kolla in vår guide om hur man spårar tredjepartsdomänbegäranden i WordPress.
Nu när du vet hur du identifierar HTTP-förfrågningar, låt oss dyka ner i de mest effektiva sätten att minska dem på din WordPress-webbplats.
- Kombinera CSS- och JavaScript-filer
- Ladda bilder och videor lat
- Använd ett Content Delivery System (CDN)
- Utnyttja webbläsarcache
- Minimera användningen av externa resurser
- Bonus: Aktivera Gzip-komprimering
- Vanliga frågor om att minska HTTP-förfrågningar
- Ytterligare resurser om WordPress-prestanda
1. Kombinera CSS- och JavaScript-filer
Det bästa sättet att minska antalet HTTP-förfrågningar som görs till din webbplats är att minska antalet filer som behöver nås. Du kan kombinera flera filer för att minska HTTP-förfrågningar utan någon förlust av funktionalitet.
Till exempel, istället för att ha flera CSS-filer för olika delar av din webbplats design, kan du slå ihop dem till en enda fil. Denna enda fil kommer att innehålla all nödvändig stylingkod, och webbläsaren behöver bara göra en begäran istället för många.
På samma sätt kan du kombinera flera JavaScript-filer till en, vilket minskar antalet förfrågningar som behövs för att ladda de interaktiva elementen på din webbplats.
Observera: Även om det är en bra praxis att kombinera filer, är det bra att veta att moderna webbprotokoll som HTTP/2 kan ladda flera små filer mycket snabbt, ibland till och med snabbare än en stor fil.
Men för webbplatser med äldre hosting eller för maximal kompatibilitet, är att kombinera och minifiera filer fortfarande en solid strategi för att minska antalet förfrågningar. Verktyg som WP Rocket hanterar detta intelligent åt dig! 👍
Flera WordPress-plugins kan automatisera denna process åt dig. Populära alternativ inkluderar WP Rocket (premium) och Autoptimize (gratis).
För detaljerad information om hur du använder dessa plugins, se vår guide om hur man fixar render-blocking JavaScript och CSS i WordPress.
Förutom att kombinera dina filer kommer dessa plugins också att minimera dem. Detta tar bort onödiga tecken, som blanksteg och kommentarer, från koden, vilket gör filerna mindre utan att påverka deras funktionalitet.
Detta förbättrar ytterligare laddningshastigheten genom att minska mängden data som behöver laddas ner.
2. Ladda bilder och videor vid behov
Lat laddning är ett annat bra sätt att förbättra din webbplats prestanda, särskilt om dina sidor innehåller många bilder eller videor.
Det är värt att notera att WordPress automatiskt lat laddar bilder som standard, vilket är en bra början. Plugins som WP Rocket ger dig dock mer kontroll och kan även lat ladda videor och iframes, vilket kan göra en ännu större skillnad.
Normalt laddar WordPress alla mediefiler innan en webbsida visas, även om dessa bilder eller videor är längre ner på sidan och inte omedelbart synliga för användaren. Detta kan avsevärt öka den initiala sidladdningstiden.
Lazy loading optimerar denna process genom att fördröja laddningen av bilder och videor tills de är på väg att rullas in i användarens vy.
Dessa hjälpsamma handledningar hjälper dig att lära dig hur du ställer in lazy loading på din WordPress-webbplats:
- Hur man enkelt laddar bilder lat i WordPress
- Hur man enkelt lägger till lazy loading för videor i WordPress
- Hur man lazy-laddar Gravatars i WordPress-kommentarer
3. Använd ett Content Delivery Network (CDN)
Att använda ett Content Delivery Network (CDN) är en annan effektiv strategi för att förbättra din WordPress-webbplats laddningshastighet, särskilt för användare som befinner sig långt från din webbserver.
Till skillnad från de tidigare metoderna minskar inte ett CDN antalet HTTP-begäranden. Istället optimerar det hur dessa begäranden hanteras.
Normalt lagras din webbplats filer på en enda webbserver, och användare från hela världen måste begära filer från denna enda plats.
Ett CDN lagrar kopior av din webbplats filer på snabba servrar placerade runt om i världen, och de levereras till användarens webbläsare från den server som ligger närmast dem.
Du kanske vill se vår expertjämförelse av de bästa WordPress CDN-tjänsterna för att lära dig vilket alternativ som passar din webbplats bäst.
På WPBeginner använder vi Cloudflare för att förbättra vår sidladdningshastighet, och du kan följa vår steg-för-steg-handledning om hur man ställer in Cloudflare gratis CDN i WordPress.
4. Utnyttja webbläsarcache
Du kan också utnyttja webbläsarcachelagring för att minska HTTP-förfrågningar till din webbplats, särskilt om du har återkommande användare som ofta besöker din webbplats.
När en användare besöker din webbplats för första gången laddar deras webbläsare ner alla nödvändiga resurser, som bilder, stilmallar och JavaScript-filer. Webbbläsar-cache låter webbläsaren lagra kopior av dessa filer lokalt på användarens dator.
Nästa gång de besöker din webbplats kontrollerar webbläsaren sin lokala cache innan den gör HTTP-förfrågningar till din server. Om en kopia av en fil som inte har gått ut hittas i cachen, använder webbläsaren den lokala filen istället för att ladda ner den igen.
Detta minskar antalet HTTP-förfrågningar till din server avsevärt, vilket resulterar i snabbare laddningstider för återkommande besökare.
Men om ditt webbplatsinnehåll uppdateras ofta, är det viktigt att ställa in lämpliga utgångstider för cachade resurser. Detta säkerställer att dina användare så småningom får de senaste versionerna av dina filer.
Du kan styra hur länge resurser cachas genom att lägga till Expires-huvuden i WordPress. Dessa huvuden talar om för webbläsaren när en cachad fil ska betraktas som föråldrad och behöver laddas ner igen från din server.
5. Minimera användningen av externa resurser
Många WordPress-plugins och teman laddar resurser som skript, stilmallar och bilder från externa webbplatser, som Google Analytics, Facebook och teckensnittleverantörer.
Dessa externa HTTP-begäranden kan påverka din webbplats laddningshastighet, eftersom webbläsaren behöver ansluta till flera servrar för att hämta alla nödvändiga komponenter.
Även om dessa externa resurser är optimerade för hastighet, kan användningen av för många av dem sakta ner din webbplats prestanda.
För att minska dessa externa HTTP-förfrågningar kan du börja med att inaktivera och ta bort plugins och teman som du faktiskt inte behöver.
Du bör också överväga att hitta alternativ för alla plugins eller teman som begär långsamt laddande filer. Du kanske har märkt några när du identifierade HTTP-förfrågningar tidigare.
Och när du väljer WordPress-plugins, var medveten om de externa resurser de laddar. Du vill välja plugins som prioriterar prestanda och undvika de som laddar överdrivna externa skript eller stilar.
För mer detaljerad kontroll över plugins, överväg att använda ett pluginhanteringsverktyg som Plugin Organizer. Detta gör att du selektivt kan ladda plugins endast på de sidor där de behövs.
Slutligen laddas anpassade webbtypsnitt ofta från externa leverantörer, som Google Fonts, och kan avsevärt bidra till HTTP-begäranden. Du bör begränsa antalet typsnittsfamiljer och vikter du använder eller utforska att använda systemtypsnitt, som redan är installerade på användarnas datorer.
På WPBeginner gick vi över till systemtypsnitt 2021, vilket förbättrade våra sidladdningstider, särskilt för användare med långsammare internetanslutningar. Du kan lära dig att göra detsamma i vår guide om hur man inaktiverar Google-typsnitt på din WordPress-webbplats.
6. Bonus: Aktivera Gzip-komprimering
Ett sista tips är att aktivera GZIP-komprimering för att minska storleken på filerna på din webbserver.
Även om detta inte direkt minskar antalet HTTP-förfrågningar, snabbar det upp processen och gör överföringen av dina webbplatsfiler snabbare.
Vanliga frågor om att minska HTTP-förfrågningar
Nedan följer några av de vanligaste frågorna vi får om optimering av HTTP-förfrågningar och förbättring av WordPress-webbplatsens hastighet.
1. Vad är en HTTP-förfrågan?
En HTTP-förfrågan är när en webbläsare ber en server om en informationsdel som behövs för att ladda en webbsida. Detta kan vara en bild, en stilmall (CSS-fil), ett skript (JavaScript-fil) eller någon annan del av din webbplats. Varje enskild fil kräver en separat förfrågan.
2. Hur många HTTP-förfrågningar är för många för en webbplats?
Det finns inget enskilt magiskt nummer, eftersom det beror på din webbplats komplexitet. Ett bra mål för de flesta småföretagswebbplatser är dock att hålla sig under 50-60 förfrågningar per sida. Ju färre förfrågningar din webbplats behöver göra, desto snabbare laddas den vanligtvis för dina besökare.
3. Vad är det enklaste sättet för en nybörjare att minska HTTP-förfrågningar?
För nybörjare är den enklaste metoden att använda ett cache- och optimeringsplugin som WP Rocket. Det kan automatiskt kombinera CSS- och JavaScript-filer med bara några få klick, vilket avsevärt minskar antalet förfrågningar utan att du behöver röra någon kod.
4. Minskar ett CDN antalet HTTP-förfrågningar?
Nej, ett Content Delivery Network (CDN) minskar inte det faktiska antalet förfrågningar. Istället gör det dem mycket snabbare. Ett CDN lagrar kopior av dina filer på servrar runt om i världen, så när en användares webbläsare begär en fil levereras den från närmaste möjliga plats, vilket minskar laddningstiden.
Ytterligare resurser om WordPress-prestanda
Vi hoppas att den här handledningen hjälpte dig att lära dig hur du minskar HTTP-förfrågningar i WordPress. Du kanske också vill kolla in våra andra experthandledningar för att förbättra webbplatsens hastighet och prestanda.
Testa och diagnostisera din webbplatshastighet
- Hur man korrekt kör ett hastighetstest av en webbplats
- Hur du använder GTmetrix för att förbättra webbplatsens prestanda
- Hur man stresstestar en WordPress-webbplats
Kärnprestandaförbättringar
Avancerade optimeringstekniker
- Hur snabb PHP & MySQL kan öka webbplatsens hastighet
- Hur man undviker enorma nätverksnyttolaster i WordPress
Om du gillade den här artikeln, prenumerera då på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.
Har du en fråga eller ett förslag? Lämna gärna en kommentar för att starta diskussionen.