Strona główna > Cache, HTML5, Internet Explorer, Visual Studio > HTML5 Application Cache–umieszczamy pliki po stronie przeglądarki internetowej

HTML5 Application Cache–umieszczamy pliki po stronie przeglądarki internetowej

To fakt, strony internetowe ważą dzisiaj nie mało, nie chce wchodzić w dyskusję czy to dobrze czy źle, bo pewnie skończylibyśmy na tym, że “źle, ale to zależy od…”.

Smutek ogarnia człowieka jak sobie myśli, że za każdym wejściem na stronę muszę ściągać dużo danych (i tym samym serwować je użytkownikom).

image

Jest na to jednak rozwiązanie – jeżeli jesteśmy pewni że duża część tego co użytkownik ściąga przechodząc od ekranu do ekranu to te same elementy, możemy poprosić jego przeglądarkę Internetową o to by zachowała u siebie lokalnie część naszej strony, w tym obrazki i skrypty.

HTML5 przychodzi nam z pomocą

HTML5 wprowadza do przeglądarek internetowych obsługę przechowywania pików po stronie klienta do obsługi trybu offline aplikacji, ale też do tego by nie było potrzeby ściągania plików wchodząc na stronę raz następny.

Dotychczas wiele przeglądarek internetowych (w jakiś mniej lub bardziej rozgarnięty sposób) realizowało ten pomysł, ale to co dostajemy teraz w ramach ApplicationCache Interface to mechanizm ustandaryzowany, opisany i miejmy nadzieje zaimplementowany w każdej przeglądarce tak samo.

Po co się interesować tematem?

  • Tryb offline – możemy przechowywać całą stronę po stronie klienta, bez potrzeby posiadania dostępu do Internetu
  • Prędkość – nie musimy wczytywać z Internetu plików, które już raz ściągnęliśmy. Oszczędzamy transfer i przy okazji strony działają szybciej
  • Wydajność – zmniejszamy obciążenie serwera i łącza internetowego przy serwerze

 

Tworzymy plik manifestu

W naszym wypadku plik, zawierający informacje dla przeglądarki internetowej będzie w głównym folderze aplikacji. Tworzymy zwykły plik tekstowy z zawartością mówiącą, które pliki warto pamiętać

CACHE MANIFEST

#v1

http://placechallengestatic.blob.core.windows.net/script/jquery-1.5.1-vsdoc.js
http://placechallengestatic.blob.core.windows.net/script/jquery-1.5.1.js
http://placechallengestatic.blob.core.windows.net/script/jquery-1.5.1.min.js

zapisujemy plik jako appcache.manifest i dodajemy do strony internetowej

image

Wyjaśniamy manifest

Plik manifest składa się z:

  • nagłówka CACHE MANIFEST
  • wersji pliku, to ważne bo dzięki temu będziemy mogli mówić przeglądarkom że coś się zmieniło i ma od nowa pobrać elementy – tu: #v1
  • linki do zasobów

Plik manifest może być bardziej skomplikowany, możemy zrobić coś takiego:

CACHE MANIFEST

#v1

CACHE:
http://placechallengestatic.blob.core.windows.net/script/jquery-1.5.1-vsdoc.js

NETWORK:
http://placechallengestatic.blob.core.windows.net/script/jquery-1.5.1.js

FALLBACK:
http://placechallengestatic.blob.core.windows.net/script/jquery-1.5.1.min.js

w tym:

  • CACHE – jak w pliku manifest nie napiszemy nic (nie damy sekcji) to właśnie standardowo przeglądarka wpisuje wszystkie zasoby do sekcji CACHE. Sekcja oznacza, że elementy będą zachowane na dysku i ładowane z dysku za każdym następnym użyciem
  • NETWORK– to zasoby bezpośrednio wymagające Internetu.
  • FALLBACK– to miejsce gdzie możemy wskazać co ma się załadować w razie braku możliwości załadowania oryginalnego elementu, np: /twarz.jpg /offline.jpg (jak nie da się załadować twarz.jpg załaduje się offline.jpg).

 

Cieszymy się od teraz cache.

  1. Brak komentarzy.
  1. No trackbacks yet.

Skomentuj

Wprowadź swoje dane lub kliknij jedną z tych ikon, aby się zalogować:

Logo WordPress.com

Komentujesz korzystając z konta WordPress.com. Log Out / Zmień )

Zdjęcie z Twittera

Komentujesz korzystając z konta Twitter. Log Out / Zmień )

Facebook photo

Komentujesz korzystając z konta Facebook. Log Out / Zmień )

Google+ photo

Komentujesz korzystając z konta Google+. Log Out / Zmień )

Connecting to %s

%d blogerów lubi to: