Zalety i wady tworzenia jednostronicowej aplikacji internetowej [zamknięte]

52

Zbliżam się do końca fazy prototypowania / weryfikacji koncepcji projektu pobocznego, nad którym pracuję, i próbuję podjąć decyzję w sprawie niektórych decyzji projektowych na większą skalę. Aplikacja to system zarządzania projektami, który jest bardziej dostosowany do zwinnego procesu rozwoju. Jedną z decyzji, które muszę podjąć, jest to, czy zdecydować się na tradycyjną aplikację wielostronicową, czy jednostronicową.

Obecnie mój prototyp to tradycyjna konfiguracja wielostronicowa, ale szukałem backbone.js, aby oczyścić i zastosować pewną strukturę do mojego kodu JavaScript (jQuery). Wygląda na to, że chociaż backbone.js może być używany w aplikacjach wielostronicowych, bardziej świeci w aplikacjach jednostronicowych. Próbuję wymyślić listę zalet i wad korzystania z podejścia do projektowania aplikacji na jednej stronie. Do tej pory mam:

Zalety

  • Wszystkie dane muszą być dostępne za pośrednictwem interfejsu API - jest to duża zaleta dla mojego przypadku użycia, ponieważ i tak chcę mieć interfejs API dla mojej aplikacji. Obecnie około 60–70% moich połączeń w celu pobrania / aktualizacji danych odbywa się za pośrednictwem interfejsu API REST. Wykonanie aplikacji jednostronicowej pozwoli mi lepiej przetestować interfejs API REST, ponieważ sama aplikacja będzie go używać. Oznacza to również, że wraz z rozwojem aplikacji sam interfejs API będzie się rozwijał, ponieważ właśnie z tego korzysta aplikacja; nie ma potrzeby utrzymywania interfejsu API jako dodatku do aplikacji.

  • Bardziej responsywna aplikacja - ponieważ wszystkie dane ładowane po stronie początkowej są ograniczone do minimum i przesyłane w kompaktowym formacie (takim jak JSON), żądania danych powinny zasadniczo być szybsze, a serwer wykona nieco mniej przetwarzania.

Niedogodności

  • Powielanie kodu - na przykład kod modelu. Będę musiał stworzyć modele zarówno po stronie serwera (w tym przypadku PHP), jak i po stronie klienta w JavaScript.
  • Logika biznesowa w Javascripcie - nie mogę podać żadnych konkretnych przykładów, dlaczego byłoby to złe, ale po prostu nie wydaje mi się, że logika biznesowa w JavaScript jest dostępna dla każdego.
  • Wycieki pamięci JavaScript - ponieważ strona nigdy się nie ładuje ponownie, mogą wystąpić wycieki pamięci JavaScript, a ja nawet nie wiedziałbym, gdzie zacząć je debugować.

Są też inne rzeczy, które są rodzajem mieczy obosiecznych. Na przykład w przypadku aplikacji jednostronicowych dane przetwarzane dla każdego żądania mogą być znacznie mniejsze, ponieważ aplikacja będzie żądać minimalnej ilości danych potrzebnych do konkretnego żądania, ale oznacza to również, że może być znacznie mniej serwer. Nie jestem pewien, czy to dobrze, czy źle.

Jakie są zalety i wady jednostronicowych aplikacji internetowych, o których powinienem pamiętać, decydując, w którą stronę powinienem pójść w ramach mojego projektu?

ryanzec
źródło
Basecamp , nowa wersja basecamphq robi całkiem niezłą robotę z konfiguracją IMO na jednej stronie.
Hakan Deryal
Wycieki pamięci można znaleźć w inspektorze stosów
Joeri Sebrechts
obowiązkowe xkcd.com/1309
Pieter B

Odpowiedzi:

17

Największą wadą jest to, że klient musi mieć włączoną obsługę JavaScript i mieć wystarczającą moc, aby móc go uruchomić. Trudniej jest również zaspokoić obawy związane z dostępnością lub cokolwiek innego, co opiera się na analizowaniu statycznego HTML (chociaż znajomość twojego API może być lepsza niż skrobanie HTML). Wreszcie łatwiej jest mieć znaczne wycieki pamięci.

Jeśli chodzi o powielanie kodu lub logikę biznesową na kliencie - nie jestem pewien, ile z tego trzeba zrobić. Jeśli modelem na kliencie jest View-Model (model, który pasuje do świata tak, jak widzi to interfejs użytkownika, a nie model biznesowy), wówczas logika pasująca do modelu ViewModel aż do modelu biznesowego może znajdować się na kliencie, serwer lub trochę z obu. Zależy to od tego, jak się czujesz, gdy interfejs API zawiera fasadę specyficzną dla klienta, a nie kiedy klient zamienia dane wejściowe interfejsu użytkownika na wywołania interfejsu API.

Możesz także zajrzeć na knockout.js. Nie mogę powiedzieć, czy to jest lepsze niż kręgosłup, ale może lepiej pasować do twojego projektu.

psr
źródło
Tak, myślę, że większość duplikacji kodu będzie miała sprawdzanie poprawności danych, co jest w porządku. Nie mam nic przeciwko włączeniu javascript, ponieważ nie jestem zainteresowany dostępnością tego projektu (np. Czytnika ekranu i innych elementów). Jeśli chodzi o problem z wyciekiem pamięci javascript, który był moim problemem, z linkiem podanym w komentarzach do mojego pytania, to naprawdę neguje to (Chrome jest i tak moją podstawową przeglądarką programistyczną).
ryanzec
7

Wady, które często widzę w aplikacjach internetowych z jedną stroną:

  • Nie można połączyć się z określoną częścią witryny, często jest tylko 1 punkt wejścia.
  • Niefunkcyjne przyciski wstecz i do przodu.
  • Korzystanie z kart jest ograniczone lub nie istnieje.

(szczególnie mobilne :)

  • Ładowanie trwa bardzo długo.
  • W ogóle nie działają.
  • Nie można ponownie załadować strony, nagła utrata sieci zabiera Cię z powrotem na początek strony.

Wszystkie te można obejść, ale z tego, co widziałem, większość twórców stron nie.

Pieter B.
źródło
9
1,2 i 6 są w zasadzie tylko symfoniami tego samego problemu. Że twórca nie używa historii API / linkowania hash.
Martin Hansen
11
Ta odpowiedź jest nieaktualna. Większość struktur aplikacji z jedną stroną ma sposób poradzić sobie z powyższymi problemami
Luis
@Luis, gdy technologia jest dostępna, zbyt często nie jest używana.
Pieter B
5

Istnieje jeden bardzo ważny klient, który nigdy nie uruchamia Javascript: robot Google (od 2012 r . ) . (Podejrzewam, że Bing też nie obsługuje JS.)

Konieczne będzie podanie rozsądnej wersji innej niż AJAX każdej strony, która musi zostać zindeksowana, lub linków do strony, która musi być zindeksowana.

Jeśli Twoja witryna jest mała, możesz udostępnić bardzo podstawowe wersje kilku stron tylko do indeksowania botów.

Jeśli większość treści witryny jest przeznaczona wyłącznie dla zarejestrowanych użytkowników lub z innych powodów nie musi być indeksowana, możesz utworzyć całą nieindeksowaną przestrzeń jako aplikację jednostronicową z własnym wyszukiwaniem, blackjackiem itp.

Jeśli żadne z nich nie jest, prawdopodobnie lepiej od samego początku stworzyć wielostronicową witrynę i dostarczać aktualizacje AJAX tylko wtedy, gdy nie zmienia to „ogólnego celu” strony.

9000
źródło
4
Googlebot odczytuje, a nawet wykonuje teraz JavaScript. Zobacz googlewebmastercentral.blogspot.com/2011/11/…
jfrankcarr
2
W przypadku tego konkretnego pytania jest to aplikacja do zarządzania projektami. Prawdopodobnie nie jest to strona godna SEO.
Jordan
SEO nie stanowi większego problemu dla większości stron, chociaż byłoby miło móc SEO pojedynczych problemów, ponieważ można je konfigurować, aby umożliwić anonimowy dostęp do niego (tak, że jeśli użytkownik przejdzie problem z produktem, może to zrobić znajdź związany z tym problem w module do śledzenia).
ryanzec
1
2015 Aktualizacja: Google ma wykonać JS
rinogo
3

-Duplikacja kodu - na przykład kod modelu. Będę musiał stworzyć modele zarówno po stronie serwera (w tym przypadku PHP), jak i po stronie serwera w javascript.

Jesteś w świecie PHP, ale w świecie .NET istnieją strategie generowania kodu do automatycznego tworzenia proxy JavaScriptF WCF. Zobacz tutaj

Nie wiem, jakie opcje mogą być dostępne, aby nie musieć samodzielnie tworzyć obiektów zdalnych w JavaScript w aplikacji PHP, ale jest to opcja dla osób piszących aplikacje jednostronicowe w .NET.

Brian
źródło
0

Wybór nie musi być taki czy inny. JWt to na przykład zestaw narzędzi internetowych, który implementuje idealną iluzję wielostronicowej strony internetowej, ale jest to pojedyncza strona. Ponadto rozpozna boty Google i przeglądarki, które nie mają javascript (wypróbuj), i przejdzie do tradycyjnego modelu wielostronicowego, gdy je wykryje.

W skrócie:

  • nie musisz pisać API (ale nadal możesz, jeśli chcesz)
  • responsywna aplikacja: każde kliknięcie użytkownika wymaga co najwyżej jednego serwera w obie strony (plus pobieranie obrazów)
  • brak powielania kodu
  • bez logiki biznesowej po stronie klienta
  • minimalna złożoność po stronie klienta
  • boty wyszukiwania mogą to indeksować
użytkownik52875
źródło
1
JWt to ​​zestaw narzędzi Java. Pytanie dotyczy PHP.
Joeri Sebrechts