gyorsítótár a BBC Performance Booster-ben

Feb 2, 2026
kézikönyv
A cached image of the BBC homepage featuring a selection of news headlines

Tavaly a felhasználói tesztelési munkamenet során a BBC News App számára, az egyik felhasználó megjegyzést tett, ami valóban ragaszkodott velem. Kijelentették: "Szeretem az áramlást". Nem hiszem, hogy jobb összefoglaló van annak, hogy milyen teljesítményt jelent a felhasználók számára. A gyors alkalmazáson vagy weboldalon a felhasználó áramlhat, kölcsönhatásba léphet és részt vesz a tartalommal.

A folyó tapasztalatok jó a helyszíni tulajdonosok számára is. A gyors áramlási tapasztalat segít a felhasználóknak elérni céljaik elérését, és viszont elérjük szervezetünk céljainkat. Az Amazon és mások bizonyították a teljesítmény és a felhasználói tevékenység közötti erős kapcsolatot: Mivel az oldalak várakozása leesik, az idő és a pénz, amit a felhasználó felmegy.

Bővebben: Nordvpn Review

Vágja le a távolságot gyorsítótárral

A gyorsítótárak akkor jönnek létre, amikor kis mennyiségű valamit közelebb állnak ahhoz, ahol szükség van rá, általában az átdolgozás megelőzésére. Például, ha eszembe esik, hajlamos vagyok önteni néhányat a kezembe, majd enni innen. Valójában a kezemben egy gyorsítótárat hozok létre, mivel gyorsabban enni őket, mint a csomagba.

Ugyanez a minta használatos a technológia. Három gyorsítótár van, amit meg kell fontolnunk:

  • Szerver Caches: gyorsítótárazott adatok a kiszolgálón, például az adatbázis-lekérdezések eredményei
  • Hálózati gyorsítótárak: A hálózatba beépített gyorsítótárak, néha a webhely üzemeltetője (néven fordított proxy gyorsítótárként), de gyakrabban az internetszolgáltatók vagy más hálózati szolgáltatók
  • Böngésző gyorsítótár: A böngésző tárolja a felhasználó merevlemezén lévő fájlokat a felhasználó általi újrafelhasználáshoz

A gyorsítótár nagy teljesítményt javíthat; A BBC-nél több mint 20-szor növeltem a gyorsítótárazást a termelési kódban. Ez is előnyös a helyszíni üzemeltetők számára is. A gyorsítótárazással több felhasználó is támogatható ugyanazon hardver. Ez csökkenti a felhasználók számára a hardver költségeit, és ezért csökkenti a webhely működési költségeit.

Tervezze meg a gyorsítótárat

Ahhoz, hogy hatékony legyen, a lehető legnagyobb mértékben szeretnénk gyorsítótárazott adatokat használni. Ahhoz, hogy meghosszabbítsák a skittles analógiát, ha kék skattont akarok, de nincsenek kék szálom a kezemben (más néven cache), vissza kell mennem a csomagba. Ez a "hit arány" néven ismert. Ez egy "találat", amikor az elem a gyorsítótárban van, és egy "Miss", ha nem. Nagy találati sebességet akarunk, így a gyorsítótár a legtöbb terhelést veszi.

Az egyik legegyszerűbb módszer a találat arányának növelése a változás csökkentése. A skittles analógiáját egy kicsit kinyújtja, képzeld el, hogy az összes csípő piros volt. Így a kezem bármilyen nyílása gyorsítótár hit lenne; Soha nem kell visszatérnöm a csomagba. Ennek alkalmazása az internetre, ha ugyanazt az oldalt adhatjuk meg, amennyire csak lehetséges, a gyorsítótár hatékonyabbá válik, mivel több kérés érkezik a gyorsítótárba.

Gyorsítótár HTML rövid ideig

A 30-second cache of the BBC News homepage displaying regularly updated content

A Hírek honlapja 30 másodperces maximális korosztályú gyorsítótárfejet használ, hogy a felhasználók előtt gyorsan tartsa a tartalmat, túl sok terhelés nélkül

Tehát ez az elmélet. Gyakorlatunk. Kezdjük, hogy megnézzük a HTML kérését. Az összes fájltípus gyorsítótárazása HTTP fejlécekkel van vezérelve. A fejlécek metaadatok (adatok az adatokról), amelyeket a kiszolgálóról a böngészőre küldenek, és az összes hálózati hardverhez látható. Ahhoz, hogy elmondja a világnak, engedélye van az oldalak gyorsítótárának és a felhasználók közötti gyorsítótár megosztása, a következő fejlécet állítjuk be: 

Cache-Control: public, max-age=30

Itt is beállíthatunk egy határidőt is: a gyorsítótár maximális mennyisége újrahasznosítani ezt az oldalt másodpercben. Ehhez a példához 30 másodpercig állítottam be.

Az oldal "nyilvánosságra" történő beállításával a felhasználó böngészője (és bármilyen hardver az út mentén) fog tartani egy példányt. Tehát az első oldalterhelés kérést fog tenni, de az összes oldal betöltése után újra felhasználja az eredeti választ, amíg el nem éri a határidőt.

A hálózati hardver hatása az út mentén mély lehet. Számos nagy hálózat (például az internetszolgáltatók) gyorsítótárat oszt meg a felhasználók között. A mobilszolgáltatók ezt a technikát erősen használják - például a cache és a rekonstruktív képek 3G felett. A helyszíni operátorok a szolgáltatási http gyorsítótárat is elhelyezhetik. Ez az, amit a BBC-ben tettünk.

Gyorsítótár statikus eszközök korosztály számára

A longer-term cache of BBC iPlayer displaying content that is updated only periodically

A BBC IPlayer egy évig statikus eszközöket tárol - az URL-hez való átalakítások biztosítják a felhasználók számára az új verziókat haladéktalanul

A technikát használ sok a BBC kezelésére statikus eszközök (például képek, CSS és szkriptek) eltérően, hogyan kezeljük oldalakon. A HTML oldalak gyorsítótárazása Túl hosszú ideig a felhasználóknak hiányoznak a tartalomfrissítések hiányában, de kihasználhatjuk ezt a viselkedést, amikor a statikus eszközökről van szó.

A BBC-nál minden statikus eszközt legfeljebb 31.536 000 másodperces korosztályt küldünk a gyorsítótár fejlécében. Ez biztosítja, hogy az eszközöket 365 napig tárolják. Valójában az eszközöket csak egyszer kérik. Ez jó a teljesítmény, de rossz a rugalmasság, mint az eszköz változásai sokáig fognak eljutni a felhasználóhoz.

Ennek érdekében minden alkalommal, amikor egy oldal új verzióját kiadjuk, megváltoztatjuk az eszközöket, ahol az eszközöket tartják. Ez a trükk azt jelenti, hogy az új változásokat közvetlenül a felhasználók előtt helyezik el, de még mindig ugyanazt a teljesítményt kapjuk.

Végső szavak

A weboldal teljesítményének növelése érdekében a weboldalak számára alacsonyabb működési költségeket fognak végezni, és megőrzi a felhasználók áramlását, ami nagy felhasználói élményhez vezet.

Ezt a cikket eredetileg a nettó 279. számú kiadásában tették közzé, a világ legjobban eladott magazinja webes tervezők és fejlesztők számára. megvesz Kiadás 279 vagy Feliratkozás a netre .

Szeretné megtanulni más módokat, hogy a webhelyek sebességnöveljen?

Jason Lengstorf is giving his workshop Modern Front-End Performance Strategies and Techniques at Generate New York from 25 27 April 2018

Jason Lengstorf adja a műhelye modern front-end teljesítménystratégiákat és technikákat a New York létrehozásában 2018. április 25-től

Jason Lengstorf egy fejlesztő, tervező, szerző és barátságos medve. Fókusza az emberek, csapatok és szoftverek hatékonyságáról és teljesítményéről szól. Az IBM-ben folyamatokat és rendszereket hoz létre, hogy a megfelelő dolog legyen az egyszerű dolog. Mindig máskor új és jobb harapnivalókat keres.

Műhelyében a modern front-end teljesítménystratégiák és technikák 2018. április 25-27-től New Yorkot generál Jason kerül bemutatásra a résztvevők, hogyan lehetne javítani észlelt betöltési idő - meddig érzés tart betölteni egy oldalt -, valamint a tényleges terhelés alkalommal, kizárólag front-end technikák, beleértve:

  • A csontváz betöltése
  • A statikus eszközök jobb berakodása
  • Lusta rakodás
  • Szolgálati munkások
  • Jobb építési folyamatok és így tovább!

New York létrehozása 2018. április 25-27-től történik. Most kapd meg jegyét .

Kapcsolódó cikkek:

  • 4 tipp az oldal teljesítményének javításához
  • 7 Szakértői tippek a webes teljesítményre
  • 3 egyszerű módja annak, hogy felgyorsítsa a webhelyét

kézikönyv - Most Popular Articles

Hogyan animálni a MO.JS könyvtárral

kézikönyv Feb 2, 2026

(Kép hitel: Pexels / Frank Kagumba) A MO.JS egy egyedülálló mozgásgrafika JavaScript könyvtár, amely nemcsak a..

Digitális színek hozzáadása a ceruza rajzokhoz

kézikönyv Feb 2, 2026

A teljes méret megtekintéséhez kattintson a képre Nagy rajongó vagyok a hagyományo..

Mi a terminátor vonal?

kézikönyv Feb 2, 2026

A világítás sok aspektusa van, amelyet meg kell fontolnod a forma közvetítéséhez. Egy nagyon hasznos alapvető a terminát..

Tervezzen egy érzékeny helyet EM-alapú méretezéssel

kézikönyv Feb 2, 2026

Valószínűleg hallottad, hogy a betűmérethez relatív egységeket kell használnia. Ez jó szabály a hozzáférhető webdesign számára; Ha a felhasználó megváltoztatja a böngésző..

Hogyan lehet megkezdeni a TypeScript-ot

kézikönyv Feb 2, 2026

A TypeScript egy olyan nyelvcsoport, amely a JavaScript Futtatási idő Végrehajtási környezet :.Ts fájlok, am..

Hogyan lehet a WordPress webhely többnyelvű

kézikönyv Feb 2, 2026

Az interneten használt 10 nyelven, angolul első rangsor közel 950 millió felhasználó. Ezt követi a kínai k..

Interaktív diagramok létrehozása az ionos 2-ben

kézikönyv Feb 2, 2026

Ha egy kis csapatban dolgozik, akkor nehéz lesz írni és fenntartani az Android, az iOS és a Windows külön kódját. Ez az, ..

Hozzon létre játékkész textúrákat az anyagfestővel

kézikönyv Feb 2, 2026

Ez az elmúlt év egy játékváltó volt a videojáték-iparág számára, és az amerikai művészek elég szerencsések ahhoz,..

Kategóriák