Veebilehe kiiruse optimeerimine: mis päriselt aitab
Kiiruse optimeerimine läheb valesti siis, kui alustatakse peensustest. Enamikul lehtedel annab kolm asja üheksakümmend protsenti kasust ja ülejäänu on tundide kulutamine millisekundite peale.
See juhend annab järjekorra mõju järgi ja ütleb, millal lõpetada.
Mõõda enne, kui parandad#
Ilma mõõtmiseta optimeerimine tähendab tavaliselt vale asja parandamist.
- Käivita test mobiilirežiimis, mitte lauaarvutis.
- Vaata brauseri võrguvahekaarti: mis laeb, kui suur ja kui kaua.
- Tuvasta suurim üksik fail ja aeglaseim päring.
- Kontrolli serveri vastusaega eraldi failide laadimisest.
- Vaata päris kasutajate andmeid, kui neid on.
- Kirjuta algnumbrid üles, et parandust saaks mõõta.
- Paranda üks asi korraga ja mõõda uuesti.
Kolm asja, mis annavad kõige rohkem#
Peaaegu igal aeglasel lehel on probleem ühes või mitmes neist.
| Parandus | Tüüpiline mõju | Töömaht |
|---|---|---|
| Piltide optimeerimine | Väga suur | Väike kuni keskmine |
| Serveri vahemälu | Väga suur | Väike |
| JavaScripti vähendamine | Suur | Keskmine kuni suur |
| Fontide korrastamine | Keskmine | Väike |
| Kolmandate osapoolte audit | Keskmine kuni suur | Väike |
| Sisuvõrk | Keskmine | Väike |
| Koodi peenhäälestus | Väike | Suur |
Viimane rida on koht, kus enamik optimeerimisprojekte aega kaotab. Tee esimesed viis rida ära, enne kui seda üldse kaalud.
Pildid ja meedia#
Peaaegu alati suurim osa lehe kaalust ja lihtsaim koht võita.
- Serveeri õiges suuruses — mitte 3000 pikslit laia pilti 400 piksli laiusesse kohta.
- Kasuta WebP või AVIF formaati koos varuvariandiga.
- Määra laius ja kõrgus, et vältida paigutuse hüppamist.
- Laadi laisalt kõik, mis ei ole esimeses vaates.
- Ära laadi laisalt LCP-pilti — see teeb tulemuse halvemaks.
- Kasuta ikoonide jaoks SVG-d, mitte pildifaile.
- Videod: ära automaatselt mängi ja kaalu eelvaatepilti.
JavaScript, fondid ja kolmandad osapooled#
Kolm allikat, mis kogunevad märkamatult ja mida keegi ei auditeeri.
| Allikas | Tüüpiline probleem | Parandus |
|---|---|---|
| Raamistik | Kaasas rohkem kui vaja | Kaalu, kas seda üldse vajad |
| Pluginad | Iga plugin lisab skripte | Auditeeri ja kustuta kasutamata |
| Analüütika | Mitu jälgimisskripti | Üks lahendus, mitte kolm |
| Vestlusvidin | Suur ja blokeeriv | Laadi hiljem või kliki peale |
| Fondid | Mitu perekonda ja kaalu | Kaks kaalu piisab enamasti |
| Ikoonifont | Suur fail paari ikooni jaoks | SVG asemel |
| Reklaamiskriptid | Aeglus ja paigutuse hüpped | Reserveeri ruum ja laadi hiljem |
Kolmandate osapoolte skriptide audit on kõige alahinnatum kiirustöö. Küsi iga skripti kohta: kes seda kasutab ja mis juhtub, kui see eemaldada?
Korduma kippuvad küsimused
Kui kiire peab leht olema?
Praktiline siht on suurim sisuelement alla 2,5 sekundi mobiilis päris kasutajate andmetes. Sada punkti laboritestis ei ole eesmärk ja selle jälitamine maksab rohkem, kui annab. Kui leht laeb kiiresti vanal telefonil aeglase ühendusega, on tulemus hea, olenemata sellest, mida test näitab.
Kas kiirem majutus lahendab probleemi?
Osaliselt — see parandab serveri vastusaega, mis on tähtis. Kuid kui probleem on kolmes megabaidis piltides ja kahekümnes skriptis, ei aita kiirem server oluliselt. Mõõda esmalt, kus aeg kaob. Vahemälu olemasoleval serveril annab sageli rohkem kui serveri väljavahetamine.
Kas kiiruspluginad aitavad?
Vahemälupluginad aitavad päriselt ja on tavaliselt esimene asi, mida WordPressis teha. Pluginad, mis lubavad kõike automaatselt optimeerida, annavad sageli väiksema kasu kui probleemide allikate parandamine ja võivad lehte lõhkuda. Testi enne ja pärast ning mõõda.
Millal lõpetada optimeerimine?
Kui päris kasutajate andmed on rohelises ja järgmine parandus nõuab päevi töö millisekundite eest. Kiirus on hea, kuni see hakkab konkureerima sisu ja funktsionaalsusega. Sel hetkel on kasulikum kirjutada üks hea leht juurde kui võita veel viiskümmend millisekundit.
veebilehe kiiruskiiruse optimeeriminepiltide optimeeriminevahemälujavascripti vähendaminelehe laadimisaeg
