2011-11-10 19 views
7

Mam do czynienia z naprawdę dużym problemem (przynajmniej dla mnie). Dam ci trochę tła.LocalStorage, kilka żądań Ajax lub ogromne żądanie Ajax?

Zajmuję się tworzeniem mobilnej aplikacji internetowej, która będzie wyświetlać informacje o stacjach autobusowych i stacjach rowerowych w moim mieście. Pokaże znaczniki GMap dla przystanków autobusowych i rowerowych, a po kliknięciu otrzymasz informacje o czasie przyjazdu autobusu lub liczbie dostępnych rowerów. Mam to dość ładnie.

Problematyczne jest ładowanie stacji.

Moim pierwszym podejściem było załadowanie całej ilości stacji przy ładowaniu strony. Jest to około 200 Kb JSON plus czas, w jaki robi się iterację w tablicy i umieszczenie jej na mapie. Są one ukryte, więc kiedy użytkownicy klikają nazwę linii, pojawiają się przy użyciu funkcji "findMarker". Jeśli na mapie znajdują się inne stacje, zostaną one ukryte, aby uniknąć zbyt wielu znaczników na mapie.

To działało dobrze z nowymi telefonami komórkowymi, takimi jak iPhone 4 lub nowy HTC, ale nie działa dobrze z 2-letnimi telefonami komórkowymi.

Drugie podejście myślałem, było załadować je życzenie, więc kliknij na stacji, są one ładowane do mapy, a następnie pokazano, ale to prowadzi do dwóch problemów:

  • The po pierwsze, możesz być (lub może nie być) wykonywać kilka żądań , które mogą kończyć się tym samym (?)
  • Po drugie, aby uniknąć tak wielu znaczników, powinny one być ukryte lub usunięte, abyś mógł być usuwanie informacji, które powinny być potrzebne od jakiegoś czasu, np. stacje rowerowe, które są ładowane jako grupa, a nie po linii.

Wreszcie, myślałem o użyciu localStorage je przechowywać, ponieważ nie będzie to wiele zmieni, ale będzie ogromna ilość danych, a następnie ból w dupę, aby odzyskać je, ponieważ są one kluczem -wartości, a także (i nie jestem do końca pewny) Mogłem znaleźć urządzenia bez wsparcia tej funkcji, które musiałyby zastąpić jedną z pozostałych opcji.

Powiedziałem, że to może być ktoś, kto ma podobny problem i rozwiązał go w jakiś sposób lub ma dla mnie kilka wskazówek :).

Każda pomoc będzie naprawdę doceniana.

+0

myślę o webapp to wszystko o szybkości i wydajności, więc buforowanie żadnych danych statycznych przed strony (podczas ekranu ładowania powitalny lub coś) IMHO jest droga iść. Byłoby to również opty- malne do użytku w trybie offline lub gdy połączenie jest złe. Początkowe obciążenie może potrwać nieco dłużej, ale myślę, że aplikacja internetowa będzie bardziej wygodna. –

+0

Dzięki za komentarz Phill. Ta myśl prowadzi do większej konfuzji. Czy nie będzie więcej procesora zajmującego się wyszukiwaniem i dodawaniem z lokalnego magazynu niż pobieranie i dodawanie z serwera? –

+0

Czytanie z pamięci lokalnej prawie na pewno będzie szybsze niż wykonanie żądania HTTP, odczytanie odpowiedzi i przeanalizowanie danych JSON. Jednak myślę, że za pomocą buforowania przeglądarki można uniknąć korzystania z pamięci lokalnej, zobacz moją odpowiedź poniżej. – StefanOS

Odpowiedz

5

Najlepsze podejście zależy od zachowania użytkowników. Czy zazwyczaj klikają wiele stacji lub tylko kilka? Czy wolą szybszy rozruch (ładowanie na żądanie) lub bardziej elastyczny wyświetlacz szczegółów stacji (dane wstępnego ładowania)?

Podejście godna byłoby załadować dane życzenie ale zatrudniają buforowanie przeglądarki (ETag i wygasa nagłówki), aby uniknąć pobierania tych samych informacji w kółko. Rozwiązałoby to twoje obawy bez zajmowania się LocalStorage.

Zobacz to ta kwestia dla różnych podejść do buforowania przeglądarki ETag vs Header Expires

+0

Naprawdę dzięki za odpowiedź StefanO. Twój punkt wydaje się być naprawdę dobrym punktem wyjścia. Chociaż odkryłem, że jQuery ma właściwość ifModified w wywołaniach Ajax do sprawdzania nagłówków ETag i Expires, nie mogę znaleźć żadnego wiarygodnego źródła do wdrożenia ich w odpowiedzi json przez PHP. Czy masz jakieś informacje na temat thas? –

+0

Nie jestem ekspertem od PHP, więc nie znam żadnych funkcji ramowych, które pomogłyby to zautomatyzować. Ale są to standardowe nagłówki HTTP, więc możesz ustawić je tak: nagłówek ("Wygasa: piątek, 11 listopada 2011 15:00:00 GMT"); nagłówek ('ETag: "686897696a7c876b7e"'); – StefanOS

+0

Ponadto, serwery sieciowe takie jak Apache i nginx mogą być skonfigurowane tak, aby automatycznie ustawiać nagłówki buforowania (np. Buforować wszystkie strony przez 24 godziny). Trzeba tylko zająć się tym kodem, jeśli potrzebna jest większa kontrola nad pamięcią podręczną. – StefanOS