Porównanie technologii React.js vs. Angular
slides: #2-soft-compare.html
React.js vs. Angular - porównanie rozwiązań
Przygotowanie
- Uczeń zna podstawy komunikacji HTTP
- Uczeń zna języki HTML i CSS
- Uczeń programuje w Java Script
- Uczeń zna zagadnienia publikowania Witryn w sieci Internet
Description
| React | Angular |
|---|---|
| biblioteka JS do budowy komponentów UI, interaktywnych UI | framework do budowy dynamicznych aplikacji webowych wspieraący MVC |
| możliwość użycia bibliotek zewnętrznych | wbudowana obsługa AJAX, HTTP oraz wzorca Obserwatora |
| oszczędza czas przy tworzeniu aplikacji | wsparcie dużej społeczności |
| prostota oraz "komponowalny" / modułowy | spójny z technologią |
| wspierany przez Facebook | wspierany przez Google efektywny dzięki TypeScript |
| lepszy UX oraz szybkość działania | rozdzielenie UI oraz Logiki biznesowej |
| szybszy rozwój aplikacji | zwiększone wsparcie dla obsługi błędów |
| stabilność kodu dzieki data-binding | bezproblemowe aktualizacje poprzez CLI |
| Komponenty | Formularze i walidacja Shadow DOM oraz lokalny CSS |
Wybór React'a
- wymagana aplikacja z wieloma zdarzeniami
- dev team ma doświadczenie z technologiami web: HTML, CSS i JS
- wymagania doprowadzają do spersonalizowanego podejścia do aplikacji
- chcesz stworzyć współdzielone komponenty w aplikacji
Wybór Angular'a
- potrzeba aplikacji gotowej-do-użycia o wysokim spotniu produktywności
- dev team ma doświadczenie z technologiami native: Java, .NET, Scala, poprzednie wersja Angulara
- potrzebujesz aplikacji naszpikowanej funkcjonalnościami, na dużą skalę
- złożoność aplikacji jest niska lub średnia
code| Parametr | React | Angular |
|---|---|---|
| Typ rozwiązania | biblioteka wymagająca własnych uzupełnień | kompletny framework z gotowymi komponentami |
| Użycie bibliotek | aplikację można wyposażyć w zewnętrzne biblioteki JS | kompletne rozwiązanie samo w sobie |
| Nauka | Prostsza i szybsza | Niełatwa dla początkujących, wymaga dużo treningu |
| Wsparcie społeczności | Niewielkie | Realny i niezawodny system wsparcia |
| Instalacja | Dłuższy czas rozruchu, lecz szybszy dostarczenia | Szybki start, lecz wymaga więcej kodowania, co doprowadza do opóźnień |
| Wybór | Wolność wyboru narzędzi, architektury, bibliotek | Ograniczona wolność wyboru i elastyczności |
| Data binding | Jednokierunkowy - elementy UI muszą odpowiadać modelowi | Dwukierunkowy - model dostosowuje się automatycznie |
| Testowanie i debugowanie | Zestaw narzędzi do przeprowadzania różnych testów | Jedno narzędzie |
| Dokumentacja | dokumentacja nadąża za rozwoje platformy | proces rozwoju platformy spowalnia katualizację dokumentacji |
| Aktualizacja | proste - pomocne skrypty | co 6 miesięcy, dając czas na przygotowanie się |
| Model | bazuje na Virtual DOM | bazuje na MVC |
| Wsparcie społoczności | Społeczność developerów FB | Duża społeczność developerów i sympatyków |
| Preferowany język | JSX - JavaScript XML | TypeScript |
| Kto używa | Facebook, Uber Technologies, Instagram, Netflix, Pinterest, etc. | Wepay, Beam, Auto Trader, Mesh, Streamline Social, etc. |