På WPBeginners 10-årsjubileum delade jag att vår hostinginfrastruktur fick en enorm uppgradering tack vare vår webbhotellspartner, HostGator. Därefter undrade många av våra läsare exakt hur vi fick WPBeginner att laddas blixtsnabbt, och jag började få e-postmeddelanden som frågade efter detaljerna.
Ja, WPBeginner laddar snabbare än de flesta statiska webbplatsbyggare och i vissa fall snabbare än Google AMP-sidor också. Detta handlar inte bara om skryträttigheter; det handlar om att dela de exakta teknikerna vi använde för att få WordPress att prestera på sin absoluta topp.
I den här artikeln kommer jag att ge dig en exklusiv inblick bakom kulisserna i hur vi optimerade WordPress för att vara snabbare än statiska webbplatsgeneratorer och headless CMS-plattformar.
Notera: Den här artikeln är lite mer teknisk än vad vi vanligtvis publicerar på WPBeginner. För icke-tekniska användare rekommenderar jag att du följer vår ultimata guide om hur du snabbar upp WordPress.
Uppdatering: Vi använder inte längre den konfiguration som delas i den här artikeln. Istället har vi helt gått över till Google Cloud-plattformen som hanteras av SiteGround. Vi har samma hastighetsresultat och har låst upp ännu snabbare prestanda i backend. Läs varför vi bytte till SiteGround.
Bakgrund
Nyligen har WordPress fått mycket dåligt rykte från "moderna" utvecklare där de säger att WordPress är långsamt.
Uttalandet följs vanligtvis upp med att du bör byta till en JAMstack statisk webbplatsgenerator som GatsbyJS. Andra inom företagsverksamheten kommer att säga att du bör byta till ett headless CMS som Contentful.
Flera av mina mycket framgångsrika entreprenörsvänner började fråga mig om detta var sant.
Vissa har till och med påbörjat processen att migrera till ett headless CMS eftersom de läst fallstudier om hur andra uppnådde enorma hastighetsförbättringar genom att byta från WordPress till statiska webbplatsgeneratorer.
Detta var mycket frustrerande för mig eftersom jag visste att de slösade tiotusentals dollar på migrationskostnader. För att inte tala om de oändliga anpassningskostnaderna som kommer att ackumuleras i framtiden.
Så jag tog det som en utmaning att bevisa att en stor WordPress-innehållssajt som WPBeginner kan laddas lika snabbt, om inte snabbare, än de flesta moderna statiska webbplatsgeneratorer.
Du kan kalla mig gammaldags, men i slutändan är en statisk webbplats bara en sida som laddas från cache.
Resultat
Innan jag hoppar till den exakta WordPress-värdskap-infrastrukturen, serverkonfigurationerna och plugins, tror jag att det är bra att dela med mig av resultaten.
Så här snabbt laddas WPBeginners startsida på Pingdom från deras server i Washington, DC:
Beroende på tid på dygnet och platsen du kontrollerar från, kommer detta resultat att variera mellan 400 ms – 700 ms, vilket är ganska snabbt för en startsida.
Här är ett test som jag körde för en enskild inläggssida eftersom den har större bilder och mer innehåll:
Vi fick också ett perfekt resultat på "100" i Google page speed test för datorer. Även om vi har lite utrymme för förbättring på mobilresultatet.
Resultaten ovan gäller cachade sidor, vilket är vad våra läsare och sökmotorrobotar får när de besöker vår webbplats. Den upplevda laddningstiden för WPBeginner är nära omedelbar (mer om detta senare).
Som jämförelse, här är ett resultat från ett hastighetstest för Gatsby:s startsida. Detta är en populär statisk webbplatsbyggare som många utvecklare hyllar:
Här är hastighetstestresultatet för Netlifys hemsida, en populär värd för statiska webbplatser som många utvecklare rekommenderar. Lägg märke till att de har hälften så många förfrågningar, och deras sidstorlek är 30 % av WPBeginner, men den laddas ändå långsammare än vår hemsida.
Hemsidans hastighet för Contentful, det headless CMS som är "hur företag levererar bättre digitala upplevelser", är helt enkelt inte optimerad alls. Detta var den långsammaste webbplatsen vi testade.
Jag delar dessa statistik inte för att misskreditera de andra ramverken, utan snarare för att ge perspektiv på att inte alla nya saker är så glänsande som de kan verka.
WordPress med en korrekt hostinginfrastruktur och optimeringar kan vara lika snabb som vilken statisk webbplatsgenerator som helst. Dessutom kommer ingen annan plattform ens i närheten av den flexibilitet som WordPress erbjuder företagare genom sitt stora ekosystem av plugins och teman.
WPBeginner Hosting Infrastructure
När det gäller webbplatshastighet spelar inget en viktigare roll än din webbhotellsinfrastruktur.
Som många av er redan vet har jag varit en HostGator-kund sedan 2007. Jag startade WPBeginner-bloggen 2009 på ett litet HostGator delat webbhotell-konto.
När vår webbplats växte uppgraderade vi till deras VPS-hosting och sedan dedikerade servrar.
Under det senaste decenniet har jag haft möjlighet att arbeta nära många av deras teammedlemmar, och de har blivit en utökad del av WPBeginner-familjen.
Så när jag tog mig an utmaningen att göra WPBeginner snabbare än statiska webbplatsbyggare, vände jag mig till dem för hjälp.
Jag delade min vision med deras ledningsteam, och de erbjöd sig att hjälpa mig att bygga en unik företags-hostinglösning för WPBeginner.
De satte de bästa ingenjörerna från både Bluehost- och HostGator-teamen att arbeta nära med mig för att göra WPBeginner blixtsnabbt.
Här är en översikt över hur WPBeginners hosting-inställning ser ut:
Som ni kan se är detta en installation med flera servrar utspridd över två geografiska regioner (Texas och Utah). Det finns totalt 9 servrar, exklusive molnet för lastbalanseraren. Varje server är en Xeon-D CPU med 8 kärnor (16 trådar) med 32 GB RAM och 2 x 1 TB SSD (RAID-konfiguration).
Vi använder Googles molnbelastningsbalanseringsplattform, så vi kan ha sömlös automatisk skalning och belastningsbalansering, över hela världen.
Once the hardware was set up with proper data syncing in place, the Bluehost and HostGator teams worked together to optimize the server configurations for WordPress. My hope is that some of these optimizations will soon make it into future WordPress hosting plans 
Serverkonfigurationssammanfattning
Att sammanfatta serverkonfigurationerna för denna komplexa installation på bara några få stycken är mycket svårt, men jag ska göra mitt bästa.
Vi använder Apache för vår webbserverprogramvara eftersom teamet är mer bekant med den. Jag kommer inte att gå in på NGINX vs Apache-debatten.
Vi använder PHP 7.2 tillsammans med PHP-FPM-pooler, så vi kan hantera höga belastningar av processer och förfrågningar. Om ditt webbhotell inte använder PHP 7+ missar du allvarliga hastighetsoptimeringar.
Vi använder Opcode-caching med en avancerad cache-värmare för att säkerställa att ingen verklig användare ska uppleva en okrypterad sidvisning.
Vi använder också objekts-cache med memcache, så vi kan förbättra svarstiden för okrypterade sidträffar och andra API-svarstider i WordPress admin-område för inloggade användare (våra skribenter). Här är en nätverksladdningsflik av vår skärm "Alla inlägg" i WordPress admin:
För att sätta det i perspektiv är vår upplevelse i adminområdet nu 2 gånger snabbare än vad vi hade tidigare.
För vår databasserver bytte vi från MySQL till MariaDB, som är en klon av MySQL men snabbare och bättre. Vi bytte också från HyperDB till LudicrousDB eftersom det hjälper oss att förbättra vår databasreplikering, failover och lastbalansering.
Det finns också många andra konfigurationer som hjälper oss med prestanda och skalbarhet, såsom HTTP/2 och HSTS för snabbare anslutning + kryptering, möjligheten att starta ytterligare servrar i nya regioner vid datacenteravbrott, etc.
Jag känner att jag inte gör rättvisa åt den fantastiska uppsättning som teamet har byggt, men snälla vet att min kärnstyrka är marknadsföring. Ja, jag är en bloggare som skriver om WordPress, men mycket av de tekniska optimeringarna här ligger långt över min lön.
De gjordes av superintelligenta ingenjörer i Endurance-teamet, inklusive David Collins (cheftarkitekt för Endurance / CTO för HostGator), Mike Hansen (kärn WordPress-utvecklare) och andra som jag kommer att tacka i avsnittet med tack nedan.
CDN, WAF och DNS
Förutom webbhotell är de andra områden som spelar en betydande roll för din webbplatshastighet din DNS-leverantör, ditt innehållsleveransnätverk (även kallat CDN) och din webbapplikationsbrandvägg (WAF).
Även om jag listar det som tre separata saker, erbjuder många företag nu dessa lösningar i ett paketerat abonnemang, som till exempel Sucuri, Cloudflare, MaxCDN (nu StackPath CDN), etc.
Eftersom jag vill ha maximal kontroll och sprida risken använder jag tre separata företag för att hantera varje del effektivt.
WPBeginner DNS drivs av DNS Made Easy (samma företag som Constellix). De rankas konsekvent som de snabbaste DNS-leverantörerna i världen. Fördelen med DNS Made Easy är att jag kan göra global trafikdirigering när ett specifikt datacenter på mitt CDN eller WAF inte fungerar korrekt för att säkerställa maximal drifttid.
Vårt CDN drivs av MaxCDN (nu StackPath CDN). De tillåter oss i princip att leverera våra statiska tillgångar (bilder, CSS-filer och JavaScript) från deras stora nätverk av servrar över hela världen.
Vi använder Sucuri som vår webbapplikationsbrandvägg. Förutom att blockera attacker fungerar de också som ett ytterligare lager av CDN, och deras totala prestanda är helt enkelt fantastisk. Jag tror att de har den bästa WordPress brandväggslösningen på marknaden.
När du arbetar med optimering av webbplatshastighet är varje millisekund viktig. Därför gör användningen av dessa lösningsleverantörer i kombination med vår nya webbhotellsinfrastruktur en enorm skillnad.
Som illustration, här är vattenfallsnedbrytningen av WPBeginner.com vs GatsbyJS.org vs CloudFlare.com:
Lägg märke till att WPBeginners DNS-tid, SSL-tid, anslutningstid och väntetid alla är toppklass jämfört med dessa andra populära webbplatser. Var och en av dessa förbättringar samverkar för att ge de bästa resultaten.
Instant.page, optimerade bilder och andra bästa metoder
En av sakerna du kanske har märkt är den nästan omedelbara laddningstiden när du bläddrar bland WPBeginners inlägg och sidor.
Förutom alla saker jag nämnde ovan, fuskar vi också med latens genom att använda ett skript som heter instant.page som använder just-in-time förladdning.
I grund och botten, innan en användare klickar på en länk, måste de föra muspekaren över länken. När en användare har fört muspekaren över länken i 65 ms (en mycket kort tidsperiod), kommer en av två faktiskt att klicka på länken.
Instant.page-skriptet börjar förladda den sidan just nu, så när användaren faktiskt klickar på länken är mycket av det tunga arbetet redan gjort. Detta gör att den mänskliga hjärnan uppfattar webbplatsens laddningstid som nästan omedelbar.
För att aktivera Instant.page på din webbplats kan du helt enkelt installera och aktivera Instant Page WordPress-pluginet.
Detta skript är ganska snyggt. Jag rekommenderar starkt att du besöker deras webbplats och klickar på knappen "testa din klickhastighet" för att se hur det lurar hjärnan.
Uppdatering: Jag har inaktiverat instant.page för tillfället och kommer att testa FlyingPages-pluginet inom en snar framtid. Gijo Varghese delade sitt nya plugin med mig i WPBeginner Engage Facebook-grupp, och det verkar kombinera det bästa av instant.page och quicklink-skriptet.
Optimera bilder för webben
Medan det utvecklas nya bildformat som webp, använder vi dem ännu inte. Istället ber vi alla våra skribenter att optimera varje bild med hjälp av TinyPNG-verktyget.
Du kan också automatisera bildkomprimeringen med plugins som Optimole eller EWWW Image Optimizer.
Jag föredrar dock personligen att teamet gör detta manuellt, så att vi inte laddar upp stora filer på servern.
För närvarande gör vi ingen lat laddning av bilder, men jag planerar att lägga till det inom en snar framtid nu när Google har inbyggt stöd för lat laddning i Chrome 76 inbyggt i Chrome 76.
Det finns också en biljett i WordPress kärna för att lägga till denna funktion på alla webbplatser (hoppas verkligen att detta händer snart), så jag behöver inte skriva en anpassad plugin.
Begränsa HTTP-frågor + Bästa praxis
Beroende på vilka WordPress-plugins du använder, kommer vissa att lägga till ytterligare CSS- och JavaScript-filer vid varje sidladdning. Dessa ytterligare HTTP-förfrågningar kan komma ur kontroll om du har många plugins på din webbplats.
För mer information, se hur WordPress-plugins kan påverka din webbplats laddningstid.
Nu innan du drar den felaktiga slutsatsen att för många WordPress-plugins är dåliga, vill jag låta dig veta att det finns 62 aktiva plugins som körs på WPBeginner-webbplatsen.
Det du behöver göra är att kombinera CSS- och JavaScript-filer där det är möjligt för att minska HTTP-förfrågningar. Vissa WordPress-cache-plugins som WP Rocket kan göra detta automatiskt med sin minifieringsfunktion.
Du kan också följa instruktionerna i den här artikeln för att göra det manuellt, vilket är vad vårt team på WPBeginner har gjort.
Bortsett från HTTP-förfrågningar som plugins och teman lägger till, vill du också vara medveten om andra tredjepartsskript som du lägger till på din webbplats eftersom varje skript kommer att påverka din webbplats hastighet.
Till exempel, om du kör många annonsskript eller retargetingskript, kommer de att sakta ner din webbplats. Du kanske vill använda ett verktyg som Google Tag Manager för att villkorligt ladda skript endast när de behövs.
Om du är en annonsstödd webbplats som TechCrunch eller TheNextWeb, finns det väldigt lite du kan göra åt detta eftersom det inte är ett alternativ att ta bort annonser.
Lyckligtvis förlitar sig WPBeginner inte på tredjepartsannonser för att tjäna pengar. Vill du se hur WPBeginner tjänar pengar? Se mitt blogginlägg om WPBeginner-inkomst.
Lärdomar (hittills) + Mina slutliga tankar
Detta är en helt ny värdinfrastruktur, och jag är säker på att det finns massor av lärdomar jag kommer att dra över tid.
Hittills älskar jag hastighetsförbättringarna eftersom de har hjälpt oss att förbättra våra SEO-rankningar, och vårt administratörsområde är mycket snabbare.
Med den nya multi-serverkonfigurationen introducerade vi ett nytt driftsättningsflöde för att få WPBeginner i linje med resten av Awesome Motives produktwebbplatser.
Vad detta innebär är att vi nu har korrekt versionshantering inbyggd, och det finns åtgärder på plats för att hindra mig från att vara vårdslös (dvs. att lägga till plugins utan ordentlig testning, uppdatera plugins från instrumentpanelen utan testning, etc).
Dessa förändringar banade också vägen för mig att äntligen kliva ur utvecklingen och överlämna rodret för WPBeginner-webbplatsen till vårt utvecklingsteam.
Jag har motstått detta i åratal, men jag tror att tiden kommer, och jag behöver bara acceptera det.
Den nya installationen har inte cPanel eller WHM, så detta gör mig praktiskt taget oanvändbar ändå eftersom jag inte är särskilt flytande med kommandoraden längre.
Hittills har vi lärt oss två stora läxor:
Först och främst är att uppdatera WordPress inte helt okomplicerat på grund av serverns synkronisering/replikering. När vi uppgraderade min personliga blogg (SyedBalkhi.com) till WordPress 5.2, synkroniserades inte uppdateringsfilerna ordentligt på en av webbnoderna, och felsökningen tog mycket längre tid än förväntat. Vi arbetar på att bygga en bättre process för byggande/testning för detta.
För det andra behöver vi ha bättre kommunikation mellan teamen eftersom vi hade en mindre kris med felkonfigurerade lastbalanserare, vilket resulterade i en del driftstopp. För att göra saken värre var jag på en transatlantisk flygning med Turkish Airlines, och WiFi fungerade inte.
Lyckligtvis löstes allt tack vare den snabba svarstiden från hostingteamet, men detta hjälpte oss att skapa flera nya Standard Operating Procedures (SOPs) för att bättre hantera incidenten i framtiden.
Sammantaget är jag mycket nöjd med installationen, och jag vet att några av cachekonfigurationerna/optimeringarna som gjordes för WPBeginner kommer att bli en standarddel av HostGator Cloud och Bluehost WordPress hosting-planer.
Jag tror att det borde vara självklart att om du bara startar en webbplats, blogg, eller en webbutik, då behöver du INTE denna sofistikerade företagsinstallation.
Jag rekommenderar alltid att du börjar smått med HostGators delade eller Bluehosts delade planer som jag gjorde, och sedan uppgraderar din hostinginfrastruktur allt eftersom din verksamhet växer.
Du kan tillämpa många av de optimeringar som jag delade ovan på dina nuvarande WordPress hosting-planer.
Till exempel, Bluehosts standardplan levereras redan med en inbyggd cache-plugin som du kan använda, och de erbjuder PHP 7 som standard också.
Du kan kombinera det med en CDN + WAF som Sucuri för att avsevärt snabba upp din webbplats.
Om du nu är ett medelstort/stort företag som vill ha en liknande hosting-konfiguration, vänligen kontakta mig via vårt kontaktformulär. Jag kan hjälpa dig att hitta rätt väg.
Särskilda tack + erkännanden
Medan jag i artikeln ovan har gett massor av omnämnanden till HostGator och Bluehost varumärken, vill jag ta ett ögonblick att erkänna och uppskatta de enskilda personer som arbetade bakom kulisserna för att få det att hända.
Först vill jag tacka Endurance ledningsteam Suhaib, Mitch, John Orlando, Mike Lillie och Brady Nord för att de gick med på att hjälpa mig med utmaningen.
Jag vill också tacka Mike Hansen, David Collins, Rick Radinger, Chris Miles, David Ryan, Jesse Cook, David Foster, Micah Wood, William Earnhardt, Robin Mendieta, Rod Johnson, Alfred Najem och andra i datacenterteamet för att de faktiskt har gjort det hårda arbetet och fått det att hända.
Jag vill ge ett särskilt omnämnande till Steven Job (grundare av DNSMadeEasy) för att snabbt ha svarat på mina frågor och hjälpt mig att bättre förstå vissa inställningar. Vill också ge ett omnämnande till Tony Perez och Daniel Cid på Sucuri för att alltid ha ryggen fri.
Sist men inte minst vill jag ge särskilt erkännande till Chris Christoff. Han är medgrundare av MonsterInsights, och han var vänlig nog att hjälpa mig med mycket av testningen och driftsättningen.
Vanliga frågor (FAQ)
Vi förstår att detta är mycket teknisk information att ta in. Här är svaren på några av de vanligaste frågorna vi får om WordPress hastighet och prestanda.
Behöver jag en komplex hosting-konfiguration som WPBeginners för att ha en snabb webbplats?
Absolut inte. Den här fallstudien visar vad som är möjligt på företagsnivå. För de flesta användare är det perfekta utgångspunkten att börja med en högkvalitativ delad hostingplan från Bluehost eller HostGator. Du kan alltid uppgradera när din webbplats växer.
Vilka är de viktigaste faktorerna för WordPress-hastighet?
De tre pelarna för webbplatshastighet är din webbhotellsinfrastruktur, cachning och ett Content Delivery Network (CDN). Att få dessa tre saker rätt kommer att lösa de största prestandaflaskhalsarna för de flesta WordPress-webbplatser.
Kan jag göra min WordPress-sajt snabb utan att vara en teknisk expert?
Ja. Även om den här artikeln är teknisk, behöver du inte förstå allt i den. Genom att följa nybörjarvänliga guider, använda ett bra cache-plugin som WP Rocket och optimera dina bilder, kan du göra en enorm skillnad för din webbplats hastighet utan någon kodningskunskap.
Saktar många plugins ner WordPress?
Det är inte antalet plugins, utan deras kvalitet som spelar roll. Ett välkodat plugin kommer att ha en minimal påverkan. Däremot kan dåligt kodade plugins lägga till onödig kod och databasfrågor som saktar ner din webbplats.
Ytterligare resurser för att förbättra webbplatsens prestanda
Om du fann denna fallstudie hjälpsam, har vi andra guider som guidar dig genom steg-för-steg-processen för att göra din WordPress-webbplats snabbare. Kolla in dem för fler handlingsbara tips:
- Den ultimata guiden för att öka WordPress hastighet och prestanda – Vår mest omfattande guide för användare på alla nivåer för att förbättra webbplatsens hastighet.
- Hur du väljer bästa WordPress-värden – Lär dig hur du väljer rätt värdleverantör för dina behov och din budget.
- Varför du behöver ett CDN för din WordPress-blogg – En detaljerad förklaring av hur ett CDN fungerar och varför det är viktigt för hastigheten.
- WPBeginners Blueprint – Se hela listan över verktyg och plugins vi använder för att driva WPBeginner idag.
Bonus: Här är de bästa WordPress-plugins och verktyg som jag rekommenderar för alla WordPress-webbplatser. Du kanske också vill titta på WPBeginners Blueprint, som listar de plugins och verktyg som vi använder för att driva WPBeginner-webbplatsen idag.
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.
Moinuddin Waheed
Jag uppskattar verkligen det här inlägget för att ha låtit oss få en inblick bakom kulisserna av hemligheterna för wpbeginner snabb hastighet.
Jag har alltid velat veta de hemliga ingredienserna för detta otroliga resultat.
Jag tror att det är kombinationen av många verktyg och en samlad ansträngning från teamet som har lett till denna stora prestanda.
Detta ger oss förnyat hopp i wordpress och att wordpress-webbplatser kan hantera en enorm trafik och ändå laddas snabbt.
Tack för detta underbara inlägg.
Jiří Vaněk
Jag har alltid undrat vad som ligger bakom hastigheten på din webbplats. Jag förväntade mig din egen server och en förbättrad cachningsmiljö, men jag förväntade mig verkligen inte en så skräddarsydd robust lösning. Det är fantastiskt att ni låter oss se bakom kulisserna på hur den här webbplatsen är byggd. Och det är också fantastiskt att ni visar världen att även WordPress med ett riktigt stort antal användare kan vara otroligt snabbt, även om det också kräver en hel del kraft. Tack för att ni delar med er av er kunskap och ger oss möjlighet att se infrastrukturen på er webbplats och vad exakt hela servern körs på. Det är en riktigt intressant läsning.
WPBeginner Support
Glad we could share how we made our site as fast as it is
Admin
Onur
Jag undrar varför wpbeginner inte använder wordpress.com
Finns det någon specifik anledning?
Vänligen förklara för mig
WPBeginner Support
Vi använder WordPress.org för vår webbplats, du kan se detaljerna om de två i vår artikel nedan!
https://www.wpbeginner.com/beginners-guide/self-hosted-wordpress-org-vs-free-wordpress-com-infograph/
Admin
asantos
Den här artikeln är otrolig.
Tack för att du delade!
WPBeginner Support
You’re welcome, glad our guide was helpful
Admin
Cadu de Castro Alves
Fantastisk artikel! Jag älskar att se andra perspektiv på WordPress-optimering än att migrera till headless eller andra CMS.
Jag personligen gillar inte jämförelser av laddningshastighet för startsidor, särskilt för nyhets-/bloggwebbplatser eftersom startsidan vanligtvis inte är den mest besökta sidan.
Så jag skulle gärna vilja se laddningshastighetsprestanda för inläggssidor i olika miljöer/plattformar.
Tack för att du delade detta!
WPBeginner Support
You’re welcome, glad you like our content
Admin
Joseph
Än en gång levererade wpbeginner. Den här artikeln är en för mycket. Det här är fantastiskt, jag måste spara den här sidan och läsa den igen.
WPBeginner Support
Thank you, glad our article was helpful
Admin
Chris
[blockquote]Det finns också en biljett i WordPress kärna för att lägga till den här funktionen på alla webbplatser (hoppas verkligen att detta händer snart), så jag slipper skriva ett anpassat plugin.[/blockquote]
Jag skrev en enkel funktion för att täcka det. Tills lazy-loading kommer in i kärnan kan du prova den. Jag skulle vilja höra din feedback om du använder den.
https://github.com/seezee/wp-lazy
Redaktionell personal
Tack Chris. Google släppte också sitt några timmar efter att jag publicerade inlägget – https://wordpress.org/plugins/native-lazyload/
Admin
Jarret
Jag ser egentligen inte var du gjorde din webbplats snabbare än en statisk webbplatsgenerator.
Visst, du spenderade tid på att optimera din egen webbplats för att laddas så snabbt som möjligt, jämförde den sedan med startsidan för en domän med statisk webbplatsgenerator som troligen är utformad för att visa viktig information för en besökare snarare än att laddas så snabbt som möjligt.
Du borde ha konfigurerat en domän med var och en av de statiska generatorerna, optimerat den som du har gjort med din egen webbplats, satt ett CDN framför den och sedan jämfört dessa testdata.
Redaktionell personal
Vårt startsidesinnehåll är dynamiskt och uppdateras varje dag för att visa besökarna viktigt innehåll och nya blogginlägg.
I compared headless CMS and other static generator homepages because you’d hope that those claiming performance boosts would practice what they preach
Admin
Mathukutty P V
Min svarfråga till den här tråden https://www.facebook.com/wpbeginner/posts/10157550202524100?comment_id=10157552775709100 ledde till den här artikeln. Bra artikel. För några dagar sedan tog jag bort shortpixel-pluginet och använde online tinypng för att komprimera bilder. Installerat Flying pages för att testa. Planerar att byta värd, från Godaddy till en annan. Jag pratade med Bluehost India idag, priset är lite högre än Godaddy, men de ger gratis SSL, jag vet inte om det bara är för ett år eller för alltid gratis.
Redaktionell personal
Bluehost erbjuder alltid gratis SSL. Erbjudandet om gratis domän gäller dock i 1 år.
Admin
Gijo Varghese
Utvecklaren av Flying Pages här. Om du stöter på några problem, låt mig bara veta
Jumedeen khan
Trevlig riktlinje sir men jag har några tvivel,
Jag tror att Nginx LEMP-stacken är den snabbaste serverkonfigurationen för WordPress.
För cache kan du använda opcache, filcache och fastcgi-cache, inget behov av någon cache-plugin, nginx-cache är snabbare än plugin-cache.
För CDN är Stackpath inte bäst för hela världen, det är väldigt långsamt i Indien, din webbplats bild laddades 2-3 sekunder här.
För hosting är Hostgator inte bättre än Google cloud, AWS, Digitalocean etc. molnleverantörer.
Tack
Redaktionell personal
Visst kan du använda NGINX-cache utan något plugin. Vi har den konfigurationen på WPForms och flera av våra andra webbplatser som olika team hanterar.
I slutändan handlar det om din komfortnivå och bekantskap.
Admin
'Den ståndaktige investeraren'
DANG!
Detta är mycket kraftfullt. Din blogg är mer som en Lambo nu.
Grattis sir
Redaktionell personal
Thank you
Admin
Ahmad khan
Jag ser fram emot att tillämpa dessa steg på mitt nyinköpta webbhotell på SiteGround för min blogg Writer Feels där jag skriver dikter.
Redaktionell personal
Ahmad, SiteGround also comes with a built-in caching plugin called SG Super Cache. You should enable that, and it will unlock a lot of optimizations. After that I recommend adding the Sucuri WAF + optimize all your images
Admin
Chip Williamson
Bra inlägg. Jag lyckas alltid lära mig något från WPbeginner-inläggen jag läser! Tack!
Redaktionell personal
Thanks for the kind words Chip
Admin
Luke Cavanagh
Webbplatsens prestanda är WebPageTest ser ganska bra ut, inga maxåldrar eller utgångsdatum inställda på ett antal tillgångar som serveras av CDN. Cloudflare har betydligt fler PoPs än StackPath erbjuder.
Redaktionell personal
Ja, Cloudflare erbjuder många PoPs, men jag har funnit att StackPath har bättre support. Dessutom är StackPath CDN mycket billigare (10 USD per månad för 1 TB bandbredd).
För att få full nytta av Cloudflare måste du ha deras plan för 200 USD per månad (2400 USD per år), medan du kan få Sucuri för 299 USD per år. Vi går lite extra och lägger till det extra CDN-lagret från MaxCDN (StackPath) för ytterligare 10 USD per månad.
Admin
Anne Hennegar
Bra skrivet.
Bara nyfiken på att kombinera JS- och CSS-skript eftersom du använde http/2. Jag trodde att med http/2 skulle man inte kombinera dessa filer.
Redaktionell personal
Ja, med HTTP/2 har du snabbare filöverföring, men att minska antalet förfrågningar är alltid en bästa praxis.
Admin
Patrick
Bra inlägg Syed, mycket grundligt inlägg. Jag känner ärligt talat att statisk WordPress och serverlös WordPress inte är en bra lösning för 90% av WordPress-användarna. Det är ett roligt buzzword just nu, men huvudvärken som är förknippad med det är helt enkelt inte värt det. Oavsett vilket är din infrastruktur och uppmärksamhet på detaljer mycket imponerande.
Jag såg att du nämnde att du använde en databasserver men såg inte vilken databasserver du använder? Vad är dina tankar om att använda Amazon Aurora RDS för WordPress-databasvärd? Eller Google Cloud?
Redaktionell personal
Patrick, vi använder MariaDB på WPBeginner-webbplatsen. Vi valde att hålla det enkelt, och det tjänar våra behov för tillfället.
På OptinMonster använder teamet en mycket mer sofistikerad databasuppsättning eftersom de har miljarder rader att hantera.
Admin
Peter Cruckshank
Jag vill bara säga att Netlify är typ det bästa som hänt webbutveckling om du hostar statiska sidor eller JAM stack-sidor. Och ja, du kan få WP att ha en snabb laddningstid, men titta på ansträngningen det kräver!! Och att kasta pengar på problemet skadar aldrig
Om du delar upp din sida med Gatsby på frontend och WP på backend kan du spara MYCKET pengar på hosting
Men du gör några bra poänger med bildoptimering. Ett enkelt sätt att minska laddningstiden
Redaktionell personal
Jag håller med dig där Peter. Det finns aldrig en enda rätt eller fel lösning. Jag ville bara dela med mig av perspektivet som inte är så populärt nuförtiden eftersom det coola är att prata om JAM stack som de flesta SMB:er inte kan implementera.
But optimizing images, combining plugin requests with WP Rocket, adding Sucuri is easy enough to get progress
Admin
Bimal Raj Paudel
Wow! Vilken fantastisk sak att läsa. Väntade på detta.
Wojciech Marusiak
Tack för artikeln. Jag uppskattar dina resultat och att du delar med dig.
Jag måste dock ge mina två ören. Dina migrationskostnader och argument för vidare webbplats-/kodunderhåll är 100% giltiga.
Men, det du använder som hosting (apache ha cluster, waf) är långt ifrån "normal" wordpress-hosting som 99% av folk använder.
För det andra är jamstack så populärt eftersom du kan hosta din webbplats för en bråkdel av kostnaden för WP-värdskap, vilket ger bättre prestanda "out of the box" och är många gånger billigare.
Skål
Wojciech
Redaktionell personal
Tack för din kommentar Wojciech. Jag håller med om att min företagsinstallation är långt ifrån normal. Men ur mitt perspektiv är det mycket mer uppnåeligt för en småföretagare att lägga till en WAF + optimera bilder + minska HTTP-förfrågningar med WP Rocket än en JAM stack-migrering.
Admin
Mike
Kan du snälla dela hur många unika månatliga besökare den här webbplatsen får?
Redaktionell personal
Our site gets millions of pageviews per month
Admin
Mike
Very cool! I have built custom VPS configurations to handle that and it only required a $10 VPS
I am really curious why such a complicated setup for a super static site that is so cache friendly?
Redaktionell personal
Jag svarade faktiskt på den här frågan i mycket detalj i Facebook-tråden för Advanced WordPress-gruppen – https://www.facebook.com/groups/advancedwp/permalink/2603396369722561/
Tareq Hasan
How much this setup costs for WP Beginner per month? Just asking
Redaktionell personal
Tareq, en liknande installation som denna kommer att kosta tusentals per månad. Allt beror på hur många webbnoder / databasservrar du startar. Hanterade tjänster varierar beroende på vilket företag du väljer. Till exempel hos OptinMonster ligger våra serverkostnader på $XX.XXX / månad.
For WPBeginner site, our hosting is sponsored by HostGator
Admin
Anthony
Intressant artikel och det är absolut möjligt att snabba upp laddningstiderna för WordPress-sidor och göra dem jämförbara med statiska sidor. Med det sagt nämns inga verkliga kostnader här. Att ha en statisk sida med någon som Netlify för en liten sida kommer förmodligen att vara mycket billigare. Osäker på företagsnivå och större webbplatser men skulle gissa att du fortfarande skulle ha det bättre.
Dessutom, medan du visar din skrivbordspoäng i Google Insights, presterar den här sidan sämre på mobilen än Gatsby:s hemsida. Man kan argumentera för att mobilhastighet är viktigare eftersom det är där bandbredden och processhastigheten kommer att vara mest begränsad.
Redaktionell personal
Ja, kostnaderna för en företagsinstallation som denna för en stor mediesajt som vår kommer att ligga på tusentals per månad beroende på dina behov och den leverantör du använder.
För mindre webbplatser kan du absolut använda Netlify, men det är inte lätt för småföretagare.
När det gäller mobil, ja, jag nämnde det i artikeln att vi har utrymme för förbättring på mobilen. En vän till mig delade detta nya plugin från Google som jag kommer att lägga till på webbplatsen vilket kommer att hjälpa till att öka vår mobilpoäng – https://wordpress.org/plugins/native-lazyload/
Admin
David
Påverkar instant.page-pluginet sidhastighetsbetygen hos webbplatser som Google? Det verkar som att det inte skulle göra det eftersom det inte finns någon mänsklig klickning. Så för det ändamålet, är det verkligen en fördel att ha ytterligare ett skript installerat?
Redaktionell personal
Detta påverkar inte Googles betyg men det förbättrar den övergripande användarupplevelsen. Hur mycket jag än älskar Googles ranking, värderar jag vår övergripande användarupplevelse högre.
With that said, if you make your website faster you’ll likely see less abandonment overall
Admin
David
Tack för svaret. Det låter vettigt.
Orelaterat, kan du berätta vad wpbeginner-logotypen ska föreställa? Jag stirrar och allt jag kan se är ett blinkande ansikte som bär en gasmask.
Redaktionell personal
Hej David,
WPBeginner-logotypen var mitt dåliga försök att rita en förenklad tecknad figur som ser ut som en nybörjare. Jag kallar honom Blob.
It was basically 3 round shapes in Photoshop with a rotated Exclamation mark and tilted close parentheses
Cathy
Tack för din artikel. Men seriöst, Hostgator är den sämsta hostingtjänsten!
Redaktionell personal
Jag tror att vi får vara oense.
There are negative reviews of just about every web hosting company in the world. I put HostGator in my top 5 for small business hosting because of their track record and my personal experience
Admin
Arun Siradhana Gurjar
Här är pluginet för detsamma: Google släppte det precis för några minuter sedan.
https://wordpress.org/plugins/native-lazyload/
Redaktionell personal
Thanks for sharing the plugin Arjun. Another friend shared that with me on twitter as well. I have it in my list to try it
Admin
Caleb Weeks
Tack för dessa insikter, Syed, och för att du tog dig tid att dela dem så grundligt! Vem vet om en del av det arbete du har gjort här kan sippra in i hanterad WordPress-hosting för andra i communityn över tid. Tack igen!
Redaktionell personal
Thanks Caleb. I know that some of the optimizations will definitely be trickling down
Admin
Parvez
Konfiguration som kräver tusentals dollar per månad eller mer. Å andra sidan kunde vi uppnå nästan liknande prestanda utan att spräcka budgeten eller till och med med gratis hosting som Netlify.
Grattis till den nya webbplatsen.
Redaktionell personal
För stora innehållssidor kommer du att betala tusentals dollar per månad oavsett. Flera av mina vänner som driver stora bloggar inom sina olika branscher spenderar alla flera tusen per månad.
Om du driver en liten sajt, så visst fungerar Netlify, men du måste verkligen vara en utvecklare för att använda det.
Mitt mål är att dela med mig av att med korrekt cachning + WAF + CDN + DNS-verktyg kan du ha en riktigt snabb webbplats utan att behöva ge upp flexibiliteten hos WordPress.
Admin
Martin Lam
Tja, det är en mycket bra företagsinstallation och en läsvärd sådan, och jag hoppas att den kommer att vara till nytta för mig i framtiden.
Jag har en fråga, eftersom jag är nybörjare och har en enkel installation med WordPress+SiteGround+Genesis Framework och uppenbarligen ett tema från StudioPress.
Min sajt använder redan SG Cache-plugin + Cloudfare CDN, jag ville bara veta mer om Genesis-ramverket när det gäller sajtens hastighet och laddningstid, om det har något med det att göra?
Redaktionell personal
Hej Martin,
We use Genesis on WPBeginner as well, but the framework alone won’t make your website fast. You still have to look at the additional HTTP queries and image sizes. You’re definitely on the right track with the tools you’re using
Admin