Vue.js - czym jest, jakie ma zalety i kiedy warto go wybrać?

Przede wszystkim, architektura frameworka opiera się na komponentach – małych, niezależnych blokach kodu, które można swobodnie „recyklować” w obrębie aplikacji. Każdy komponent ma własną strukturę HTML (template), logikę (script) oraz wygląd (style). Możesz je traktować jak uniwersalne klocki Lego, które nie tylko skracają pracę (bo nie musisz pisać tych samych skryptów kilka razy dla każdego pliku aplikacji), ale też czynią kod czytelniejszym i łatwiejszym w utrzymaniu.

Co więcej, wszystkie komponenty w Vue są reaktywne. Na bieżąco śledzą zmiany stanu JavaScript w widoku interfejsu użytkownika i automatycznie się re-renderują, jeśli zmiana w danych dotyczy właśnie ich.

Z tym też łączy się pojęcie Virtual DOM, bardzo ważne zarówno dla Vue.js, jak i dla pozostałych front-endowych frameworków JSa. Przy każdej zmianie interfejsu w pamięci aplikacji generowane są dwie wirtualne kopie rzeczywistego DOM (obiektowego modelu dokumentu HTML/XML) – jedna reprezentuje widok sprzed interakcji, druga – widok docelowy.

W klasycznym podejściu skrypt JS od razu zostałby wykonany na DOMie rzeczywistym; tutaj ma miejsce tzw. diffing. Aplikacja porównuje ze sobą obie wygenerowane wersje wirtualne i na ich podstawie określa, jaki jest minimalny zestaw zmian, które trzeba nanieść na DOM, aby ten odpowiadał zmianom widoku. Dopiero potem „przebudowie” podlegają elementy rzeczywistego DOM… ale wyłącznie te, które faktycznie jej wymagają, a nie całe drzewko. To, oczywiście, przekłada się na wydajność aplikacji.

Vue.js umożliwia również renderowanie deklaratywne, czyli takie podejście do pisania skryptów JavaScript, w którym programista jedynie opisuje efekt końcowy, a nie ścieżkę „krok po kroku” do jego realizacji. Developera interesuje więc jedynie to, co ma się wyświetlić na ekranie i przy pomocy jakich danych; nie musi ręcznie manipulować drzewkiem DOM, bo tym zajmie się mechanizm renderowania Vue.

Angular jest technologią, która powstała w 2010 roku – jest najstarszy z całej trójki, a więc jednocześnie miał najwięcej czasu na zdobycie grona wiernych fanów. React powstał tylko rok później, jednak w licencji Open Source dostępny jest dopiero od 2013 roku. Natomiast Vue to najmłodsze z rozwiązań – powstał w 2014 roku. Angular i React już od wielu lat cieszą się znakomitą renomą. Są to stabilne rozwiązania, które wciąż są rozwijane o nowe funkcjonalności. Za ich sukcesem w dużej mierze stoją też sami twórcy – Angular jest wspierany przez Google, a React przez Facebooka. Vue to zgoła inne podejście – autorska biblioteka jednego programisty, bez wsparcia wielkiego koncernu. Ma to duży wpływ na mniejszą w porównaniu do konkurentów popularność wśród developerów. Angular i React mają już wyrobioną markę w środowisku developerskim, jednak dzięki swojej elastyczności i prostocie, Vue zaczyna deptać im po piętach, stając się coraz mocniejszym konkurentem.

Bardzo mocną stroną Vue jest jego prostota i niski próg wejścia w programowanie rozwiązań w oparciu o tę bibliotekę. Sytuacja wygląda odwrotnie w przypadku Angulara – jest on frameworkiem niezwykle rozbudowanym, o licznych funkcjach i wymaga znacznie większej wiedzy już na samym wstępie. React również należy do bardziej skomplikowanych rozwiązań, jednak jest o wiele prostszy niż Angular. Osobie, która korzysta z Vue, zdecydowanie łatwiej byłoby przejść na Reacta niż na Angulara.

Zarówno Angular, React, jak i Vue są technologiami opartymi o licencję Open Source, czyli są dostępne do darmowego użytkowania, co stanowi bardzo dużą zaletę wszystkich trzech rozwiązań. W przypadku Reacta co jakiś czas pojawiają się jednak wątpliwości, czy technologia na pewno pozostanie w licencji Open Source na zawsze – jak pisaliśmy, nie od samego początku React był otwartym oprogramowaniem. Dla rozwoju technologii zbudowanych na otwartym oprogramowaniu bardzo ważne jest zebranie wokół siebie dużej społeczności, która dba o rozwój, testowanie, wprowadzanie poprawek itd. Jako technologie aktywnie wspierane przez wielkich graczy, Angular i React skupiają bardzo duże społeczności profesjonalistów, dbających o ich rozwój. Vue jest projektem autorskim i swoją społeczność wciąż buduje, jednak z roku na rok jest ona coraz większa, co zapewnia stałą dostępność nowych aktualizacji, poprawek i przede wszystkim – rozwój.

Każda z wymienionych technologii ma inną filozofię działania i co innego stanowi o jej sile. Dlatego nie w każdym projekcie sprawdzi się Angular, tak samo nie zawsze idealnym rozwiązaniem będzie Vue. Angular to dość skomplikowany framework, ale oferujący bardzo duże możliwości, dlatego świetnie sprawdzi się w rozbudowanych projektach z niezwykle dużą liczbą funkcji. React, dzięki swojej dynamice, będzie świetnym rozwiązaniem dla projektów wymagających dynamicznego interfejsu oraz przy rozwoju istniejących już aplikacji. Natomiast Vue sprawdzi się w projektach, którym zależy nam na szybkości i wydajności oraz tych, których deadline wdrożenia przypada na bliską przyszłość.