Artiklid

Saidi laadimiskiirus. 4 peamist tegurit.

Sildid: SEO

Saidi laadimiskiirus. Kuidas suurendada allalaadimise kiirust? Peamised probleemid.

Soovitatav saidi laadimise kiirus Google - 2 sekundit. (ja nüüd vaadake oma kiirust)

(Kuidas kontrollida veebisaidi laadimiskiirust?Lihtsaim ja kiireim viis on avada arendaja tööriistad CTRL+SHIFT+IJärgmisena valige vahekaart "Võrk", seejärel värskendage lehte, allalaadimiskiiruse nägemiseks peate lehte värskendama, Värskenda ilma vahemäluta: peate vajutama klahvikombinatsiooni CTRL + F5 / CTRL + R. Ja allpool on allalaadimiskiirus.)

Kontrollige saidi laadimiskiirust
kasutades Google'i teenust: PageSpeed ​​​​Insights

(infograafik võetud seoprofyst ©2014)

Peamised punktid, mis kõige rohkem mõjutavad:

  1. Vahemälu
  2. css (stiilid)
  3. JS (skriptid)
  4. Pildid (nende kaal, suurus - jah, täpselt HxW suurus, metaandmed - jah, selline asi on olemas, see on nende teave, näiteks: kuupäev, pealkiri, teema jne)

Et mitte maalida palju tarbetut infot väikeste hetkede kohta, mis eriti ei mõjuta või on tühise mõjuga, siis ma neist ei kirjuta.

#1 SULARAHA

vahemällu salvestamine (võivahemälu) on puhver (koht), kuhu salvestatakse kõik andmed. Meie puhul on need pildid, kood, stiilid ja palju muud.

Lihtsaim mida saate ise teha, on lubage hostimisel vahemälu.
(Kui teil on Ukraine.com.ua hostimine, peate minema jaotisse "saidi seaded" -> "põhisätted" ja seal on üksus "Vahemälu" ja seal valite vajaliku aja, mille jooksul teie sait töötab puhverdatud. Mina soovitan määrata selle 2 nädala peale – selle vahemällu salvestamise perioodiga lisab Google'i lehe kiiruse ülevaade palju punkte.)

muid htaccessi, brauseri siltidega jms seotud meetodeid leiab internetist päris mitme artikli kohta ja ma ei näe mõtet üle värvida. Vahemällu salvestamise tüüpide kohta saate lugeda Habré artiklist.

#2 CSS (stiilid)

CSS – (Cascading Style Sheets – kaskaadlaadilehed).
Mida saab stiilidega teha?
Noh Esiteks pigista neid.
Teiseks vähendada failide arvu, s.t. ühendage nii palju kui võimalik, et vähendada serverisse tehtavate kõnede arvu.
Kolmandaksmanustada peamised stiilid, mis mõjutavad esimese ekraani nähtava osa kuvamist, otse kausta ja ülejäänud jätke faili.

Jätan ka paar kasulikku linki:

  • css-i tihendusteenused
  • kuidas css-faile tihendada

#3 JS (skriptid)

Siin on meil ka mitu võimalust skriptide optimeerimiseks.

  1. Lükka skripti laadimine edasi. Pühkige see nii madalale kui võimalik, asetage taha või isegi madalamale mõnikord aitab, mõnikord pole see valik. Aga punkt number 2 tuleb appi.
  2. ASYNC - asünkroonne skripti laadimine. Seda tehakse parameetri "async" abil

    Lisateavet asünkroonimise kohta leiate siit.
    Natuke rohkem infot JS-i ja selle mõju kohta.

  3. Väike punkt.
    JS-i saab ka tihendada. Ühendage ka 1 faili.

# 4 pildid

Alati saab teha kolme asja: vaadata tuld, vaadata vett ja optimeerida pilte.

Teema on üsna ulatuslik, seega püüan teile anda ainult olulist teavet.

Optimeerige kaalu.

Kuidas? Programmi või teenuse kaudu.

  • Programm piltidega massitööks Kiire kivipiltsellega saad
    Piltide hulgisuuruse muutmine. Kuidas ja mida seal juba guugeldada pole raske.
    Laadige alla Faststone'i pilt.
  • Teenus piltide suuruse vähendamiseks - Panda. Või õigemini TinyPNG & TinyJPG.
    ONLINE'i peamine eelis. Lihtsalt laadige failid üles ja hankige tagasi tihendatud versioon – kvaliteet ei kannata üldse (see on Magic).
    Lingid: tinypng.com & tinyjpg.com

Optimeeri suurus.

Suurust, nagu ma eespool kirjutasin, saab programmi abil muuta kiire kivipilt.
Suurus on kõrgus x kaal (kõrgus laiuse järgi).

Näide:

Suuruspikslidfaili suurus
100x10010 00039 KB
200x20040 000156 KB
300 x 30090 000351 KB
500x500250 000977 KB
800x800640 0002500 KB

(Kui soovite selle kohta rohkem teada saada, võite lugeda Google'i abi sellel teemal. ARTIKKEL Google'ist, kuid hoiatan, et see on mingil määral nohik)

Näiteks on meil 2 pilti:
1) Kaal 100 kb, suurus 500x500
2) Kaal 100kb, suurus 2500x2500
Tundub, et mis vahet sellel on, need kaaluvad sama, seega peaks nende laadimine olema sama keeruline või lihtne, aga seda polnud, kui google lehe kiiruse järgi kontrollida, vannub ikka suurema eraldusvõimega pilt.

Kokkuvõtteid tehes: Suurus loeb. Kaal ka. (ülejäänu pole nii oluline, aga mõne asjatundja argumendi järgi avaldab ka mõju, nüüd räägin pildi metaandmetest)

Ma ei kirjutanud metaandmetest tegelikult midagi, noh, siia pole midagi kirjutada ...
Lihtsalt tühjendage kõigi piltide metaandmed, legendi järgi saate suurust 2 korda vähendada. Sain hiljuti teada (faili suuruse mõju kohta arvasin, et see on üsna ebaoluline).

Lühidalt väljalaskest:

  • levinumad veebisaidi laadimisprobleemid
  • võimalusi nende lahendamiseks
  • millele peate tähelepanu pöörama, et kõik oleks korras

Läheme video juurde:

P.S.
Kui teil on küsimusi või millegagi ei nõustu, kirjutage sellest kommentaarides.