Sådan ordnes et langsomt elementorwebsted: 16 optimering, der hjalp mig med at få 100% PageSpeed-karakterer og øjeblikkelige belastningstider på mit websted

Elementor siger, at de er den hurtigste sidebygger for WordPress.


Så hvad forårsager dit websted med langsom indlæsning?

Der er normalt et par enkle justeringer, der kan forbedre dine belastningstider og GTmetrix-scoringer markant. Elementor siger de mest almindelige årsager til et langsomt WordPress-sted er servere, medier, eksterne scripts (f.eks. Google Fonts), plugins, ingen CDN og brug af en middelmådig cache-plugin. De går imidlertid ikke så detaljeret ind i listen trinvise instruktioner.

Derfor skrev jeg denne tutorial.

Du lærer, hvordan du løser dit langsomme Elementor-sted ved at følge vigtige anbefalinger fra WordPress-optimeringsvejledningen og Elementors anbefalinger. Jeg giver skærmbilleder, detaljerede instruktioner og vil besvare alle kommentarer, hvis du stadig har brug for hjælp. Det lykkedes mig at få 100% GTmetrix-scoringer på min hjemmeside. Selv indlæg med 100+ billeder og 400+ kommentarer (5 MB sidestørrelse og 170 anmodninger) indlæses stadig ca. <2s. Ja, jeg er en WordPress-hastighedsnerd :)

Elementorhastighedsoptimering

1. Opgradering til PHP 7.4

Mange hostingfirmaer har allerede frigivet PHP 7.4.

Opgradering af PHP-versioner er en af ​​de nemmeste måder at fremskynde dit Elementor-websted. Kinsta s PHP-benchmarks viser, hvordan højere PHP-versioner kan køre 2-3x hurtigere. Elementor også anbefaler højere PHP-versioner og for at øge hukommelsesgrænsen til 256 MB (se næste trin).

Kontroller først din aktuelle PHP-version under Elementor > Systeminfo.

Elementor PHP-version

Log derefter på din hosting-konto, find PHP-version manager (eller lignende) og vælg en højere PHP-version. Det er også en god ide at tage en sikkerhedskopi på forhånd. Ellers er det det!

Kinsta PHP 7.4

Vigtig: Sørg for, at dine plugins er kompatible med højere PHP-versioner. Jeg brugte WP Rich Snippets (som ikke vedligeholdes længere), men det var uforeneligt med PHP 7.2+, så jeg slettede plugin og fandt en erstatning. Det er ikke værd at opbevare ikke-vedligeholdte plugins.

2. Forøg hukommelsesgrænsen til 256 MB

Kontroller igen din hukommelsesgrænse under Elementor > Systeminfo.

Både Elementor, WordPress og WooCommerce anbefaler en hukommelsesgrænse på 256 MB.

Elementor hukommelsesbegrænsning

Du kan normalt ændre din hukommelsesgrænse på din hosting-konto:

Hukommelsesbegrænsning

Ellers skal du tilføje denne kode til functions.php.

definere (‘WP_MEMORY_LIMIT’, ‘256M’);

3. Brug selvhostede skrifttyper

Hvis Google-skrifttyper sprænger din GTmetrix-rapport, kan du prøve at hoste skrifttyper lokalt.

Hvis du har Elementor Pro, vil du bruge brugerdefinerede skrifttyper (findes i indstillingerne).

Her er en YouTube-tutorial.

Elementor tilpassede skrifttyper

Har ikke Elementor Pro?

Mange plugins kan hjælpe med at optimere Google-skrifttyper: WP Rocket, Autoptimering, selvhostede Google-skrifttyper, OMGF og Asset Clean Up. hvis du gør ikke ønsker at bruge et plugin, skal du følge disse instruktioner.

Trin 1: Bekræft, at skrifttyper bremser dit Elementor-sted i GTmetrix.

Google-skrifttyper GTmetrix

Trin 2: Download dine skrifttyper direkte fra Google Font-webstedet. Download kun de skrifttyper og fontvægte, du absolut har brug for (flere skrifttyper og vægte kan også betyde flere anmodninger).

Trin 3: Brug et værktøj som Transfonter at konvertere dem til web fontfiler.

Transfonter-Google-Font-konvertering

Trin 4: Upload de nye webfontfiler til WordPress, og tilføj dem til din CSS.

Trin 5: Test skrifttyperne, tilføj en standardfejl, og skriv altid fontbackbacks.

4. Optimer anmodninger fra tredjepart

Ligesom Google-skrifttyper er en anmodning fra tredjepart, så kan AdSense, Analytics, Maps, Tag Manager, indlejrede videoer og endda Gravatars eller plugins for social deling forårsage anmodninger fra tredjepart.

Du skal også optimere disse.

Eksterne scripts

Nogle tredjepartsanmodninger er lette at optimere:

WP Rocket har en fane Tilføjelser, der kan hjælpe vært analytisk lokalt og tilføj browser-cache til Facebook Pixel. WP Rockets Media-indstillinger giver dig mulighed for dovne indlæsning af videoer, mens du erstatter iframe med et eksempelbillede. Hvis du integrerer indlæg fra sociale medier, kan du prøve at tage et skærmbillede og bruge et billede i stedet. Disqus betinget indlæsning, udsættelse af parsing af JavaScript i dine cache-plugin-indstillinger og selektiv deaktivering af scripts / plugins i Asset Clean Up kan hjælpe med at optimere scripts.

WP Rocket Local Analytics

Andre anmodninger fra tredjepart er ikke så nemme at optimere:

Google AdSense kan være en GTmetrix-dræber. Bortset fra at indlæse det asynkront, er der ikke meget, du kan gøre. Jeg har heller ikke fundet nogen løsning på at få Gravatars til at indlæse hurtigere, og jeg har prøvet alle Gravatar cache-plugins (så jeg har dem deaktiverede). Google Tag Manager skal normalt kun bruges til store, ikke-optimerede Elementor-websteder, ellers gør det normalt mere skade end gavn.

5. Undgå høje CPU-plugins

Nogle plugins skal du bare holde dig væk fra.

Høj CPU-plugins, der bremser Elementor-websteder, har normalt at gøre med statistikker, sikkerhedskopieringer, social deling, porteføljer, live chat, kontaktformularer, skyderne, JetPack og ethvert plugin, der konstant er påkrævet for at “arbejde” på din hjemmeside (tænk Broken Link Checks løbende scanninger).

  1. AddThis
  2. AdSense-kliksvigovervågning
  3. Alt-i-én-arrangementskalender
  4. Backup Buddy
  5. Beaver Builder
  6. Bedre WordPress Google XML-sitemaps
  7. Brudt Link-checker (brug Dr. Link Check)
  8. Konstant kontakt til WordPress
  9. Kontaktformular 7
  10. Kontekstrelaterede indlæg
  11. Digi Auto Links
  12. Disqus-kommentarsystem
  13. Divi Builder
  14. Essentielt gitter
  15. Se hele listen over 65 langsomme plugins

Hvis du har et langsomt plugin, kan du enten slette det og finde en erstatning, selektivt deaktivere plugin på bestemte sider (næste trin), eller fortsætte med at bruge det og have et langsomt Elementor-sted.

6. Deaktiver ubrugte plugins selektivt

Asset CleanUp og Perfmatters er gode til selektiv deaktivering af plugins, manuskripter og stilarter.

Det mest almindelige eksempel er kun at indlæse dit kontaktformular-plugin på kontaktsiden og deaktivere det overalt ellers. Men har du tænkt på at deaktivere dit sociale delingsplugin på dine sider (da de fleste kun bruger det på indlæg)? Eller deaktivere din skyderen på sider, der ikke har skyderen? Gennem selektiv deaktivering kan du fremsætte færre HTTP-anmodninger på sider.

Trin 1: Installer Asset CleanUp eller Perfmatters.

Asset CleanUp-plugin

Trin 2: Rediger en side eller et indlæg og rulle ned for at se alt, hvad der indlæses på siden.

Trin 3: Deaktiver (los) plugins, scripts og stilarter, der ikke bruges på siden. Du kan også deaktivere det efter posttype, eller Asset CleanUp Premium (samt Perfmatters) giver dig mulighed for at bruge RegEx.

Rengøring af aktiver Kontroller alle

7. Deaktiver WooCommerce-scripts, stilarter, vognfragmenter

Ligesom du selektivt deaktiverede plugins i det forrige trin, kan du bruge Perfmatters og Asset CleanUp til at gøre det samme med WooCommerce-scripts, stilarter og kurvfragmenter.

Asset CleanUp WooCommerce

Perfmatters lader dig faktisk gøre det med 1-klik:

perfmatters woocommerce optimering

8. Skift Editor Loader-metode i Elementor

Elementor siger:

“Hvis du har hosting- eller serverproblemer ved hjælp af Elementor, har vi inkluderet en simpel switch, der muligvis kan løse dit problem.”

Du kan finde dette under Elementor > Indstillinger > Fremskreden > Editor Loader.

Elementor Switch Editor Loader-metode

9. Ændr størrelse på billeder for at korrigere dimensioner

Når du bruger Elementor, er det vigtigt at skalere (ændre størrelse) på billeder, så de passer til deres rigtige dimensioner.

Server skaleret billeder

Ellers vil du se tjene skalerede billedfejl i GTmetrix. Hvis du ser nogen, skal du gribe de anbefalede dimensioner leveret af GTmetrix og ændre størrelsen på billedet til disse dimensioner og derefter udskifte billedet. Jeg anbefaler, at du opretter et “billeddimension snyderark”, som viser dimensionerne på alle områder på dit websted (skyder, viste billeder, blogbilleder i fuld bredde, logo). På den måde kan du ændre størrelsen på dit billede til de korrekte dimensioner, før du uploader det.

10. Ditch Shared Hosting And Upgrade to Cloud

Har en langsom server responstid?

Kør dit websted gennem Google PageSpeed ​​Insights, og sørg for, at det er det <200 ms, som Google anbefaler. Din server (hosting) er # 1 faktor i WordPress-optimeringsguiden.

Jeg anbefaler normalt SiteGround (delt hosting), hvilket er fint, hvis du har lidt trafik og plugins. Men når du engang går til skyhosting (f.eks. Cloudways DigitalOcean), er forskellen nat og dag. Jeg migrerede fra SiteGround til Cloudways, og min ladetid blev halveret. Selv indlæg med 100+ billeder og 400+ kommentarer (5 MB sidestørrelse, 170 anmodninger) indlæses stadig på under 2s.

Elementor Hosting

SiteGround-vs-Cloudways-Cloud-hosting

GTmetrix-rapport-for-lang-indlæg

Andre menneskers oplevelser med Cloudways:

Cloudways responstid

WP-motor til Cloudways

DigitalOcean Pingdom-rapport

Cloudways server svartid

Forbedring af Cloudways belastningstid

Cloudways vs WP Engine

Untitled

Cloudways Pingdom Load Times

Cloudways Pingdom-rapport

Namecheap til Cloudways Migration

Cloudways WooCommerce Migration

Cloudways AWS Migration

De var også # 1 i mange Facebook-afstemninger og har det godt TrustPilot anmeldelser:

Hostinganbefalinger Facebook

VPS Cloud Hosting WooCommerce Poll

VPS Cloud Hosting Poll

WordPress Hosting-forslag

Cloudways-Facebook-anmeldelse

Cloudways Facebook anmeldelse

Cloudways vs SiteGround

Bundlinie: delt hosting er fint, hvis du ikke kører WooCommcerce, AdSense, plugins med høj CPU eller har anstændig trafik. Men når du først har en af ​​dem, skal du undersøge cloud hosting. Ja, jeg er tilknyttet Cloudways), men der er masser af andre mennesker, der migrerede og offentliggjorde deres resultater. Koden OMM25 giver dig 25% rabat på de første to måneder af hosting hos Cloudways.

11. Ditch Free Cache-plugins og brug WP-raket

Hvorfor er WP Rocket normalt nr. 1 i Facebook-afstemninger?

Fordi det har flere hastighedsfunktioner end de fleste andre cache-plugins (databaseoprydning, lokal analyse, kombination af Google-skrifttyper, doven indlæsning af billeder + videoer, CDN + Cloudflare-integration, hjerteslagskontrol, WebP-cache, forudindtagning, Facebook Pixel-browsercache).

Derfor giver WP Rocket bedre scoringer + belastningstider i GTmetrix og betyder mindre plugins på dit Elementor-site. Det opdateres altid med nye funktioner og vedligeholdes af et pålideligt team.

Så hvis du stadig bruger WP Fastest Cache eller W3 Total Cache, skal du virkelig give den en hvirvel.

Bedste cache-plugin-afstemning i 2016

Måling af cache-plugin i 2019

Swift vs WP Rocket

Undersøgelse af cache-plugin i 2016

Bedste cache-plugins 2018-afstemning

wp raket vs w3 totla cache

Du kan se forskellen:

WP-raket før efter

12. Rengør din database

Planlægger du løbende databaseoprydninger?

Når du fortsætter med at opbygge dit Elementor-sted, akkumulerer du postrevideringer, gamle databasetabeller fra plugins / temaer, du ikke bruger mere, papirkurvede kommentarer og andre uønskede filer.

Du kan bruge plugins som WP Rocket og WP-Optimize til rens din WordPress-database. Bare sørg for at gennemgå alt det, der slettes, og at tage en sikkerhedskopi på forhånd.

WP-optimer ren database

13. Brug Cloudflare’s CDN

Brug af Cloudflare er en no-brainer.

Det er gratis, har over 200 datacentre, og CDN’er er anbefalet af WordPress.

Cloudflare-logo

Nogle værter som SiteGround giver dig mulighed for at aktivere Cloudflare i deres instrumentbræt. Ellers kan du tilmelde dig Cloudflares gratis plan, logge ind på domæneregistratoren og skifte til Cloudflare-navneservere.

I instrumentbrættet er der et par justeringer, du skal overveje:

  • Hastighed: aktiver Brotli og Rocket Loader
  • Skrab skjold: aktiver hotlink-beskyttelse
  • Firewall: blokerer dårlige bots fra Wordfences live trafikrapport
  • Side regler: Cloudflare har masser af side regler for hastighed, sikkerhed, kompatibilitet

14. Brug et letvægtstema

Historie tid.

Jeg brugte et ThemeForest-tema, der blev forladt af udvikleren (en risiko, du tager, når du køber et tema fra en uafhængig udvikler, selvom det har gode anmeldelser). Jeg havde også mareridt, da jeg købte oppustede temaer til klienter, der gjorde deres WordPress-site langsomt.

Jeg mener, at have alt indbygget gør det så meget lettere, ikke desto mindre?

Ingen! Du ønsker at vælge et letvægtstema, der er minimalt og kodet godt, og stole derefter på plugins for kun at tilføje funktioner, du har brug for. Temaoptimering er sværere end at slette et plugin.

De fleste af jer bruger forhåbentlig Astra-, Flatsome- eller StudioPress-temaer, som er de vigtigste temaer, jeg anbefaler.

15. Find flaskehalse i GTmetrix

Bortset fra at måle scoringer + belastningstider, kan du afsløre en hel del ting i GTmetrix. Da hvert Elementor-sted er anderledes, vil du finde nøjagtigt, hvad der bremser dit.

Tid til første byte

Tid til første byte

Uoptimerede billeder

Billedoptimeringer i GTmetrix

Langsom plugins

Langsom WordPress-plugin

16. Afslut de sidste 10% af hastighed med perfmatters

Perfmatters (af Kinsta) tager sig af det, jeg gerne kalder diverse hastighedsoptimeringer:

perfmatters funktioner

Nogle af disse er yderst nyttige; scriptadministratoren, som giver dig mulighed for selektiv at deaktivere plugins / scripts fra visse sider, ændre autosave-intervallet, begrænse revisioner af indlæg, forhåndsforbinde og deaktivere WooCommerce-scripts, stilarter og kurvfragmenter. Når det kommer til disse optimeringer, ved jeg ikke noget plugin, der gør et bedre job end Perfmatters.

Hvad forventer du, det er Kinsta. Selvfølgelig er det et godt plugin.

Ofte stillede spørgsmål

&# X1f680; Hvad er de mest almindelige årsager til et langsomt Elementor-sted?

Ikke at bruge et godt cache-plugin, ikke konfigurere din cache-plugins indstilling optimalt, langsom hosting, uoptimerede billeder, bruge Google-skrifttyper og eksterne scripts, plugins med høj CPU og ikke bruge en CDN er nogle af de mest almindelige årsager til et langsomt Elementor-websted.

&# X1f680; Hvad kan jeg gøre for at fremskynde Elementor?

Brug Elementors brugerdefinerede skrifttyper til at reducere mængden af ​​anmodninger fra Google-skrifttyper eller Font Awesome. Du kan også selektivt deaktivere ubrugte Elementor-funktioner på sider / indlæg ved hjælp af et plugin som Asset CleanUp eller Perfmatters af Kinsta. Resten er generiske hastighedsoptimeringer, der ikke har noget at gøre med Elementor.

&# X1f680; Hvordan bruger du brugerdefinerede skrifttyper for at få dem til at indlæse hurtigere?

Du har brug for en Elementor Pro-konto for at gøre dette. Download dine fontfiler (f.eks. Fra Google-skrifttyper) og upload dem i sektionen med tilpassede skrifttyper i Elementor.

&# X1f680; Er Elementor nedsat mit websted?

Elementor forårsagede ingen fejl i min GTmetrix-rapport og antages at være den hurtigste WordPress-sidebygger. Det bør ikke bremse dit websted meget, hvis overhovedet. Men hvis du tror, ​​at det gør det, skal du tjekke på fanen GTmetrix Vandfald for at se, hvad der virkelig forårsager problemet.

&# X1f680; Hvilken hosting anbefales til Elementor-websteder?

I den populære Elementor Facebook-gruppe er SiteGround og Cloudways normalt de 2 bedste værter, der er taget i Facebook-afstemninger.

Har stadig et langsomt Elementor-sted?

Jeg siger dette: Cloudways og WP Rocket skal løse 80% af dine problemer. Hosting og dit cache-plugin er af de største faktorer i WordPress optimeringsguide. Men hvis dit Elementor-websted stadig er langsomt, så slip mig en kommentar med din GTmetrix-rapport, og jeg er glad for at kigge efter. Vores team tilbyder også WordPress-hastighedstjenester med før + efter GTmetrix-rapporter.

Skål,
Tom

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map