Narzędzia JavaScript Full-Stack Web Developera: Przegląd package managerów

0:00Domyślam się, że temat Package Managerów jest Ci

0:02przynajmniej znany ze względu na to, że instalowanie pakietów npm jest jedną z

0:07pierwszych rzeczy, które robimy pracując w ekosystemie JavaScriptu.

0:11Jednocześnie chciałbym się przy tym temacie nieco zatrzymać ze względu na to,

0:14że nawet w przypadku doświadczonych osób zdarzają się nawet fundamentalne błędy

0:19oraz całkiem częste są sytuacje, w których te osoby po prostu nie zdają sobie sprawy

0:24z pewnych możliwości oraz elementów zarządzania zależnościami projektu, które

0:28często prowadzą do różnego rodzaju błędów, które naprawia się dość po omacku.

0:33Zacznijmy od tego, że z całą pewnością

0:35najbardziej popularnym Package Managerem dla JavaScriptu jest oczywiście npm.

0:39Jeżeli z niego korzystasz, nie ma z tym najmniejszego problemu, aczkolwiek musisz

0:43zdawać sobie sprawę, że obecnie mamy dostępnych przynajmniej kilka alternatyw.

0:48Pierwszą z nich, która pojawiła się już lata temu jest Yarn.

0:51I szczerze mówiąc, w momencie jego premiery i chwilę później był całkiem

0:55dobrą alternatywą dla NPM, który stopniowo zaczął się aktualizować i też

1:00adresować pewnego rodzaju problemy, które początkowo rozwiązywał wyłącznie Yarn.

1:05Aktualnie poza małymi detalami myślę, że wybór pomiędzy NPM a YARN nie wiąże się ze

1:11szczególnie zauważalnym różnicami, ale już nieco inaczej jest w przypadku pnPm, czyli

1:16stosunkowo nowego narzędzia, które charakteryzuje się przede wszystkim

1:20szybkością oraz efektywnością dotyczącą zarządzania samymi pakietami

1:25zainstalowanymi na naszym prywatnym komputerze.

1:27Otóż jak pewnie doskonale wiesz, w

1:29przypadku instalacji pakietów z pomocą NPM a bądź YARNa, w naszym katalogu projektu

1:34tworzony jest katalog node_modules zawierający wszystkie zależności projektu.

1:39Mało tego, zależności naszego projektu

1:41posiadają swoje zależności i efekt końcowy jest taki, że nawet w przypadku prostego

1:46projektu mamy tutaj nawet kilkaset katalogów.

1:48W tej chwili wykorzystując magię kina utworzyłem sobie tutaj dwa projekty NestJS.

1:52Jeden i drugi jest bliźniaczo do

1:54siebie podobny, z tą różnicą, że jeden wykorzystuje npm, a drugi pnpm.

1:59No i teraz zarówno w przypadku tego

2:01pierwszego, jak i drugiego usuniemy sobie katalogi node_modules, a następnie przejdziemy

2:05do terminala, w którym to z pomocą npm zainstalujemy zależności

2:10no i w tym momencie te wszystkie

2:11zależności zostały pobrane na mój komputer i trwało to 4 sekundy.

2:16W przypadku pnpm jeżeli wykonamy dokładnie tą samą akcję to rezultat o który nam

2:21tutaj chodzi zostanie zrealizowany w 300 milisekund.

2:24Poza tym, jeżeli zwrócisz uwagę na to, co tutaj dokładnie się wydarzyło, to mamy

2:28informację o tym, że niektóre paczki zostały podlinkowane przez pnpm.

2:33Jeżeli teraz przebadamy sobie zarówno node-modules

2:36pochodzące z projektu npm tutaj po prawej stronie oraz z projektu pnpm po lewej, to

2:41zobaczymy prawie 100 megabajtów różnicy pomiędzy nimi.

2:45Jeżeli jeszcze raz przejdziemy sobie do

2:47Findera, to okaże się, że w projekcie pnpm w katalogu node-models obok samych

2:52folderów zależności w przypadku tych podlinkowanych mamy rzeczywiście taką

2:55strzałkę, która oznacza mniej więcej tyle, że w tym momencie paczka ts-node nie

3:00znajduje się w katalogu node-modules, tylko została do niego podlinkowana.

3:04Oznacza to, że jeżeli przykładowo rxjs zainstalował bym w wielu projektach

3:08wykorzystujących pnpm, to fizycznie ta konkretna wersja tej

3:12paczki znajdowała się na moim dysku tylko raz.

3:15No i jak się nie łatwo domyślić, to właśnie między innymi z tego wynika ta

3:18szybkość oraz efektywność pracy z pakietami.

3:21Zwyczajnie tutaj prosta koncepcja

3:23sprawiła, że oszczędzamy zarówno czas jak i miejsce na dysku.

3:27Osobiście teraz już praktycznie na każdym kroku sięgam po pnpm, aczkolwiek jeszcze na

3:32ten moment mam pewien problem z wykorzystaniem go w połączeniu z IntelliJ.

3:36Mam nadzieję, że wynika to albo z mojej błędnej konfiguracji, albo że poprawka,

3:40która rozwiąże ten problem pojawi się już niebawem.

3:43No i teraz na rynku pojawił się co ciekawe

3:45jeszcze jeden gracz o nazwie Bun, który również reprezentuje zupełnie inne

3:49podejście i co więcej nie jest tylko Package Managerem, tylko całym narzędziem zdolnym

3:53do bundlowania, transpilowania kodu, instalacji pakietów, konwertowania, obsługi

3:58nawet w TypeScript, czy też w ogóle uruchamiania samego kodu JavaScript.

4:02Aktualnie sam projekt znajduje się jeszcze

4:04w becie nie nadającej się do wykorzystania produkcyjnego

4:07aczkolwiek patrząc na statystyki lub też

4:09nawet testowe wykorzystanie możliwości poprzez chociażby instalację pakietów z

4:14pomocą Bun wydaje mi się, że warto obserwować ten projekt.

4:18Tym bardziej, że jeżeli

4:19wrócimy jeszcze do terminala i wykorzystamy właśnie Bun do instalacji

4:23wszystkich zależności naszego projektu, to zwróć uwagę, że zajęło to 784 milisekundy

4:29i to pomimo tego, że w przeciwieństwie do pnpm nie mieliśmy tutaj tej przewagi

4:33dotyczącej linkowania pakietów, ponieważ jeżeli przejdziemy sobie teraz do katalogu Bun

4:39to zobaczymy, że w Node.js faktycznie fizycznie znajdują się te pliki.

4:43Tutaj nie ma mowy o linkowaniu czegoś co znajduje się w innym miejscu, tylko po

4:48prostu te wszystkie zależności fizycznie znajdują się w tym konkretnie miejscu.

4:52Co prawda trzeba tutaj podkreślić, że czasem Bun potrafi się zawiesić i taka

4:56instalacja pakietów, tak jak w tym przypadku zajęła bardzo krótką chwilę,

4:59tak w innych przypadkach po prostu

5:01zatrzymuje się na jakimś etapie i nie chce skończyć.

5:04Tymczasem jeżeli pójdziemy dalej, to

5:06zapewne zdajesz sobie sprawę z tego, że istnieją jeszcze inne narzędzia typu

5:10Package Manager do obsługi dodatkowych rozszerzeń dla systemów Linux oraz macOS

5:15i analogicznie też dla Pythona oraz samego Linuxa.

5:19I w tym przypadku mówimy o APT.

5:21W każdym razie wszystkie te trzy narzędzia

5:23oczywiście Package Manager dla JavaScriptu jest Twoim niezbędnikiem pracy.

5:28Zawsze bierz tutaj pod uwagę fakt, w którym miejscu na Twoim dysku są

5:31instalowane pakiety oraz w jakich konkretnie wersjach są instalowane.

5:35O tym, w jaki sposób zarządzać sobie wersjami akurat w przypadku ekosystemu

5:40JavaScriptu będziemy sobie jeszcze mówić w kolejnych lekcjach.

5:43Natomiast teraz chciałbym tylko, aby było

5:44dla Ciebie jasne, że Package Managerów mamy do dyspozycji przynajmniej kilka i

5:48to, który wybierzesz zależy w dużej mierze już od Ciebie

5:51natomiast ja chciałbym pokazać Ci, w jaki sposób zarządzać samymi zależnościami

5:56projektu, niezależnie od tego, z jakich narzędzi będziesz korzystać.

5:59Teraz dzięki za uwagę i do usłyszenia za chwilę.