W tym artykule omawiamy, jak wybrać bibliotekę lub platformę do wykorzystania w swojej aplikacji internetowej. Rozmowy zawarte w tym artykule pomogą Ci rozważyć wady i zalety różnych bibliotek lub frameworków JavaScriptu, aby wybrać odpowiednią bibliotekę lub framework do rozwiązania Twojego problemu biznesowego. Wiedza na temat wad i zalet aplikacji w poszczególnych sytuacjach jest kluczem do sprawdzenia dużej liczby dostępnych bibliotek JavaScript.
Co to są biblioteki i platformy JavaScript
Co to jest biblioteka JavaScript? W najprostszej formie biblioteka JavaScript to gotowy kod, który możesz wywołać w kodzie projektu, aby wykonać określone zadanie.
Ten post dotyczy głównie „bibliotek”. Jednak wiele z tych dyskusji dotyczy też ram. Różnice między tymi 2 elementami można podsumować w ten sposób:
- W przypadku biblioteki kod aplikacji wywołuje kod biblioteki.
- W przypadku platformy kod aplikacji jest wywoływany przez tę platformę.
Poniższe praktyczne przykłady pokazują różnice między tymi funkcjami.
Przykład wywołania biblioteki JavaScript
Biblioteka JavaScript wykonuje określone zadanie, a potem przekazuje kontrolę aplikacji. Gdy używasz biblioteki, kontrolujesz przepływ danych w aplikacji i decydujesz, kiedy wywołać bibliotekę.
W tym przykładzie kod aplikacji importuje metodę z biblioteki lodash. Po zakończeniu działania funkcji do aplikacji zostanie zwrócony element sterujący.
import capitalize from 'lodash.capitalize';
capitalize('hello'); // Hello
Gdy metoda lodash.capitalize
jest wykonywana, wywołuje wcześniej napisany kod JavaScript, który zmienia pierwszą literę ciągu na wielką.
Przykład użycia platformy JavaScript
Framework JavaScript to wstępnie zdefiniowany szablon kodu, w ramach którego tworzysz działanie aplikacji. Oznacza to, że gdy używasz platformy, to ona kontroluje przepływ danych w aplikacji. Aby skorzystać z platformy, należy napisać niestandardowy kod aplikacji, a następnie ją wywoływać przez platformę.
Ten przykład pokazuje fragment kodu korzystający z ramy JavaScript Preact:
import { createElement } from 'preact';
export default function App() {
return (
<p class="big">Hello World!</p>
)
}
W tym przykładzie zauważysz, że framework ma znacznie większą kontrolę nad napisanym przez Ciebie kodem, a w niektórych przypadkach nawet decyduje, kiedy go wykonać.
Dlaczego warto korzystać z biblioteki?
Korzystanie z biblioteki JavaScript może pomóc w unikaniu niepotrzebnego powtarzania kodu. Biblioteki mogą abstrahować złożoną logikę, taką jak manipulowanie datami czy obliczenia finansowe. Biblioteka może też pomóc w opracowaniu początkowego produktu bez konieczności pisania całego kodu od zera, co może trochę potrwać.
Niektóre biblioteki JavaScript po stronie klienta pomagają w uproszczaniu dziwactw platformy internetowej. Biblioteka może też służyć jako narzędzie edukacyjne. Jeśli na przykład nie znasz funkcji łagodnego przejścia animacji, kod źródłowy biblioteki może Ci pomóc w nauce ich działania.
Niektóre biblioteki są obsługiwane przez duże firmy, które inwestują czas i środki w ich aktualizowanie i bezpieczeństwo. Wiele bibliotek jest uzupełnionych obszerną dokumentacją, która pozwala Ci i Twojemu zespołowi szybko zapoznać się z ich używaniem.
Korzystanie z biblioteki JavaScript pozwala zaoszczędzić czas.
Dlaczego warto śledzić wykorzystanie biblioteki?
Teoretycznie możesz opracować aplikację internetową od podstaw, ale po co się męczyć, skoro możesz skorzystać z bezpłatnego oprogramowania (oprogramowania open source) lub kupić rozwiązanie, które w długim okresie pozwoli Ci zaoszczędzić czas i pieniądze? Dostępnych jest wiele bibliotek i ramek JavaScript, z których każda oferuje unikalne podejście do rozwiązywania problemów i która ma inne cechy. Na przykład:
- Biblioteka może być napisana i utrzymywana wewnętrznie, a nie przez zewnętrzną firmę.
- Biblioteka może mieć określone licencje prawne, które czynią ją odpowiednią lub nieodpowiednią do Twojej aplikacji internetowej.
- Biblioteka może być nieaktualna lub nieobsługiwana.
- Biblioteka może uprościć wykonywanie skomplikowanych zadań i zaoszczędzić dużo czasu i pieniędzy.
- Biblioteka może być powszechnie używana w społeczności i może być dobrze znana wśród programistów.
Jak zapewne się domyślasz, różne cechy mogą wpływać na Twoją aplikację internetową na różne sposoby. Czasami decyzja nie jest tak trudna i w każdej chwili możesz zmienić bibliotekę. Czasami jednak biblioteka może mieć znaczny wpływ na Twoją pracę i aplikację internetową, co sugeruje, że konieczne może być bardziej świadome podejście.
Istnieją pewne środowiska JavaScript niepo stronie klienta, na przykład na serwerze (uruchamiane w chmurze) lub na Raspberry Pi, w których może być konieczne dostosowanie kryteriów używanych do weryfikacji bibliotek i platform.
Wyniki
Nie należy lekceważyć wpływu biblioteki JavaScript na wydajność aplikacji internetowej po stronie klienta. Duża biblioteka JavaScript może zakłócać wczytywanie strony. Pamiętaj, że milisekundy liczą się w miliony.
Przeanalizujmy scenariusz, w którym do animacji używasz biblioteki JavaScript. Niektóre biblioteki mogą łatwo dodać dziesiątki kilobajtów, a w niektórych przypadkach nawet setki kilobajtów. Takie zasoby JavaScriptu mogą znacznie opóźnić wczytywanie strony, ponieważ przeglądarka musi pobrać, przeanalizować, skompilować i wykonać kod.
Im większa biblioteka JavaScript, tym większy wpływ na wydajność dla użytkowników.
Podczas oceny lub używania biblioteki lub frameworku JavaScript weź pod uwagę te sugestie dotyczące zwiększania wydajności:
- W przypadku dużej biblioteki JavaScript rozważ użycie mniejszej alternatywy. Na przykład pakiet date-fns oferuje wiele funkcji w rozsądnym rozmiarze w porównaniu z niektórymi innymi opcjami.
- Kontynuując poprzedni przykład z funkcją date-fns, zaimportuj tylko potrzebne funkcje, na przykład
import { format } from 'date-fns'
. Pamiętaj, aby połączyć to podejście z tree shakingiem, dzięki czemu minimalny ładunek JavaScripta zostanie utworzony i wysłany do użytkowników. - Aby sprawdzić wpływ korzystania z konkretnej biblioteki JavaScript na wydajność, użyj narzędzi do testowania wydajności, takich jak Lighthouse. Jeśli biblioteka wydłuża czas wczytywania strony o 1 sekundę (pamiętaj, aby podczas testowania ograniczać działanie sieci i procesora), być może warto rozważyć zmianę biblioteki. Oprócz sprawdzania wczytywania strony przeprowadź profilowanie zachowania strony internetowej, które wywołuje kod z konkretnej biblioteki. Czas wczytywania strony nie mówi wszystkiego.
- Jeśli autor biblioteki akceptuje komentarze, prześlij swoje spostrzeżenia dotyczące wydajności, sugestie, a nawet wkład w projekt. To właśnie wyróżnia społeczność open source. Jeśli zdecydujesz się przekazać darowiznę, być może najpierw musisz skontaktować się ze swoim pracodawcą.
- Użyj automatycznego narzędzia do śledzenia pakietów, takiego jak bundlesize, aby sprawdzać nieoczekiwanie duże aktualizacje biblioteki. Zwykle biblioteka JavaScript zwiększa swoją objętość z czasem. Dodawanie funkcji, naprawianie błędów, obsługa przypadków szczególnych i inne działania mogą zwiększać rozmiar pliku biblioteki. Gdy Ty lub Twój zespół zdecydujecie się na używanie biblioteki, jej aktualizowanie może być mniej kłopotliwe i nie powinno budzić żadnych wątpliwości. W tym przypadku warto polegać na automatyzacji.
- Przejrzyj wymagania dotyczące biblioteki i oceń, czy platforma internetowa oferuje te same funkcje natywnie. Na przykład platforma internetowa zawiera już selektor kolorów, dzięki czemu nie trzeba używać zewnętrznej biblioteki JavaScriptu do implementowania tej samej funkcji.
Bezpieczeństwo
Korzystanie z modułu zewnętrznego wiąże się z niektórymi nieodłącznymi zagrożeniami dla bezpieczeństwa. Złośliwy pakiet w kodzie źródłowym aplikacji internetowej może zagrozić bezpieczeństwu zarówno zespołu programistów, jak i użytkowników.
Rozważ bibliotekę opublikowaną w ekosystemie NPM. Taki pakiet może być legalny. Z czasem jednak pakiet może zostać naruszony.
Oto kilka wskazówek dotyczących bezpieczeństwa, o których warto pamiętać podczas korzystania z kodu zewnętrznego lub jego oceny:
- Jeśli korzystasz z GitHub, rozważ oferty dotyczące bezpieczeństwa kodu, takie jak Dependabot. Możesz też rozważyć alternatywne usługi, które służą do skanowania kodu pod kątem luk w zabezpieczeniach, na przykład snyk.io.
- Rozważ skorzystanie z usług kontroli kodu – zespołu inżynierów, którzy mogą ręcznie kontrolować używany przez Ciebie kod innej firmy.
- Zastanów się, czy zablokować zależności do określonej wersji, czy zatwierdzić kod innej firmy w ramach kontroli wersji. Pomoże Ci to zablokować zależność do jednej konkretnej wersji, która jest uznawana za bezpieczną. Co dziwne, może to mieć odwrotny skutek w zakresie bezpieczeństwa, ponieważ możesz przegapić ważne aktualizacje biblioteki.
- Przejrzyj stronę główną projektu lub stronę GitHuba, jeśli taka istnieje. Sprawdź, czy istnieją nierozwiązane problemy z bezpieczeństwem oraz czy wcześniejsze problemy z bezpieczeństwem zostały rozwiązane w rozsądnym czasie.
- Kod zewnętrzny, który korzysta z innego kodu, może wiązać się z większym ryzykiem niż biblioteka, która nie ma żadnych zależności. Pamiętaj o tym ryzyku.
Ułatwienia dostępu
Zastanawiasz się pewnie, jaki związek mają biblioteki oprogramowania z dostępnością stron internetowych. Biblioteka oprogramowania może być używana w różnych środowiskach, ale w kontekście biblioteki po stronie klienta opartej na JavaScriptu duże znaczenie ma dostępność witryny.
Biblioteka JavaScript po stronie klienta (lub platforma) może zwiększać lub zmniejszać ułatwienia dostępu w witrynie. Możesz użyć zewnętrznej biblioteki JavaScript, która dodaje do strony suwak obrazów. Jeśli suwak obrazów nie uwzględnia ułatwień dostępu w internecie, twórca stron internetowych może przeoczyć tak ważną funkcję i wydać produkt, który nie ma kluczowych funkcji, takich jak obsługa suwaka za pomocą klawiatury.
- Czy wtyczka do typografii RWD obsługuje użytkowników, którzy powiększają lub pomniejszają stronę?
- Czy wtyczka do przesyłania plików obsługuje przesyłanie plików z urządzeń wspomagających?
- Czy biblioteka animacji obsługuje użytkowników, którzy wolą ograniczyć ruch?
- Czy wtyczka map interaktywnych obsługuje korzystanie tylko z klawiatury?
- Czy biblioteka odtwarzacza audio działa prawidłowo w przypadku czytników ekranu?
Rozsądne jest oczekiwać, że w spełnianie tego typu wymagań związanych z ułatwieniami dostępu wymagane będzie zaangażowanie ze strony programisty stron internetowych. Na przykład:
- W przypadku brakujących funkcji możesz je wdrożyć w swojej bazie kodu, nawet jeśli nadal będziesz korzystać z danej biblioteki.
- Za zgodą pracodawcy możesz dodać do biblioteki brakujące funkcje, jeśli autor biblioteki zezwoli na to.
- Możesz rozpocząć rozmowę z autorem biblioteki. Czy na przykład masz w planach udostępnienie tych ułatwień dostępu? Czy zgadzasz się, że te pliki powinny znajdować się w bibliotece?
- W przypadku popularnych zastosowań możesz zapoznać się z alternatywnymi opcjami biblioteki, które są bardziej dostępne. Mogą one istnieć, ale są trudniejsze do znalezienia.
- W skrajnym przypadku może być konieczne całkowite odinstalowanie biblioteki i wdrożenie funkcji od podstaw. Może się tak zdarzyć, gdy biblioteka lub platforma mają gorsze funkcje ułatwień dostępu przy pierwszym użyciu i musisz cofnąć wiele funkcji, które zgodnie z oczekiwaniami biblioteka lub platforma mają udostępniać bezpłatnie.
Kongresy
Z biblioteki oprogramowania, która korzysta ze ściśle określonych konwencji kodowania, łatwiej jest korzystać. Jeśli w bibliotece stosowana jest konwencja kodowania, o której nie słyszycie, może to utrudniać pracę Tobie i Twojemu zespołowi.
Jeśli biblioteka nie przestrzega zwykłych konwencji kodowania (np. wspólnego poradnika stylu), nie ma możliwości natychmiastowego rozwiązania problemu. Nadal masz kilka opcji:
- Pamiętaj, aby odróżniać kod źródłowy biblioteki od interfejsu API udostępnionego użytkownikowi biblioteki. Wewnętrzny kod źródłowy może stosować nieznane konwencje, ale jeśli interfejs API (część biblioteki, z której korzystasz) stosuje znane konwencje, nie musisz się niczym martwić.
- Jeśli interfejs API biblioteki nie jest zgodny z popularnymi konwencjami kodowania, możesz użyć wzorca projektowego JavaScriptu, takiego jak wzorzec serwera proxy, aby zapakować wszystkie interakcje z biblioteką w pojedynczy plik w bazie kodu. Proxy może wtedy oferować bardziej intuicyjny interfejs API dla innych części kodu w Twojej bazie kodu.
Konwencje odgrywają ważną rolę dzięki łatwości użytkowania. Biblioteka z intuicyjnym interfejsem API może zaoszczędzić wiele godzin, a nawet dni pracy, w porównaniu z interfejsem API, który wymaga wielu eksperymentów.
Aktualizacje
Na przykład w przypadku w pełni działającej biblioteki, która wykonuje kilka obliczeń matematycznych, aktualizacje mogą być potrzebne bardzo rzadko. Biblioteka z pełną funkcjonalnością to rzadkie znalezisko w stale zmieniającym się świecie programowania. Może się jednak zdarzyć, że autor z biblioteki będzie reagował i chciał wprowadzić zmiany. Nowe badania i odkrycia mogą ujawnić lepsze sposoby wykonywania zadań, dlatego techniki używane w bibliotekach i ramach są zawsze podatne na zmiany.
Wybierając bibliotekę lub platformę, zwróć uwagę na sposób obsługi aktualizacji. Pamiętaj, że takie decyzje mogą mieć wpływ na:
- Czy biblioteka ma sensowny harmonogram publikacji? Na przykład aktualizacje repozytorium kodu źródłowego mogą odbywać się często, ale jeśli nie zostaną odpowiednio „opublikowane” lub „opublikowane”, ich pobieranie może być trudne.
- Czy biblioteka jest aktualizowana zgodnie z rozsądnym schematem wersji oprogramowania? Biblioteka powinna oszczędzać Twój czas. Jeśli kod musisz zmieniać za każdym razem, gdy aktualizujesz wersję biblioteki, może to zniweczyć cel jej użycia. Czasami nie da się uniknąć zmian powodujących przerwanie działania, ale w idealnym świecie zmiany są rzadkie i nie są narzucane użytkownikom bibliotek.
- Czy biblioteka inwestuje w zgodność wsteczną? Czasami aktualizacje oprogramowania mogą zawierać zmiany, które powodują przerwanie działania, ale jednocześnie zapewniają zgodność wsteczną. Dzięki temu użytkownik biblioteki może korzystać z jej najnowszej wersji z minimalnymi zmianami w kodzie.
Licencjonowanie
Licencjonowanie oprogramowania jest ważnym aspektem korzystania z bibliotek oprogramowania innych firm. Autor biblioteki może przypisać do niej licencję. Jeśli rozważasz użycie biblioteki, wybrana przez nią licencja może mieć na Ciebie wpływ.
Na przykład biblioteka JavaScript może mieć licencję, która zezwala na jej używanie w środowisku niekomercyjnym. Może to być świetne rozwiązanie w przypadku projektu hobbystycznego. Jeśli Twój projekt ma element komercyjny, rozważ zakup licencji dla firm.
W razie wątpliwości skonsultuj się z prawnikami lub z działem prawnym w swojej firmie.
Społeczność
Biblioteka lub framework z dużą społecznością użytkowników/współtwórców może być przydatna, ale nie jest to gwarancja. Ogólnie rzecz biorąc, im więcej użytkowników ma dana biblioteka lub platforma, tym większa jest szansa, że przyniesie ona korzyści. Weź pod uwagę te wady i zalety uczestnictwa w społeczności programistów:
Zalety:
- Duża liczba użytkowników może oznaczać większe prawdopodobieństwo wczesnego i częstego wykrywania błędów.
- Duża aktywna społeczność może oznaczać więcej samouczków, przewodników, filmów, a nawet kursów dotyczących danej biblioteki lub platformy.
- Duża, aktywna społeczność może oznaczać większą pomoc na forach i witrynach z pytaniami i odpowiedziami, co zwiększa prawdopodobieństwo uzyskania odpowiedzi na pytania dotyczące pomocy.
- Zaangażowana społeczność może oznaczać więcej zewnętrznych współtwórców biblioteki lub frameworku. Mogą pomóc w wdrożeniu funkcji, które nie są uwzględnione w planie autora.
- Jeśli jakaś biblioteka lub platforma są popularne w społeczności, jest większe prawdopodobieństwo, że inni znajomi i współpracownicy dowiedzą się o niej lub będą ją znać.
Wady:
- Projekt z dużą i zróżnicowaną bazą użytkowników może stać się wielkim przeciążeniem przez ciągłe dodawanie funkcji. Rozbudowane biblioteki mogą obniżać wydajność sieci.
- Projekt z aktywnymi i zaangażowanymi użytkownikami może być stresujący dla autorów i konserwatorów oraz wymagać intensywnego moderowania.
- Projekt, który rozwija się szybko, ale nie ma odpowiedniego wsparcia, może zacząć wykazywać oznaki toksycznej społeczności. Na przykład początkujący lub młodsi programiści mogą poczuć się nieprzyjęci w określonej społeczności z powodu reżimu.
Dokumentacja
Dokumentacja oprogramowania zawsze może pomóc w każdej sytuacji, niezależnie od tego, jak prosta lub złożona jest biblioteka lub platforma JavaScript. Nawet bardzo doświadczeni deweloperzy korzystają z dokumentacji, zamiast samodzielnie analizować kod. Dokumentacja zawiera informacje o tym, którego interfejsu API należy używać i jak z niego korzystać.
Dokumentacja może zawierać przykładowy kod, który ułatwi Ci szybkie rozpoczęcie pracy. Oceniając bibliotekę lub platformę, możesz zadać sobie te pytania:
- Czy biblioteka zawiera dokumentację? Jeśli nie, musisz radzić sobie z rozwiązywaniem problemów we własnym zakresie.
- Czy dokumentacja jest przejrzysta, zrozumiała i nie budzi wątpliwości? Wielu deweloperów poświęca dużo czasu na dokumentację. Może się to wydawać nieistotne, ale przejrzystość dokumentacji tekstowej może mieć duży wpływ na produktywność.
- Czy dokumentacja jest generowana całkowicie automatycznie? Taka dokumentacja może być trudniejsza do zrozumienia i nie zawsze zawiera jasne wskazówki dotyczące korzystania z interfejsu API.
- Czy dokumentacja jest aktualna? Konserwacja dokumentacji jest czasem traktowana jako sprawa drugorzędna. Jeśli biblioteka jest zaktualizowana, ale dokumentacja nie jest, może to prowadzić do straty czasu przy tworzeniu aplikacji.
- Czy dokumentacja jest obszerna i dostępna w różnych formatach? Przewodniki użytkownika, przykładowy kod, dokumentacja referencyjna, prezentacje na żywo i samouczki to cenne formaty dokumentacji, które mogą pomóc w skutecznym korzystaniu z biblioteki lub platformy.
Dokumentacja nie zawsze jest kompletna i to normalne. Musisz ocenić potrzeby organizacji, wymagania projektu i złożoność oprogramowania, a następnie na tej podstawie określić poziom dokumentacji, jakiej potrzebujesz.
Podsumowanie
Podczas wybierania biblioteki lub frameworku po raz pierwszy możesz czuć się przytłoczony. Im więcej się uczysz i ćwiczysz, tym lepiej Ci idzie. Gdy następnym razem będziesz wybierać bibliotekę lub framework, warto wrócić do tego artykułu. Możesz używać nagłówków w tym poście jako listy kontrolnej. Na przykład: czy ta biblioteka jest wydajna? Czy ta biblioteka spełnia moje standardy biznesowe w zakresie ułatwień dostępu w internecie?
Istnieją też inne aspekty bibliotek i platform, które warto wziąć pod uwagę, które nie zostały szczegółowo omówione w tym poście:
- Możliwość rozszerzania: na ile łatwo można rozszerzyć bibliotekę za pomocą niestandardowej logiki lub zachowania?
- Narzędzia: czy biblioteka zawiera takie narzędzia, jak wtyczki edytora kodu, narzędzia do debugowania i wtyczki systemowe?
- Architektura: czysty kod jest ważny, ale czy ogólna architektura biblioteki ma sens?
- Testy: czy projekt ma zestaw testów? Czy witryna projektu używa plakietek lub wskaźników, które pokazują, że zestaw testów jest zgodny z najnowszą wersją?
- Zgodność: czy biblioteka działa dobrze z innymi bibliotekami lub frameworkami, z których obecnie korzystasz?
- Koszt: jaki jest koszt ramowego rozwiązania? Czy jest to oprogramowanie open source, czy można je kupić?
- Słowne wskaźniki: te dane powinny znaleźć się nisko na liście kryteriów lub w ogóle być ignorowane, ale warto też wziąć pod uwagę „głosy” dotyczące projektu, powiązane z projektem konta w mediach społecznościowych reprezentujące projekt i liczbę otwartych błędów/problemów na stronie projektu.