Biedny człowiek jest buforowanie w JavaScript

[TL;DR wersja: używa plików cookie do przechowywania wyników wywołania asynchroniczne; natychmiast uczynić wyniki ostatnich wywołania asynchroniczne i następnie potwierdzić je po ładowania strony.]

Pracuję w witrynie intranetowej SharePoint dla klienta, że funkcje, między innymi, stylizowane drugorzędowej nawigacji którego opcje menu są zarządzane przez regularne stary listy niestandardowe.  Chodzi o to, że klient dojdzie do sterowania menu "swojej" stronie bez wpływu lub są dotknięte nawigacji globalnej wprowadzone przez to.

(jest coś niezwykle wywrotowych o dodanie CEWP, który wskazuje plik HTML, który ładuje niektóre CSS i JS do fundamentalnie zmienić prawie wszystko o zachowanie strony... ale to na inny post)

Kod ten bardzo prosty:

  • Poczekaj na zakończenie załadunku i zrobić Asynchroniczne wywołanie załadować menu pozycja z listy za pomocą odpoczynku lub lists.asmx lub cokolwiek strony
  • Przy użyciu jQuery, dynamicznie wypełnić kilka, jeśli <Li>jest wewnątrz rodzica <UL> (Zobacz artykuł Christian Pinder tutaj proste wyjaśnienie tego tecnnique)
  • Czy wszystkie formatowania za pomocą CSS
  • Zysk!

Ból miejscu tutaj jest to, że za każdym razem ktoś uderza jednej ze stron witryny, przeglądarki sieci web użytkownika jest dotarcie do uzyskania pozycji z listy.  Po zakończeniu dev i badania okazał się rzeczy, aby być stabilne i kompletny, to wywołanie jest niepotrzebne więcej niż 99% czas od menu zmienia się rzadko.  Ono także ma fatalny wpływ UI, które jest powszechne w tym brave new world hiper ajaxy witryny sieci web-renderuje strony i dopiero wtedy czyni menu.  To jest roztrzęsiony i rozpraszać moim zdaniem.  I zdenerwowanie. Tak, buforowanie. 

I zmodyfikowano logikę wygląda następująco:

  • Poszukaj pliku cookie w przeglądarce, która zawiera menu, jak ostatnio ją przeczytać
    • Jeśli Znalezione, uczynić go natychmiast.  Nie czekaj na zakończenie ładowania strony.  (Musisz upewnić się, że twój HTML jest strategicznie umieszczone tutaj, ale to nie jest trudne do zrobienia).
  • Poczekaj na zakończenie załadunku i zrobić Asynchroniczne wywołanie załadować menu pozycja z listy za pomocą odpoczynku lub lists.asmx lub cokolwiek strony
  • Porównaj, co mam przeciwko cookie
    • Jeśli pasuje, PRZYSTANEK
    • W przeciwnym razie, przy użyciu jQuery, dynamicznie wypełnić kilka, jeśli <Li>jest w <UL>
  • Czy wszystkie formatowania za pomocą CSS
  • Zysk!

Niektórzy z was są gonna powiedzieć, "Hej! tu jest nie prawdziwy buforowania będzie tutaj skoro czytasz menu tak za każdym razem.”  I masz rację-nie jestem dając serwer wszelkiego rodzaju przerwy.  Ale ponieważ połączenie jest asynchroniczne i zdarza się po stronie początkowej ładunku HTML renderuje pełni, to "czuje się" bardziej dostosowane do użytkownika.  Menu renderuje dość podobnie jak strony rysuje.  Jeśli zmiana menu, użytkownik jest poddawane zdenerwowanie narysowany menu, ale tylko ten jeden raz.

Istnieje kilka sposobów, aby zrobić to buforowanie bardziej skuteczne i pomóc serwera w tym samym czasie:

  • Umieścić w regule, że buforze"cookie" jest ważny przez co najmniej 24 godzin lub jakieś inne ramy czasowe. Tak długo, jak jest nie skończony ciasteczka, Użyj pliku cookie menu migawka i nigdy nie uderzył serwer.

... Dobrze, że wszystkich, którzy przychodzą do głowy teraz :). 

Jeśli ktoś ma jakieś mądre pomysły tutaj chciałbym je poznać.

I wreszcie – Technika ta może być używany do innych rzeczy.  Strona to klient ma wiele rzeczy, opartych na danych na różnych stronach, wielu z nich zmienia stosunkowo rzadko (jak raz w tygodniu lub raz w miesiącu).  Jeśli cel określonych obszarów funkcjonalności, może dać bardziej elastyczne UI ciągnąc zawartość z magazynu lokalnego pliku cookie i renderowania natychmiast.  Czuje szybciej do użytkownika, nawet jeśli nie zapisujesz serwer żadnych cykli.  Możesz może Decydując się na pewne warunki i wyzwalaczy unieważnić ten cookie lokalnej pamięci podręcznej, należy zapisać cykli serwera.  To wszystko sytuacyjne i pretensjonalnymi rzeczy i naprawdę najbardziej zabawne :). 

</koniec>

undefinedSubskrybowanie mój blog.

Follow me on Twitter wiek na http://www.twitter.com/pagalvin

Jedna myśl na "Biedny człowiek jest buforowanie w JavaScript

  1. Jonathan Roussel

    Hi Paul,

    Ładne wykonanie, to jest coś, co możemy użyć, ale kiedyś API przechowywania lokalnych HTML5 zamiast ciasteczek. Pierwszy dysk był, że potrzebujemy więcej niż cookie umożliwiają przechowywanie. Ale dodatkową korzyścią jest to, że nie zwiększyć ładunki, zważywszy, że pliki cookie będą wysyłane i z powrotem. Z punktu widzenia dev jest bardzo łatwy w obsłudze.
    Obsługa przeglądarki nie jest doskonały, ale szczerze mówiąc dość dobre, http://caniuse.com/namevalue-storage .

    Jonathan

Odpowiedz

Twoj adres e-mail nie bedzie opublikowany. wymagane pola są zaznaczone *