The Best Job Listing Theme. Everything you need.

Lorem ipsum dolor sit amet, quo veri iuvaret ex, iusto pericula efficiendi pro id. Te vis labores accusamus.

Co to jest SPA – Single Page App?

Single Page App to aplikacja internetowa (czyli z technicznego punktu widzenia strona internetowa), w której nawigowanie polega na asynchronicznym ładowaniu poszczególnych elementów (np. sekcji lub całych widoków) a nie przeładowywaniu poszczególnych podstron.

Najlepiej to wszystko pokazać na żywym przykładzie. Kiedy przeglądasz standardową stronę kliknięcie na link powoduje opuszczenie bieżącej strony i załadowanie całej nowej podstrony. W tym momencie możemy doświadczyć takiego „mignięcia” w przeglądarce. Jest ono krótkie jeżeli strona jest dobrze zoptymalizowana i dysponujemy dobrym łączem internetowym. No ale to mignięcie jest praktycznie zawsze jak nie zauważalne to chociaż wyczuwalne:

Strona o budowie Single Page Application, też ma linki, dokładnie takie same jak standardowa strona. Tylko mechanizm odpowiedzialny za asynchroniczne przejścia do poszczególnych podstron blokuje przeglądarce domyślne zachowanie (czyli opuszczenie bieżącej strony i załadowanie od nowa całej nowej podstrony).

 

Zalety Single-Page Application

  • szybkie działanie
  • lepsze user experience za sprawą płynnych przejść
  • mniejsze obciążenie serwera
  • mniejsze obciążenie urządzenia klienckiego
  • podobny koszt do tworzenia konwencjonalnej strony

 

Narzędzia do tworzenia stron SPA

AJAX – technologia numer jeden do tworzenia Single Page Apps. Stary sprawdzony sposób na asynchroniczne przesyłanie danych pomiędzy serwerem i przeglądarką.

Vanilla JS – oczywiście niczego nie zastąpi czysty JavaScript. Aplikacje takie będą dobrze zoptymalizowane i stale gotowe do rozwoju.

jQuery – sprawdzona biblioteka do przyspieszania pisania kodu JavaScript 

AngularJS – framework, który ułatwia wykonanie data-bindingu. Rozwijany przez Google. Choć poprzednia wersja Angulara nie okazałą się sukcesem Angular ma się dobrze i powinien być coraz częściej wykorzystywany.

Ember.js – framework JavaScriptowy, który umożliwia wykonywanie aplikacji webowych zgodnie z wzorcem MVC (Model View Controller). Ma to za zadanie oddzielić logikę od sterowania i prezentacji danych co ułatwia rozwijanie dużych projektów rozwijanych w zespołach.

Vue.js – framework do budowania interfejsów użytkownika

React – framework wykorzystywany i rozwijany przez deweloperów Facebooka i Instagrama.