Jeśli jesteś fanem kontrowersji w ogólności – na pewno spodoba ci się temat aplikacji izomorficznych / uniwersalnych. Zacznij od prostego pytania – czym one są? Po wpisaniu hasła do googli okazuje się, że nie znajdziemy ich w żadnej dokumentacji. Każda strona ma swój własny, autorski pomysł na definicję tych pojęć. Niektórzy mówią, że to jedno i to samo. Inni, że to zupełnie coś innego. Jedni widzą w tym przyszłość, a drudzy krzyczą, że izomorfizm dawno temu umarł, albo lepiej – nigdy nie istniał.
W obliczu tych wszystkich teorii spiskowych, postanowiłam dorzucić własną definicję. A co!
Generalnie w trakcie badań nad tym artykułem zauważyłam trend wykluczania z języka technicznego izomorfizmu. Czuję, że większość osób udzielających się publicznie w internetach mówi po prostu „aplikacja uniwersalna” mając na myśli wszystkie cechy izomorfizmu oraz uniwersalności. Mimo to zdecydowałam się przedstawić swoją wizję ich definicji, odmienną od ogólnie panującego nurtu, powiedzmy – prywatną.
A więc dla mnie aplikacja uniwersalna posiada inne cechy niż aplikacja izomorficzna. Oba określenia odnoszą się do różnych właściwości aplikacji. Jednocześnie, bardzo często, aplikacja izomorficzna jest jednocześnie uniwersalna. Stąd te dwa określenia są używane zamiennie.
IZOMORFIZM
Słownikowy izomorfizm można oględnie przetłumaczyć na „nie taki sam, ale podobnie wyglądający, o podobnej strukturze”.
W kontekście naszej branży to uruchamianie aplikacji na wielu środowiskach. Bardzo często ściśle wiązane z wykonywaniem kodu Javascript zarówno na serwerze, jak i na kliencie (przeglądarce internetowej). Możesz spotkać nazwę tego kodu – Isomorphic JavaScript. Jednak izomorfizmu nie powinno kojarzyć się tylko i wyłącznie z JS. Możesz przecież napisać aplikację izomorficzną renderowaną po stronie serwera za pomocą takich języków jak PHP, Ruby, Java oraz po stronie klienta za pomocą JS. To tylko przykład. Ważne, aby nie kojarzyć izomorfizmu aplikacji z konkretnym językiem, a raczej postrzegać to pojęcie jako cechę, którą można osiągnąć na wiele sposobów.
Izomorfizm zakłada płynne przełączanie się pomiędzy środowiskami bez utraty stanu. Zazwyczaj strategia jest taka, aby serwer przejmował tylko pierwsze renderowanie strony (co rozwiązuje problem szybkości ładowania aplikacji w SPA), a kolejne już przechodziły na stronę klienta.
UNIWERSALNOŚĆ
Cecha aplikacji oznaczająca wykonywanie tego samego kodu na różnych środowiskach (w celu zapobiegania duplikacji kodu oraz teoretycznie – ułatwienia pracy developera).
Bardzo często kojarzymy ją z dzieleniem zasobów pomiędzy klientem a serwerem. Należy jednak pamiętać również o innych środowiskach (np. urządzeń mobilnych – iOS, Android).
I znowu możesz spotkać się z ciekawym pojęciem Universal Javascript. Zauważ, że w temacie uniwersalnych aplikacji ma ono sens. JS to język obojętny wobec środowiska, na którym się wykonuje. Ta cecha idealnie wpasowuje się w konwencję uniwersalności. Jednocześnie pamiętaj, że nie każdy kod JS jest z definicji uniwersalny. Jeśli np. korzystasz z obiektów window
, document
(dostępnych tylko w przeglądarce) lub server
, fs
(dostępnych tylko w Node.js) – twój kod „nie zadziała wszędzie”, czyli utraci status uniwersalnego.
Czy też dostrzegasz różnice w obu pojęciach? Dzielenie się kodem pomiędzy środowiskami (izomorfizm) to inna idea niż kod zdolny do działania na różnych środowiskach (uniwersalność).
Oczywiste jest jednak, że te pojęcia łączą się ze sobą ze względów… praktycznych. Jeśli chcesz renderować stronę zarówno na serwerze, jak i kliencie – jednocześnie chcesz napisać jeden kawałek kodu, który zadziała na obu środowiskach. Pisanie dwóch wersji byłoby złem w czystej postaci (długi czas pracy nad kodem, trudności w jego utrzymaniu, wprowadzaniu zmian, blabla). Izomorfizm wobec tego pociąga za sobą uniwersalność. Jednocześnie izomorfizm jako idea może żyć bez uniwersalności. Przynajmniej ja to tak rozumiem.
Skomplikowane oraz barrrrdzo dyskusyjne, prawda? Kiedy pisałam ten artykuł, dobrze zrozumiałam ból wszystkich ludzi rzucających pomidorami w Javascript. Nazywanie rzeczy po imieniu jest szalenie ważne, ale też często – po prostu trudne.
Podsumowując – oto zalety oraz wady aplikacji łączących idee izomorfizmu oraz uniwersalności. Taki pozytywny akcent na koniec, jednoczący oba pojęcia.
Zalety:
- Lepsza wydajność (gwarantowane szybkie pierwsze ładowanie, możliwość zwracania przez serwer kompletnych stron z ostateczną treścią) -> lepsze UX
- Wspólny kod serwera oraz klienta -> częściowo łatwiejsze utrzymanie
- Dobre wsparcie dla SEO
Wady:
- Trudniejsze debugowanie
- Trudniejsza budowanie aplikacji, wyższy próg wejścia (należy uważać, który kod generuje się po stronie klienta, a który po stronie serwera)
- Wymaganie lepszej ochrony danych
Podzieliłam się z tobą moim krótkim rozumieniem aplikacji izomorficznej i/lub uniwersalnej. Twoja kolej! Napisz w komentarzach, jak ty je rozumiesz
Jeśli chcesz poznać szczegółowe debaty nad definicjami izomorfizmu oraz uniwersalności, klikaj do źródeł:
nafrontendzie.pl, cdb.reacttraining.com, medium.com/@ghengeveld, stackoverflow.com, stackoverflow.com po raz kolejny, lullabot.com, medium.com/commencis, medium.com/@liweihan, medium.com/airbnb-engineering, hackernoon.com, medium.com/capital-one-tech