Hogyan lehet felgyorsítani a letöltési oldalon „blog Perfecto web

Gyors betöltés helyén - egy átfogó megközelítés a projekt fejlesztése. Általános szabály, hogy a lehető legmagasabb letöltési sebesség, akkor kezdődik a megfelelő kiszolgáló beállításait. Ebben a cikkben fogjuk néhány hasznos tipp, amelyek mellett időt takaríthat meg ügyfeleink, akik érdeklődnek a terméket, hogy a jövőben pozitív hatással van az értékesítési, illetve azt a képet.







Mintegy 57% -át a lakosság, amely nem azonos a stabilitást és a jó internet, ahogy van, ennek következtében tisztábban lássuk a probléma hosszú letöltési oldalon! Köztudott, hogy egy gyenge Internet főleg akkor a mobilszolgáltató a régióban. Sajnos, a mobil kommunikáció nem mindenhol és nem mindig stabil és nagy sebességű, ami végső soron befolyásolja a terméket. Mentés egy második ügyfelének, vigyázni rá, és ő lesz veletek sokáig.

Jó tudni
Még ha a webhely betöltése csak 1-2 másodperccel hosszabb, akkor elveszíti a potenciális vásárló. Különbség letöltési oldalon az 1 másodperc vagy 3 másodpercig, ez nem matematika 2 másodpercig. Ez valójában egy meglehetősen hosszú ideig, amely nem felel meg az elvárásoknak a látogatók.

1. Állítsa be gyorsítótár a szerver oldalon

Ha van egy szerver nginx, és ha nem egy szakértő ezen a területen, a következő példák a cache beállításait.

Mi fog bevezetni, ha az alapelveket, hanem részletes szerver beállításokat, mint az interneten megtalálható egy csomó cikket beállítani cache-statikus nginx.

2. A böngésző cache

Írja be a következő utasításokat a .htaccess fájlt, miután RewriteEngine On line. Ez a tétel valószínűleg van túl az első. Közel minden meghatározott formában a gyorsítótár időben „való további 7 napig.” ahol megváltoztathatja az időt, hogy bármilyen formátumban. Az alábbi példában az optimális értékeket.

Ha kell egy részletes leírást a használata a böngésző cache, akkor lehet kapni azt a Google

3. Kapcsolja be a tömörítés

Kezdetben meg, milyen rendszer van a webszerveren. Ezután kattintson a linkre információt tömörítés:

Az alábbiakban néhány példát a Google, ami elfogadhatónak tekinthető, és mi nem:

Készítsen egy másolatot az eredeti fájl * .css és * .js a * .min.css * .min.js, amelyben akkor minifitsirovany. Megmentettem egy pár byte, ahol csak lehetséges, végül összeolvadnak egy megtakarítási kilobájt vagy akár megabájtot.

6. Képoptimalizálás

Optimalizálja a képeket az oldalon tömörítésére méretük. A mai napig, van elég gyakori módszer kép tömörítési minőségromlás nélkül. Az eszközök elvégzéséhez további tömörítés JPEG és PNG fájlokat veszteség nélkül és lebomlását. JPEG fájlok, akkor ajánlott használni jpegtran vagy jpegoptim (csak Linuxra, fellép --strip-all opció). Ahhoz, hogy jobban használják PNG vagy OptiPNG PNGOUT.

Vannak is online szolgáltatások, amelyek célja a fentiek alapján a technológia. Példaként lehet használni képtömörítéshez Kraken.io interneten.
Vannak TinyPNG tömöríteni a JPG és PNG formátumban. És van egy plugin az Adobe Photoshop, amely egyszerűsíti a munkát időnként.
Ha ön használ MacOS, vagyis nevű alkalmazás Paparazzi! .
Nem korlátozódik erre a listára. Ön szabadon más megoldást találni, hogy az alkalmazás, ami szintén alapulhat a fent említett technológiákat.

7. Válassza ki a megfelelő képméretet

Minden képformátum tervezett konkrét feladatokat. Egyes helyeken, jobb kihasználása jpg, más PNG és GIF harmadik. Gyakran hasznos lehet használni az SVG formátumban köszönhetően a könnyű súly és skálázható (vektor), de a probléma megközelítése szükséges megértést.

JPG - Csak fotókat
GIF - használt, ahol a kép kicsi, és kevesebb mint 3 szín a palettán. És azt is lehet egyszerű animációk.






SVG - használja a vektoros képek, ikonok és más egyszerű grafikus objektumokat. Ne használja svg komplex illusztrációk
PNG - használja semmilyen más célra

8. A megfelelő méretű képek

Ha egy adott területen, hogy elhelyezte a fényképet 800h600px használja fel. A kivétel lehet a fényképek mérete @ 2x retina kijelzők. De az ilyen fotók kell használni, ha egy ügyfél jött meg a készülék retina kijelző. Erre a célra léteznek a megfelelő Media Query

9. A font ikon

Font ikonok jobban az a tény, hogy az ügyfél letölti a fájlt, és időt takarít meg a szállítási szerver ← → ügyfél. Azt hihetnénk, hogy: Mi a baj a jó öreg sprite? A font ikonok van egy másik plusz. Ez azon a tényen alapul, hogy a vektor ikonok, és függetlenül attól, hogy sűrűsége a képernyőn lesznek sima és tiszta.

10. A CSS3 a maximális

Már régóta telt el az életkor Internet Explorer 6-7, nem teljes mértékben támogatja a CSS árnyékok, színátmenetek és mások. Ma nyugodtan használja CSS3 a legnagyobb. Vigyázni kell, mert a képeket létrehozni árnyékok, színátmenetek és hasonlók. Nyugodtan használja a CSS3, de egyezéstelismerem kompatibilitás stílust, amit úgy tűnik, hogy túl gyanús.

11. Letöltés tartalom alkatrészek

Az első képernyő részének tekintik a tartalom, ami elfér a képernyőn. Továbbá, az első képernyő hagyományosan tartják az első oldalon 640px. Ebben a tekintetben az építkezés során figyelembe kell venni ezt, és a tartalom feltöltésére fokozatosan. Kezdetben le kell töltenie az első képernyőn, amilyen gyorsan csak lehetséges, és függetlenül attól, hogy az azt követő. Ez ad egyfajta leggyorsabb letöltési oldalon. Addig, míg az ügyfél összpontosít az első képernyőn, a szkript lesz körülbelül 2-3 másodpercig, hogy „csendben” letölteni semmit.

Ahhoz, hogy megoldja ezt a problémát, akkor: Az aszinkron betöltését scriptek, kijelző a stílus csak a felelős az első képernyőt alacsonyabb tartalom betöltése után az első képernyőn (ha rendelkezésre áll). Minden mást meg kell adni, hogy a terhelés után teljes rajza az első képernyőn.

12. cache adatbázist lekérdezések

Próbálja tartani a lekérdezések számát az adatbázis minden oldalon. Gyorsítótáraz mindent, ami lehetséges. Cikkek, hírek, blogok - az összes ilyen anyagot biztonságosan gyorsítótár, amíg meg nem változtatja. Ha a projekt nem dinamikus, több (a chat-szobák, játékok, grafika), az lenne az ideális, ha eléri eredmények: 0-1 minden oldalon kérésre. Igen, ez 0!

Dinamikus projektek kezelni a nagy mennyiségű adatok valós idejű, válassza technológiák, mint például a web foglalatok és egyéb szállítmányok, amely állandó kapcsolatot.

13. számának csökkentése böngészőkérelmek

Minél többet csatolt fájlokat is, a több kérelmet küldött a böngésző a szervernek minden. Költött milliszekundum egy fájl, akkor nem játszanak nagy szerepet. De ha ilyen fájlok 40-50, sőt 100, az összeg jelentősen növeli az oldalak betöltési ideje.

14. Optimalizálja kód

Ha ön használ valamilyen tartalomkezelő rendszer, a legvalószínűbb, minden oldalon csatlakozik sok modult, amelyek nem használnak egyáltalán. Ez nagymértékben növeli a feldolgozás a forgatókönyvet, és ennek következtében a kérés, hogy ki a végső oldalak nem vesz kevés idő. Húzza / távolítsa el az összes felesleges, ha minden oldalon a webhelyen fog működni, mint egy intézkedés szükséges. Nem szükséges, hogy csatlakozni több modulok és könyvtárak, abban a reményben, hogy hirtelen valami hasznos.

Ha tervezése a rendszer, akkor a tárgy könnyedén dolgozzanak ki a design a helyén. Mindig próbálja mérni a memóriahasználat és a terhelés a script a szerveren. Végtére is, a kisebb terhelés és a felhasznált erőforrások, annál gyorsabban dolgozzák fel.

15. Válassza ki a helyes és szép tárhely

Ez az elem nem maradhatott el. Mivel a gyakorlat azt mutatja, hogy sok ember választja tárhely 1 rubel, vagy akár ingyenesen, és ennek következtében, hogy megfeleljen a minőségi. Választásával egy tárhely szolgáltató jobb kezelésére nagyobb gonddal. Jó minőségű tényező az intelligens és barátságos technikai támogatást, mivel azok elsősorban az összegyűjtött eloszlás optimalizált idővel, az összeszereléshez. És ők azok, akik felelősek a zavartalan működését a webhelyen.

Ha van egy helyi vállalkozás, meg kell választani a tárhely található a lehető legközelebb geo helyzetben az ügyfelek. Ez jelentősen felgyorsítja a hozzáférést a webhely. Is használhatja a CDN feltölteni a képeket és egyéb nagyméretű fájlokat. CDN automatikusan kiállítja az ügyfél nehéz képeket a szerver található, amely a lehető legközelebb hozzá. Azt is megteheti, úgy Amazon CloudFront

• A kutatások szerint Strangeloop, több mint 57% -a látogatók hagyja a helyén, amely tele van több mint 3 másodpercig
• Ha a hely miatt lassul a nagyszámú grafikonok, mintegy 75% -a vásárlók úgy dönt, hogy visszavonja a verseny helyszínek.
• Becsült letöltési várakozási idő a beteg oldalon a felhasználók 2 másodperc
• 8% -a felhasználók maguk érzik, hogy a gondozási hely között hosszú tartalom letöltését
• Minél nagyobb a terhelés helyén, annál nagyobb a konverzió
• Több mint 85% -a látogatók várják a helyszínen tölteni a mobil eszköz olyan gyorsan mint egy számítógép. Ha nem kapja meg, akkor egyszerűen hagyja a helyén.
bónusz Forrás: gomez.com

Ezen utasítások akkor is csökkentheti a letöltési sebesség. Példaként, az egyik legutóbbi munkája gyorsabbá vált, több mint 300%. honlap 3.47mb tömeg volt, hogy optimalizálja a kép lett, miután 1.27mb. És ez csak az egyik pont a fent. Köszönjük a figyelmet!




Kapcsolódó cikkek