Pamięć podręczna na booster wydajności BBC

Feb 6, 2026
Jak
A cached image of the BBC homepage featuring a selection of news headlines

W ubiegłym roku podczas sesji testowania użytkownika dla aplikacji BBC News App, jeden z użytkowników złożył komentarz, który naprawdę utknął ze mną. Oni oświadczyli: "Lubię płynąć". Nie sądzę, że istnieje lepsze podsumowanie, jakie osiągi oznacza naszych użytkowników. Na szybkiej aplikacji lub stronie internetowej użytkownik może płynąć, interakcji i angażować się za pomocą treści.

Płynne doświadczenia są dobre dla właścicieli witryn. Szybko-przepływające doświadczenie pomaga użytkownikom osiągnąć swoje cele, a z kolei osiągamy cele naszych organizacji. Amazon i inni wykazali silny związek między wydajnością a działaniem użytkownika: ponieważ oczekiwanie na strony spada, ilość czasu i pieniędzy, które użytkownik spędza w górę.

Czytaj więcej: Recenzja Nordvpn

Wytnij odległość za pomocą pamięci podręcznej

Caches są tworzone, gdy niewielka ilość czegoś jest bliższa, gdzie jest to potrzebne, zwykle zapobieganie przeróbki. Na przykład, jeśli jadę kręgle, mam tendencję do wlewania kilku do ręki, a potem zjeść stamtąd. W efekcie, tworzę pamięć podręczną kręgów w ręku, ponieważ szybciej je jeść w ten sposób niż wracając do pakietu.

Ten sam wzór jest używany w technologii. Istnieją trzy bufory, które musimy rozważyć:

  • Caches serwerów: Wymienione dane na serwerze, takie jak wyniki zapytania bazy danych
  • Sieciowe buforów: buforów wbudowane w sieć, czasami przez operatora witryny (znany jako odwrotna pamięć podręczna proxy), ale częściej przez ISPS lub innych dostawców sieci
  • Pamięć podręczna przeglądarki: przeglądarka przechowuje pliki na dysku twardym użytkownika do ponownego użycia przez użytkownika

Buforowanie może spowodować ogromną poprawę wydajności; W BBC widziałem, że buforowanie zwiększa wydajność ponad 20 razy w kodzie produkcyjnym. Jest również korzystny dla operatorów witryn. Dzięki buforowaniu więcej użytkowników może być obsługiwane przez ten sam sprzęt. Zmniejsza to koszt sprzętu na użytkownika, a zatem zmniejsza koszty operacyjne.

Zaprojektuj z myślą o pamięci podręcznej

Aby było skuteczne, chcemy używać buforowanych danych w jak największym stopniu. Aby rozszerzyć analogię kręgosłupa, jeśli chcę niebieską skłonność, ale nie mam żadnych niebieskich kręgów w mojej ręce (aka moja pamięć podręczna), będę musiał wrócić do pakietu. Jest to znane jako "stawka uderzenia". To "hit", gdy przedmiot jest w pamięci podręcznej, a "tęsknię", kiedy nie. Chcemy wysoką stawkę uderzenia, więc pamięć podręczna przejmuje większość ładunku.

Jedną z najprostszych metod zwiększenia stawki trafienia jest zmniejszenie zmienności. Rozciągając moje kręgle analogii trochę, wyobraź sobie, jeśli wszystkie kręgle były czerwone. W ten sposób, jakaś krążka w mojej ręce byłaby hitem pamięci podręcznej; Nigdy nie musiałbym wrócić do pakietu. Stosując to do sieci, jeśli możemy podać tę samą stronę do jak największej liczby użytkowników, pamięć podręczna staje się bardziej skuteczna, ponieważ więcej żądań trafi do pamięci podręcznej.

Cache HTML na krótki czas

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

News Homepage wykorzystuje 30-sekundowy nagłówek pamięci podręcznej MAX-AGE, aby szybko uzyskać zawartość przed użytkownikami bez zbyt dużego obciążenia

Więc to teoria. Uzyskajmy praktyczne. Zacznijmy od patrzenia na buforowanie prośby o HTML. Budowanie wszystkich typów plików jest sterowany za pomocą nagłówków HTTP. Nagłówki są danymi meta (dane o danych) wysyłane z serwera do przeglądarki i widoczne dla wszystkich sprzętu sieciowego pomiędzy. Aby powiedzieć światowi, że ma pozwolenie na pamięć naszych stron i udostępnianie tej pamięci podręcznej między użytkownikami, ustawiamy następujący nagłówek:

Cache-Control: public, max-age=30

Tutaj ustawia również limit czasu: maksymalny czas pamięci podręcznej należy ponownie wykorzystać tę stronę w ciągu kilku sekund. W tym przykładzie ustawiłem go do 30 sekund.

Ustawiając stronę do "public", przeglądarka użytkownika (i wszelkie sprzęt po drodze) utrzyma kopię. Więc pierwsza obciążenie strony spowoduje złożenie wniosku, ale wszystkie obciążenia strony po tym, co będzie ponownie wykorzystać oryginalną odpowiedź, aż do osiągnięcia limitu czasu.

Wpływ sprzętu sieciowego po drodze może być głębokie. Wiele dużych sieci (takich jak ISP) będzie miała pamięć podręczną między użytkownikami. Operatorzy telefonii komórkowej wykorzystują również tę technikę mocno - na przykład, do pamięci podręcznej i rekompresują obrazy serwowane powyżej 3g. Operatorzy witryny mogą również umieścić pamięć podręczną HTTP przed ich usługą. To właśnie zrobiliśmy w BBC.

Aktywa statyczne w pamięci podręcznej od wieków

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

BBC IPlayer przechowuje aktywa statyczne na rok - zmiany adresu URL zapewnia niezwłocznie natychmiastowe wyszukiwanie nowych wersji

Technika, którego dużo używamy w BBC, jest traktowanie aktywa statyczne (jak obrazy, CSS i skrypty) inaczej do sposobu, w jaki traktujemy strony. Caching Strony HTML na zbyt długie mogą spowodować brakujące aktualizacje treści, ale możemy skorzystać z tego zachowania, jeśli chodzi o aktywa statyczne.

W BBC wysyłamy wszystkie aktywa statyczne o maksymalnym wieku 31.536 000 sekund ustawionych w nagłówku pamięci podręcznej. Zapewnia to, że aktywa są buforowane przez 365 dni. W efekcie aktywa są wymagane tylko raz. Jest to dobre dla wydajności, ale złe dla elastyczności, ponieważ zmiany w tym aktywach zajmie dużo czasu, aby dostać się do użytkownika.

Aby obejść to, za każdym razem, gdy wydamy nową wersję strony, zmieniamy adres URL, w którym przechowywane są aktywa. Ta sztuczka oznacza, że ​​nowe zmiany są natychmiast umieszczane przed użytkownikami, ale nadal otrzymujemy te same korzyści.

Ostatnie słowa

Buforowanie w celu zwiększenia wydajności witryny będzie z kolei niższe koszty operacyjne dla naszych stron internetowych i zachowanie przepływu naszych użytkowników, prowadząc do doskonałego doświadczenia użytkownika.

Ten artykuł został pierwotnie opublikowany w wydaniu 279 netto, najlepiej sprzedający się na świecie magazyn dla projektantów stron internetowych i programistów. Kup wydać 279. lub Subskrybuj netto. .

Chcesz nauczyć się innych sposobów, aby podać swoje witryny zwiększyć prędkość?

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

Jason Lengstorf daje swoim warsztaciemu nowoczesne strategie i techniki wydajności w przednim końcowym wygenerowaniu w Nowym Jorku z 25 27 kwietnia 2018

Jason Lengstorf jest deweloperem, projektantem, autorem i przyjaznym niedźwiedziem. Jego koncentruje się na wydajność i wydajność ludzi, zespołów i oprogramowania. W IBM tworzy procesy i systemy, aby uzyskać właściwą rzecz Łatwa rzecz ™. W każdym razie wędruje Ziemię w poszukiwaniu nowych i lepszych przekąsek.

W jego warsztacie nowoczesne strategie i techniki wydajności w przód Wygeneruj nowy Jork od 25-27 kwietnia 2018 r , Jason pokazuje uczestnikom, jak poprawić postrzegane czasy obciążenia - jak długo czuje się jak do załadowania strony - jak również rzeczywiste czasy obciążenia, przy użyciu tylko technik front-end, w tym:

  • Wzór ładowania szkieletu
  • Lepsze załadunek do aktywach statycznych
  • Powolne ładowanie
  • Pracownicy służby.
  • Lepiej zbuduj procesy i więcej!

Generuj Nowy Jork odbywa się z dnia 25-27 kwietnia 2018 r. Uzyskaj teraz swój bilet .

Powiązane artykuły:

  • 4 wskazówki, aby poprawić wydajność Twojej strony
  • 7 Porady ekspertów do przybijania wydajności sieci
  • 3 proste sposoby przyspieszenia witryny

Jak - Najpopularniejsze artykuły

Jak malować zamek ze SketchUp

Jak Feb 6, 2026

Istnieje szereg techniki sztuki. To może pomóc w twoim cyfrowym obrazie, ale nie ma zaprzeczenia 3d art...


Jak zilustrować oczy zwierzęcych

Jak Feb 6, 2026

(Kredyt obrazu: Jill Tisbury) Kiedy uczą się Jak rysować zwierzęta , Jednym trudnym aspektem do za..


Jak prototypować aplikację mobilną z Adobe XD

Jak Feb 6, 2026

Ten samouczek pokazujący, jak wykonać prototyp aplikacji mobilnych w Adobe XD, został użyty Adobe XD C..


Jak rzeźbić 3d-drukowane goblin

Jak Feb 6, 2026

Koncepcja tego projektu, Grzyb Goblin, pochodzi z rysunku przez mojego przyjaciela Adriana Smitha. Pracowałem nad tworzeniem tej..


Jak malować przekonujące odbicia

Jak Feb 6, 2026

Cyfrowe techniki malowania umożliwiają przedstawienie odbicia w szkle w stosunkowo prosty sposób. Z pewnością jest znacznie ..


Utwórz niestandardowe szczotki w Clip Studio Paint

Jak Feb 6, 2026

Każda pierwsza instalacja farby Studio Farba jest podekscytowana eksploracja subtool dekoracji. Jest to prawdziwy Smorgasbord naturalnych, nienaturalnych i wręczalnych szczotek głupkowatyc..


Jak zacząć od obrazu olejnego

Jak Feb 6, 2026

Malowanie olejem jest ekscytującym sposobem na tworzenie sztuki. Jednakże wiele osób może być zastraszony przez medium farb olejnych, gdy w rzeczywistości zapewnia idealny sposób na na..


Sekret malowania jak monet

Jak Feb 6, 2026

Dzięki tej MasterClass spróbujemy wsiąść do głowy Monet trochę, więc możemy myśleć i malować w swoim stylu. Ale nie m..


Kategorie