Narzędzia dla front-end developerów na miarę roku 2021

Kiedy cofniemy się do roku 2004, do czasów kiedy Google uruchamiał pierwszą wersję Gmaila, to zobaczymy świat raczkującego front-endu podejmującego pierwsze próby asynchronicznej komunikacji z serwerem. Rozwiązania promowane przez Google'a dawały wtedy nadzieję na lepszą przyszłość webdevu, ale chyba nikt nie spodziewał się do jakich rozmiarów urośnie ekosystem rozwiązań client-side.

Od tamtego czasu... no cóż - sporo się zmieniło. Obecnie front-end to jeden z najpopularniejszych obszarów całej branży programowania. Nikogo nie dziwi nazywanie naszych rozwiązań aplikacjami, nikogo nie dziwią mniejsze i większe wojenki frameworków, nikogo nie dziwią pełnoprawne konferencje poświęcone tej czy innej bibliotece front-endowej. Po stronie client-side działo się przez ostatnie 15 lat naprawdę dużo, a wraz ze wzrostem apetytu wzrastała również infrastruktura i szeroko rozumiany "tooling". Stosunkowo niski próg wejścia do środowiska NodeJS (w tym dostępu do systemu plików, dostępu do komunikacji sieciowej czy wreszcie ogromu paczek na npm) spowodował, że wielu programistów przerzuciło się z basha i make na skrypty pisanie w niczym innym jak w JavaScripcie.

Ostatnie kilkanaście miesięcy w świecie toolingu to absolutna dominacja Webpacka, który do tematu budowania aplikacji podchodzi najbardziej przekrojowo. Obok rozwijają się też znane i lubiane Parcel i Rollup, jednak ich adopcja wg npm trends wskazuje, że króla bundlerów jeszcze długo z tronu nie zrzucą. No i cóż - wydaje się, że na front-endzie nareszcie opadł kurz, rewolucje zamieniły się w inkrementalne zmiany, a procesy RFC zajęły miejsce niespodzianek i niekompatybilnych API. Wreszcie spokój.

Czy to dobrze?

Będąc skupionym na tylko na jednym obszarze front-endowego ekosystemu (który w pewnym momencie stał się tak złożony, że jego składowe to pełnoprawne produkty i biznesy) można stracić z oczu zmiany w innych obszarach świata client-side - na przykład te, które dotyczą przeglądarek internetowych. Okazuje się, że tracąc z oczu zmiany w przeglądarkach i programowaniu jako takim, można nieświadomie tworzyć tooling który co prawda realizuje oczekiwane założenia, ale być może są to założenia których... na dzisiaj nikt już nie potrzebuje?

Przykładowo, czy zastanawialiście się kiedyś dlaczego budowanie większych projektów w trybie developerskim trwa tak długo? Kiedyś słusznie założono, że budowanie aplikacji musi polegać na spakowaniu wszystkich jej składowych (modułów) do jednego skryptu, który następnie zostanie udostępniony do przeglądarki. Współczesne przeglądarki rozumieją jednak ES Modules i same - w runtime - potrafią dociągnąć niezbędne moduły potomne. Po co więc tracić czas na coś, co może za nas zrobić przeglądarka?

Na szczęście są programiści, którzy te kropki połączyli wcześniej niż inni, a rezultatem ich pracy jest Snowpack.

Po drugie, czy zastanawialiście się kiedyś, dlaczego 99% najpopularniejszych narzędzi front-endowych powstaje w JavaScripcie? Jasne, co prawda jest to język przeglądarki i język NodeJSa, ale przecież to nie od wyboru języka powinien się zaczynać nowy projekt. Na starcie każdej nowej inicjatywy powinniśmy sobie zadać pytanie "co chcemy osiągnąć" i "jakie są wymagania funkcjonalne i niefunkcjonalne", a dopiero później powinniśmy wybierać technologię czy język. Skoro chcielibyśmy stworzyć narzędzie do szybkiego budowania projektów, to może warto byłoby wybrać... szybszą platformę niż NodeJS?

Na szczęście znalazł się programista, który właśnie w ten sposób podszedł do problemu wolnych buildów, a rezultatem jego pracy jest esbuild.

Po trzecie, czy zastanawialiscie się jak do zmian w przeglądarkach podchodzi mainstream, czyli wielka trójca - React, Vue i Angular? W dzisiejszych czasach każda z tych platform oferuje już swoje CLI przykrywające niemal zupełnie tajniki budowania projektu, więc istnieje ryzyko zabetonowania tych "nie do końca optymalnych" praktyk kolejnymi warstwami abstrakcji. Czy Webpack zostanie z nami na zawsze?

Na szczęście Evan You, autor frameworka Vue.js, postanowił niedawno spędzić wieczór nad eksperymentem związanym z ES Modules, a efektem jego pracy jest Vite.

Jeśli chcecie zobaczyć jak w praktyce wygląda korzystanie z tych narzędzi dla front-end developerów, to zachęcam was do obejrzenia poniższego filmu na naszym kanale na YouTube. Opowiadam w nim o nowej fali narzędzi front-endowych, a poza zrzutem dokumentacji oferuję praktyczną wiedzę i odpowiedź na pytanie dlaczego. Odpowiedź na to pytanie jest kluczowa, bo pozwoli wam ona łatwiej zrozumieć kontekst powstawania i wykorzystywania tych narzędzi w świecie rzeczywistym.