Vue

Co to jest Vue

Vue to javascriptowy framework, w którym interfejs składa się z komponentów. Komponent opisuje w jednym miejscu trzy rzeczy: znaczniki, dane, które wyświetla, i to, co ma się stać, gdy te dane się zmienią. Zmieniasz dane, a Vue samo przerysowuje tę część strony, która je pokazuje.

Nie piszesz przy tym kodu w stylu „znajdź element i ustaw mu tekst”, a to właśnie tam psuje się większość ręcznie robionej interaktywności. Komponentem może być cały ekran aplikacji albo jeden panel filtrów na stronie, która poza nim jest zwykłym HTML-em, i ta rozpiętość jest w Vue najbardziej użyteczna.

Kiedy Vue się opłaca

Przy zwykłej stronie raczej się nie opłaca. Jeśli potrzebujesz menu, które się otwiera, i formularza, który się waliduje, framework jest narzutem: płacisz za niego pobranym kodem i krokiem budowania.

Vue zaczyna się bronić wtedy, gdy stan robi się skomplikowany. Katalog z filtrami, które muszą zgadzać się z adresem, konfigurator, w którym sześć pól zmienia jedną cenę, tabela sortowana i stronicowana bez przeładowania. Napisane ręcznie zamieniają się w stos nasłuchów, które przy trzeciej zmianie wymagań przestają się ze sobą zgadzać.

Gdzie używam Vue

Używam go w dwóch układach, które wyglądają zupełnie inaczej.

Jako wyspę na statycznej stronie. Strona jest zbudowanym z góry HTML-em, a jeden komponent, na przykład filtr albo kalkulator, jest w Vue. Odwiedzający pobiera framework tylko na tych podstronach, które go mają.

Jako front aplikacji w Laravelu. Katalog części, który zbudowałem, działa na Vue 3 i backendzie w Laravelu. Tak wygląda większość mojej pracy aplikacyjnej: PHP trzyma dane, uprawnienia i zadania w tle, a Vue trzyma ekran.

Unikam trzeciego układu, czyli strony marketingowej przepisanej na aplikację jednostronicową. Każdy odwiedzający pobiera wtedy framework po to, żeby przeczytać tekst, a wyszukiwarka dostaje pusty <div>, dopóki nie wykona się JavaScript.

Czego Vue nie robi

Vue nie konkuruje z WordPressem ani z innym CMS-em, bo nie przechowuje i nie edytuje treści. Nie jest też automatycznie zły dla SEO: renderowany na serwerze albo w trakcie budowania wychodzi zwykłym HTML-em. Szkodzi dopiero wtedy, gdy wysyłasz pustą stronę, która dopełnia się w przeglądarce, a to decyzja o sposobie renderowania, nie o frameworku.