Angular vs React vs Vue: Welches Framework soll 2020 gewählt werden?

Angular vs React vs Vue: Welches Framework soll 2020 gewählt werden?

Angular vs React vs Vue: Welches Framework soll 2020 gewählt werden?
СОДЕРЖАНИЕ
02 июня 2020

Dieser Beitrag ist ein umfassender Leitfaden, der möglicherweise die richtige Lösung für Sie ist: Angular vs React vs Vue.


Noch vor ein paar Jahren diskutierten Entwickler hauptsächlich darüber, ob sie Angular vs React für ihre Projekte verwenden sollten. Aber im Laufe der letzten Jahre hat das Interesse an einem dritten Spieler namens Vue.js zugenommen.

Wenn Sie als Entwickler mit einem Projekt beginnen und sich nicht für ein JavaScript-Framework entscheiden können, hilft Ihnen dieses Handbuch bei der Entscheidung.

Wir behandeln verschiedene Aspekte von Angular, Vue und React, um zu sehen, wie sie Ihren Anforderungen entsprechen. Dieser Beitrag ist nicht nur eine Anleitung zu Angular vs React vs Vue, sondern soll eine Struktur bereitstellen, mit deren Hilfe Front-End-JavaScript-Frameworks im Allgemeinen beurteilt werden können. Falls nächstes Jahr ein neues Framework eintrifft, wissen Sie genau, welche Parameter zu beachten sind!

* In diesem Beitrag gehen wir davon aus, dass Sie über Grundkenntnisse in JavaScript verfügen und auch JavaScript-Frameworks verwendet haben.

Angular vs React vs Vue

Lass uns anfangen:

Teil 1: Eine kurze Geschichte von Vue vs React vs Angular

Bevor wir uns mit den technischen Details befassen, lassen Sie uns zunächst die Geschichte hinter diesen Frameworks erläutern, um ihre Philosophie und ihre Entwicklung im Laufe der Zeit besser zu verstehen.

Wie alles begann ��

eckiges Logo

Winkelig, Das von Google entwickelte Produkt wurde erstmals im Jahr 2010 veröffentlicht und ist damit das älteste der Partie. Es ist ein TypeScript-basiertes JavaScript-Framework. Eine wesentliche Verschiebung erfolgte 2016 mit der Veröffentlichung von Angular 2 (und dem Fallenlassen von "JS" vom ursprünglichen Namen – AngularJS). Angular 2+ ist nur als Angular bekannt. Obwohl AngularJS (Version 1) immer noch aktualisiert wird, konzentrieren wir uns auf Angular. Die neueste stabile Version ist Angular 9, die im Februar 2020 veröffentlicht wurde.

vue logo

Vue, auch bekannt als Vue.js, ist das jüngste Mitglied der Gruppe. Es wurde 2014 von dem ehemaligen Google-Mitarbeiter Evan You entwickelt. In den letzten drei Jahren hat sich die Popularität von Vue erheblich verändert, obwohl es nicht von einem großen Unternehmen unterstützt wird. Die aktuelle stabile Version ist 2.6 und wurde im Februar 2019 veröffentlicht (mit einigen kleinen inkrementellen Versionen seitdem). Die Mitwirkenden von Vue sind unterstützt von Patreon. Vue 3, derzeit in der Alpha-Phase, plant zu Wechseln Sie zu TypeScript.

Logo reagieren

Reagieren, Entwickelt von Facebook, wurde ursprünglich im Jahr 2013 veröffentlicht. Facebook verwendet React ausgiebig in seinen Produkten (Facebook, Instagram und WhatsApp). Die aktuelle stabile Version ist 16.X und wurde im November 2018 veröffentlicht (mit kleineren inkrementellen Updates seitdem)..

Hier ist eine kurze Zusammenfassung von Angular vs React vs Vue in Bezug auf ihren Status und ihre Geschichte:

Die Geschichte von Angular vs React vs Vue

Winkelig
Reagieren
Vue

Erstveröffentlichung201020132014
Offizielle Seiteangle.ioreactjs.orgvuejs.org
Ca. Größe (KB)50010080
Aktuelle Version916.x.2.6.x.
Benutzt vonGoogle, WixFacebook, UberAlibaba, GitLab

Lizenz ��‍♂️

Bevor Sie ein Open Source-Framework verwenden, stellen Sie sicher, dass Sie dessen Lizenz durchlaufen. Interessanterweise verwenden alle drei Frameworks die MIT-Lizenz, Dies bietet begrenzte Einschränkungen für die Wiederverwendung, selbst in proprietärer Software. Stellen Sie sicher, dass Sie die Auswirkungen der Lizenz kennen, bevor Sie ein Framework oder eine Software verwenden.

Hier ist eine kurze Zusammenfassung der MIT-Lizenz in einfachen englischen Begriffen.

Popularität ��

Wie "eckig" und "reagieren" sind gebräuchliche Wörter, es ist schwierig, ihre Popularität von Google Trends zu erfassen. Ein guter Vertreter für ihre Popularität ist jedoch die Anzahl der Sterne, die ihre GitHub-Repositories erhalten. Mitte 2016 kam es zu einer plötzlichen Verschiebung der Anzahl der Vue-Sterne. In letzter Zeit war Vue mit React eines der beliebtesten Frameworks.

Stars auf GitHub-Projekten für Angular vs React vs VueAnzahl der Sterne in GitHub-Projekten für Angular, React und Vue

Lassen Sie uns überprüfen, wie der Arbeitsmarkt für Angular vs React vs Vue ist, was auch ein gutes Maß für die Popularität ist:

Arbeitsmarkt für Angular vs React vs Vue ��‍♂️

Das beste Datenquellen die die Trends auf dem Arbeitsmarkt anzeigen, sind die verschiedenen Jobbörsen.

Wie aus den Trends von Ende 2018 hervorgeht, ist die Anzahl der Jobs, für die Angular oder React erforderlich sind, ungefähr gleich, während die von Vue nur einen Bruchteil dieser Anzahl ausmachte (etwa 20%). Diese Liste ist definitiv nicht vollständig, gibt aber ein gutes Bild der gesamten Tech-Industrie.

Wenn Sie streng aus der Sicht des aktuellen Arbeitsmarktes schauen, ist es am besten, Angular oder React zu lernen. Angesichts der Tatsache, dass Vue in den letzten drei Jahren an Popularität gewonnen hat, kann es einige Zeit dauern, bis Projekte Vue verwenden oder neue Projekte, die Vue übernehmen, einen Reifegrad erreichen, der eine höhere Anzahl von Entwicklern befiehlt.

Teil 2: Gemeinschaft und Entwicklung

Nachdem Sie mit der Geschichte und den Trends der einzelnen Frameworks vertraut sind, werden wir uns die Community ansehen, um die Entwicklung dieser Frameworks zu bewerten. Wir haben bereits gesehen, dass für alle Frameworks im vergangenen Jahr regelmäßig inkrementelle Releases ausgeliefert wurden, was darauf hinweist, dass die Entwicklung in vollem Gange ist.

Schauen wir uns Angular vs React vs Vue in Bezug auf Statistiken zu ihren GitHub-Repositories an:

Winkelig
Reagieren
Vue

# Beobachter3,2k6,6k6,0k
# Sterne57k144k157k
# Gabeln15,9k27,6k23,7k
# Mitwirkende1.0891.361289

Vue hat eine große Anzahl von Beobachtern, Sternen und Gabeln. Dies zeigt seine Beliebtheit bei den Benutzern und seinen Wert beim Vergleich von Vue und React. Die Anzahl der Mitwirkenden für Vue ist jedoch geringer als für Angular und React.

Eine mögliche Erklärung ist das Vue wird ausschließlich von der Open-Source-Community gesteuert, während Angular und React einen erheblichen Anteil an Google- und Facebook-Mitarbeitern haben, die zu den Repositories beitragen.

Aus den Statistiken geht hervor, dass alle drei Projekte erhebliche Entwicklungsaktivitäten aufweisen, und dies wird sicherlich auch in Zukunft so bleiben – nur diese Statistiken können nicht die Grundlage dafür sein, dass sie sich nicht für eines von beiden entscheiden.

Teil 3: Migrationen

Während Sie mit dem Framework Ihrer Wahl arbeiten, müssen Sie sich keine Sorgen machen, dass ein Framework-Update hinzukommt und Ihren Code durcheinander bringt. Obwohl in den meisten Fällen von Version zu Version nicht viele Probleme auftreten, ist es wichtig, stets am Puls der Zeit zu bleiben, da einige Aktualisierungen von größerer Bedeutung sein können und Optimierungen erfordern, um die Kompatibilität zu gewährleisten.

Winkelig plant größere Updates alle sechs Monate. Es gibt auch einen Zeitraum von weiteren sechs Monaten, bevor wichtige APIs veraltet sind. Dies gibt Ihnen die Zeit für zwei Release-Zyklen (ein Jahr), um gegebenenfalls die erforderlichen Änderungen vorzunehmen.

Wenn es um Angular vs React geht, hat Facebook dies angegeben Stabilität ist von größter Bedeutung für sie, da große Unternehmen wie Twitter und Airbnb React nutzen. Upgrades durch Versionen sind in React im Allgemeinen am einfachsten, mit Skripten wie React-Codemod Hilfe bei der Migration.

Im Abschnitt Migration der FAQ erwähnt Vue dies 90% der API sind identisch, wenn Sie von 1.x auf 2 migrieren. Da ist ein Migrationshilfe-Tool Das funktioniert auf der Konsole, um den Status Ihrer App zu bewerten.

Teil 4: Arbeiten mit Vue vs Angular vs React

Hier sind einige wichtige Merkmale zu betrachten, darunter die Gesamtgröße und die Ladezeiten, die verfügbaren Komponenten und die Lernkurve.

Größe und Ladezeiten ⏲️

Die Größe der Bibliotheken ist wie folgt:

  • Winkel 4+: Abhängig von der produzierten Bündelgröße
  • Reaktion: 116 KB
  • Vue: 91 KB

Obwohl es einen signifikanten Unterschied zwischen den Größen der Frameworks gibt, sind sie im Vergleich zur durchschnittlichen Webseitengröße (2+ MB im Jahr 2018) immer noch klein. Wenn Sie zum Laden dieser Bibliotheken ein beliebtes CDN verwenden, ist es außerdem sehr wahrscheinlich, dass ein Benutzer die Bibliothek bereits in sein lokales System geladen hat.

Komponenten ��️

Komponenten sind integraler Bestandteil aller drei Frameworks, unabhängig davon, ob es sich um Vue, React oder Angular handelt. Eine Komponente erhält im Allgemeinen eine Eingabe und ändert das Verhalten basierend darauf. Diese Verhaltensänderung äußert sich im Allgemeinen in einer Änderung der Benutzeroberfläche eines Teils der Seite. Die Verwendung von Komponenten erleichtert die Wiederverwendung von Code. Eine Komponente kann ein Warenkorb auf einer E-Commerce-Website oder ein Anmeldefeld in einem sozialen Netzwerk sein.

Winkelig Winkel:
In Angular werden Komponenten als bezeichnet Richtlinien. Direktiven sind nur Markierungen auf DOM-Elementen, mit denen Angular auch bestimmte Verhaltensweisen verfolgen und anhängen kann. Daher trennt Angular den UI-Teil von Komponenten als Attribute von HTML-Tags und deren Verhalten in Form von JavaScript-Code. Dies ist es, was es auszeichnet, wenn man Angular vs React betrachtet.
Reagieren Reagieren:
Interessanterweise kombiniert React die Benutzeroberfläche und das Verhalten von Komponenten. Zum Beispiel hier ist der Code zum Erstellen einer Hallo-Welt-Komponente in React. In React ist derselbe Teil des Codes dafür verantwortlich, ein UI-Element zu erstellen und sein Verhalten zu bestimmen.
Vue Vue:
In Vue sind Benutzeroberfläche und Verhalten ebenfalls Teil von Komponenten, wodurch die Dinge bei der Betrachtung von Vue vs React intuitiver werden. Außerdem ist Vue in hohem Maße anpassbar, sodass Sie die Benutzeroberfläche und das Verhalten von Komponenten in einem Skript kombinieren können. Weiter können Sie auch Verwenden Sie Pre-Prozessoren in Vue anstelle von CSS, Das ist eine großartige Funktionalität. Vue ist großartig, wenn es um die Integration mit anderen Bibliotheken wie Bootstrap geht.

Um zu vergleichen, wie dieselbe App mit verschiedenen Bibliotheken aussieht, finden Sie hier einen großartigen Beitrag Erstellen der gleichen Aufgabenlisten-App für React and Vue und Gegenüberstellung der Unterschiede zwischen den beiden Frameworks.

Lernkurve ��

Wie schwierig ist es also, jedes dieser Frameworks zu lernen??

Winkelig Winkel:
Winkelig hat eine steile Lernkurve, da es sich um eine Komplettlösung handelt. Um Angular zu beherrschen, müssen Sie die zugehörigen Konzepte wie TypeScript und MVC erlernen. Obwohl es einige Zeit dauert, Angular zu lernen, zahlt sich die Investition aus, um zu verstehen, wie das Front-End funktioniert.
reagieren Reagieren:
Reagieren bietet a Anfangen Anleitung, die beim Einrichten helfen sollte Reagieren Sie in etwa einer Stunde. Die Dokumentation ist gründlich und vollständig und enthält Lösungen für häufig auftretende Probleme, die bereits bei Stack Overflow auftreten. React ist kein vollständiges Framework und erweiterte Funktionen erfordern die Verwendung von Bibliotheken von Drittanbietern. Dies macht die Lernkurve des Kernframeworks nicht so steil, sondern hängt von dem Weg ab, den Sie mit zusätzlichen Funktionen einschlagen. Das Erlernen der Verwendung von React bedeutet jedoch nicht unbedingt, dass Sie verwenden die besten Praktiken.
vue Vue:
Vue Bietet eine höhere Anpassbarkeit und ist daher leichter zu erlernen als Angular oder React. Darüber hinaus hat Vue eine Überlappung mit Angular und React in Bezug auf ihre Funktionalität wie die Verwendung von Komponenten. Daher ist der Übergang von einem der beiden zu Vue eine einfache Option. Die Einfachheit und Flexibilität von Vue ist jedoch ein zweischneidiges Schwert – es ermöglicht schlechten Code, was das Debuggen und Testen erschwert.

Obwohl Angular, React und Vue eine signifikante Lernkurve aufweisen, sind ihre Verwendungsmöglichkeiten bei der Beherrschung unbegrenzt. Sie können beispielsweise Angular and React in WordPress und WooCommerce integrieren, um progressive Web-Apps zu erstellen.

Angular vs React vs Vue: Wer gewinnt??

Lassen Sie uns gegen Ende dieses Beitrags die charakteristischen Merkmale jedes Frameworks in Erinnerung rufen, um zu versuchen, die Frage zu beantworten: Angular vs React vs Vue: Welches sollten Sie wählen??

eckiges Logo Winkelig ist das ausgereifteste Framework, hat eine gute Unterstützung in Bezug auf Mitwirkende und ist ein Komplettpaket.

Die Lernkurve ist jedoch steil und Entwicklungskonzepte in Angular können neue Entwickler abschrecken.

Angular ist eine gute Wahl für Unternehmen mit großen Teams und Entwicklern, die bereits TypeScript verwenden.

Extra �� Hier sind einige Angular Admin-Dashboard-Vorlagen, die Sie interessieren könnten.

Logo reagieren Reagieren ist gerade alt genug, um reif zu sein und hat eine große Anzahl von Beiträgen aus der Community. Es hat breite Akzeptanz gefunden. Der Arbeitsmarkt für React ist wirklich gut und die Zukunft für dieses Framework sieht rosig aus.

React scheint eine gute Wahl für jemanden zu sein, der mit Front-End-JavaScript-Frameworks, Startups und Entwicklern anfängt, die etwas Flexibilität mögen. Die Möglichkeit, sich nahtlos in andere Frameworks zu integrieren, bietet einen großen Vorteil für diejenigen, die eine gewisse Flexibilität in ihrem Code wünschen.

vue logo Vue ist das Neueste in der Arena, ohne die Unterstützung eines großen Unternehmens.

In den letzten Jahren hat es sich jedoch sehr gut bewährt, sich als starker Konkurrent für Angular and React zu behaupten. Dies spielt möglicherweise eine Rolle, da viele chinesische Giganten wie Alibaba und Baidu Vue als primäres Front-End-JavaScript-Framework auswählen.

Es bleibt jedoch abzuwarten, wie es sich in Zukunft verhält, und man ist berechtigt, vorsichtig damit umzugehen. Vue sollte Ihre Wahl sein, wenn Sie Einfachheit bevorzugen, aber auch Flexibilität mögen.

Extra �� Hier sind einige mit Bootstrap erstellte Vue-Administratorvorlagen, an denen Sie interessiert sein könnten.

Die Antwort auf die Debatte zwischen Angular vs React vs Vue lautet, dass es keine absolut richtige Wahl gibt, die Sie wahrscheinlich erwartet haben.

Jede dieser Bibliotheken hat ihre eigenen Vor- und Nachteile. Basierend auf dem Projekt, an dem Sie arbeiten, und Ihren individuellen Anforderungen ist eine davon besser geeignet als die anderen. Es ist immer wichtig, dass Sie Ihre eigenen Nachforschungen anstellen, bevor Sie sich entscheiden, insbesondere wenn Sie an einem Geschäftsvorhaben und nicht an einem persönlichen Projekt arbeiten.

Welches Framework ist Ihrer Meinung nach der Gewinner hier – Angular vs React vs Vue? Lass es uns in den Kommentaren unten wissen.

Weiterführende Literatur: ��

  • Material Design Templates für Vue, Angular, React (Material UI)
  • Best React UI-Komponentenbibliotheken / Frameworks
  • Interessante Vue UI-Komponentenbibliotheken
  • Beste Angular Admin Dashboard-Vorlagen
  • Beste kostenlose Bootstrap-Vorlagen für ReactJS
  • Kostenlose native Vorlagen reagieren
  • Kostenlose und Premium VueJS Admin-Vorlagen mit Bootstrap

Wie wäre es mit WordPress? WordPress ist perfekt geeignet, um fast jedes erdenkliche Website-Projekt auszuführen, und es gibt einige großartige Themen, mit denen Sie Ihr Design großartig aussehen lassen können (viele davon kostenlos). Ganz zu schweigen davon, dass Sie eine WordPress-Website günstiger hosten können.

Vergessen Sie nicht, an unserem Crashkurs teilzunehmen, um Ihre WordPress-Site zu beschleunigen. Mit einigen einfachen Korrekturen können Sie Ihre Ladezeit sogar um 50-80% reduzieren:

Layout und Präsentation von Karol K..

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Это интересно
    Adblock
    detector