JavaScript Pure Front end z API sieci Web w porównaniu z widokami MVC z ajax

Była to raczej dyskusja na temat tego, jakie są dziś myśli ludzi na temat podziału aplikacji internetowej.

Jestem przyzwyczajony do tworzenia aplikacji MVC ze wszystkimi jej widokami i kontrolerami. Zwykle tworzyłbym pełny widok i przekazywałbym go z powrotem do przeglądarki na żądanie pełnej strony, chyba że były określone obszary, których nie chciałem od razu wypełniać, a następnie używałbym zdarzeń ładowania strony DOM, aby wywołać serwer w celu załadowania innych obszarów za pomocą AJAX.

Ponadto, jeśli chodzi o częściowe odświeżenie strony, wywołałbym metodę akcji MVC, która zwróciłaby fragment HTML, którego mógłbym użyć do zapełnienia części strony. Dotyczy to obszarów, w których nie chciałem spowalniać ładowania strony lub obszarów, które lepiej pasują do wywołań AJAX. Jednym z przykładów może być stronicowanie tabeli. Jeśli chcesz przejść do następnej strony, wolałbym, aby wywołanie AJAX otrzymało te informacje, zamiast pełnego odświeżania strony. Ale wywołanie AJAX nadal zwróci fragment HTML.

Moje pytanie brzmi. Czy moje przemyślenia na ten temat są archaiczne, ponieważ pochodzę z .NET, a nie z czystego tła?

Inteligentny programista front-endowy, z którym pracuję, woli robić mniej lub więcej nic w widokach MVC i wolałby robić wszystko na froncie. Aż do wywołań interfejsu API sieci zapełniających stronę. Aby zamiast wywoływać metodę akcji MVC, która zwraca HTML, wolałby zwrócić standardowy obiekt i użyć javascript do utworzenia wszystkich elementów strony.

Sposób programisty front-end oznacza, że ​​wszelkie korzyści, które normalnie uzyskuję dzięki walidacji modelu MVC, w tym walidacja po stronie klienta, znikną. Oznacza to również, że zniknęłyby wszelkie korzyści, które uzyskam dzięki tworzeniu widoków, przy silnie typowanych szablonach HTML itp.

Sądzę, że oznaczałoby to, że musiałbym napisać tę samą weryfikację dla weryfikacji front-end i back-end. JavaScript powinien także mieć wiele metod tworzenia wszystkich różnych części DOM. Na przykład, dodając nowy wiersz do tabeli, normalnie użyłbym częściowego widoku MVC do utworzenia wiersza, a następnie zwróciłem go jako część wywołania AJAX, który następnie zostaje wstrzyknięty do tabeli. Używając czystego interfejsu użytkownika, javascript wziąłby obiekt (na przykład produkt) dla wiersza z wywołania interfejsu API, a następnie utworzyłby wiersz z tego obiektu. Tworzenie poszczególnych części wiersza tabeli.

Witryna, o której mowa, będzie miała wiele różnych obszarów, od administracji, formularzy, wyszukiwania produktów itp. Witryna, która nie wydaje mi się, że wymaga architektury w postaci aplikacji na jednej stronie.

Co wszyscy o tym myślą?

Jestem zainteresowany, aby usłyszeć od twórców front-end i dev-back.

Jestem również nieco sceptyczny, że każda nowa aplikacja internetowa musi być SPA, ale jedną rzeczą, w której jestem w 100% sprzedany jako generalista, a większość jego doświadczenia po stronie klienta jest taka, że ​​architektura zorientowana na usługi przekazuje surowe Dane zamiast HTML do klienta to sposób na to, czy ładujesz wstępnie zbudowane strony / widoki z serwera i robisz dużo dynamicznych rzeczy z danymi po załadowaniu strony, czy budujesz prawie wszystko w 100% za pomocą JavaScript.

Powody, dla których jest to lepsze niż dla programistów po stronie klienta, są w dużej mierze takie same jak powody, dla których nikt nie chce HTML w bazie danych. Co powinien zrobić deweloper po stronie klienta, gdy chce skorzystać ze stołu na przykład, gdy otrzyma HTML? Koszt wydajności obsługi tego wszystkiego na kliencie jest trywialny w porównaniu do złożenia kolejnego żądania serwera, aby to zrobić za Ciebie. Ponadto, tworzenie kodu HTML jest dość dobrze opisane w JS-land. Sortowanie danych i budowanie z nich nowych wierszy tabeli HTML jest dość trywialną pracą dla doświadczonego dewelopera po stronie klienta.

A jaki jest pożytek z architektury zaplecza dla frontonu dla innego urządzenia, które może wymagać wykonania czegoś egzotycznego, takiego jak widżety implementacyjne, które są w 100% kanwami lub zupełnie inną strukturą HTML? Dlaczego deweloper po stronie klienta powinien ładować studio graficzne lub pukać do drzwi deweloperów, aby dokonać drobiazgowej prezentacji?

Jeśli chodzi o twoje obawy związane z utratą silnie typowanego sprawdzania poprawności szablonu, zaufaj mi, gdy powiem, że jeśli masz do czynienia z kompetentnym deweloperem po stronie klienta, nie znajdziesz platformy .NET ani narzędzia do projektowania wizualnego, które bardziej odpowiadałoby miażdżący diament od pyłu o dobrze sformułowanym, poprawnym HTML-ie niż on / ona.

Z perspektywy pełnego stosu podoba mi się, ponieważ oznacza to, że nigdy nie będę musiał szukać logiki biznesowej lub aplikacyjnej, jakąś yutz zdecydowało się zejść do warstwy szablonów. Nie wspominając już o obciążeniu poszczególnych użytkowników, które zdejmuje z serwerów, podczas gdy w wielu przypadkach poprawia komfort ładowania dla użytkownika w nowoczesnych przeglądarkach z nowoczesnymi komputerami.

Myślę, że łatwiej jest również uzasadnić architekturę zaplecza, gdy całkowicie ją odizolujesz od wszystkich elementów prezentacji. Nie pobierasz już danych, aby połączyć je w HTML. Łączysz to razem, aby stworzyć niezależną od implementacji strukturę danych, która dotyczy bardziej ogólnego użytku niż tego, co zostanie zrobione po drugiej stronie. IMO, co zwykle prowadzi do większej spójności w sposobie postępowania, ponieważ dane są teraz celem końcowym, a nie przedostatnim etapem procesu, i istnieje mniej okazji do niezwiązanych ze sobą obaw, aby ich przewody zostały skrzyżowane.

Oferuję moją bardzo subiektywną wartość 2 groszy (za ile jest warta;)). Nie ma dobrej lub złej odpowiedzi na to pytanie, a oprócz twoich punktów istnieje wiele rzeczywistych względów, na przykład:

• Czy masz odpowiednie doświadczenie w domu? tworzenie aplikacji po stronie klienta różni się znacznie od aplikacji opartej głównie na serwerze o zupełnie innym zestawie umiejętności.
• Jak długo chcesz i jakie przeglądarki potrzebujesz obsługiwać? - im więcej robisz na kliencie, tym więcej problemów z przeglądarką napotkasz; IE8 jest bolesny, a wydajność JavaScript jest dość niska, ale wiele firm korzysta z konfiguracji XP / IE.
• Na jakich urządzeniach użytkownicy będą przeglądać witrynę? Analiza i uruchamianie JavaScript może być szybkie w najnowszej wersji Chrome - ale nie jest na starszym urządzeniu mobilnym, szczególnie nie jest to duża ilość JavaScript z dużą ilością logiki biznesowej
• Jak ważne jest obciążenie początkowe? Szablon serwera jest szybszy niż szablon klienta

Ta lista w żadnym wypadku nie jest wyczerpująca i brzmi jak bicie po stronie klienta, co nie jest moim zamiarem, stworzyłem strony z dużym naciskiem na interfejs użytkownika.

Dla mnie tak naprawdę sprowadza się to do doświadczenia użytkownika i ponownego wykorzystania interfejsu API. Aby rozwiązać każdy z nich.

Jeśli zamierzasz tworzyć aplikację lub oferować API, korzystanie z projektu .Net API ma wiele sensu, to tworzy logikę, sprawdzanie i implementację na wielu platformach. W tym scenariuszu kompletne podejście po stronie klienta może być korzystne, interfejs API można utrzymywać osobno i zapewnia on tylko interfejs do aplikacji. Możesz wygodnie modyfikować logikę i refaktoryzację i po prostu utrzymywać ten sam interfejs. Możesz łatwo pisać różne aplikacje dla różnych mediów, używając tego samego kodu tła.

Najsilniejszym argumentem przemawiającym za czystym rozwiązaniem typu front-end (moim zdaniem) jest zadowolenie użytkowników.

Czy (biorąc pod uwagę wszystkie wady) czysta aplikacja JavaScript oferuje znaczną poprawę użyteczności i wygody użytkowania w tradycyjnej witrynie?

Podczas tworzenia witryn, które działają jak aplikacje rodzime; Twierdzę, że odpowiedź jest oczywista, że ​​tak. Większość witryn nie jest jednak tak przejrzysta, więc kwestią oceny jest to, czy przepływy pracy poszczególnych użytkowników korzystają z wysoce dynamicznego interfejsu.

Uważam to za dość pragmatyczne, nie jest to ani sprawa, ani sprawa; JavaScript oczywiście będzie działał całkiem szczęśliwie wraz z technologiami serwerowymi i nie musisz wybierać jednej lub drugiej - każda strona nie jest aplikacją internetową na jednej stronie - ale nic nie stoi na przeszkodzie, aby używać Knockout, kręgosłupa i tym podobnych na poszczególnych stronach do poprawić rzeczy tam, gdzie jest to konieczne.

Mam związek z nienawiścią miłości do ciężkich aplikacji frontendowych.

Z jednej strony uwielbiam pisać JavaScript i uwielbiam przeglądarkę jako środowisko wykonawcze.

Z drugiej strony oba czują się jak samochód wyścigowy Formuły 1 z dziurami w silniku. To naprawdę sprowadza się do tego: czy można zapobiec powielaniu logiki biznesowej między C # a JavaScript? Jeśli tak, użyj dowolnej metody do wygenerowania widoku, który uważasz za warty. Jeśli powielasz logikę biznesową w dwóch językach, możesz mieć programistę front-end, który po prostu chce napisać JavaScript i nie widzi dużego obrazu.

Jeśli chodzi o różnice techniczne:

Renderowanie częściowe i dostarczenie go do klienta:

• Łatwy i szybki do wdrożenia
• Zapobiega powielaniu logiki biznesowej zaplecza na interfejsie użytkownika
• Może spowodować znacznie większy ładunek HTTP przeglądarki. Niezła rzecz na pulpicie z połączeniem o dużej przepustowości. Bardzo źle na słabym telefonie komórkowym, gdy siedzisz w pociągu w godzinach szczytu, pędząc po torze z prędkością 60 mil na godzinę, a 1000 innych telefonów komórkowych jednocześnie odłącza się od jednej wieży komórkowej i próbuje ponownie połączyć się z kolejną wieżą komórkową.

Dostarczanie JSON i renderowanie szablonu po stronie klienta:

• Może spowodować mniejszy ładunek HTTP niż HTML, co może sprawić, że aplikacja będzie wydawać się bardziej wrażliwa na niewiarygodne lub wolne połączenia sieciowe
• Wiele języków szablonów JavaScript jest w pełni funkcjonalnych, co oznacza, że ​​nie potrzebujemy backendu, aby wygenerować trochę HTML

Czasami myślę, że nowsze frameworki JavaScript wyrzucają dziecko z kąpielą --- człowieku, mam nadzieję, że nie zostanę zrzędliwym programistą curmudgeon ...

W mojej ostatniej aplikacji połączyłem interfejs API REST i JavaScript.

To co zrobiłem to:

• Utworzyłem interfejs API REST dla operacji CRUD.
• Utworzyłem aplikację JavaScript, która ładuje wstępnie zdefiniowane szablony HTML i wypełnia dane zwrócone z interfejsu API REST.

Zasadniczo interfejs JS komunikuje się z interfejsem API REST dla operacji CRUD i wypełnia pliki HTML zwróconymi danymi lub utworzonymi danymi lub usuwa usunięte dane lub aktualizuje zmienione dane.

Mamy więc czysty HTML, przetwarzanie wykonywane na kliencie, mniejsze zużycie przepustowości dzięki temu, że nie musimy ładować całego HTML i możemy zapewnić użytkownikom prawdziwie Web 2.0.

Nie przeprowadzam weryfikacji biznesowych na interfejsie dla bezpieczeństwa i powielania kodu, ponieważ każdy może zmienić dane przed wysłaniem ich na serwer i musimy ponownie zweryfikować dane na serwerze. Dlatego łatwo byłoby to zhakować. Wszystkie weryfikacje są wykonywane na zapleczu. Walidacje po stronie klienta są dokonywane tylko dla typów danych wejściowych.

Plusy:

• Możliwość wprowadzania zmian w HTML ze względu na fakt, że nie jest generowany przez JS;
• Niższe zużycie przepustowości przy użyciu ajax i JSON;
• Niższe zużycie przetwarzania serwera, ponieważ HTML jest zapełniany po stronie klienta;
• Lepsze wrażenia użytkownika dzięki użyciu JS do zmiany ekranu, umożliwiając stosowanie efektów i zwiększanie prędkości renderowania.
• Lepsze wykorzystanie protokołu HTTP za pomocą REST.

Cons:

• 2 wnioski do utrzymania;
• Zależy od przetwarzania klienta, które może być złe z powodu złego sprzętu.

Mam nadzieję że to pomoże.

Pozdrowienia,

Odnośnie validationaspektu w interfejsie WWW - Możliwe jest wykonanie „sprawdzania poprawności modelu” i udzielenie odpowiedzi 400 błędnym żądaniem HTTP.

Zobacz /programming/11686690/handle-modelstate-validation-in-asp-net-web-api/25050285#25050285