Der Kampf der Frontend-Frameworks: Wer konkurriert außer Vue, Angular und React noch mit ihnen?

In den letzten Jahren ist im Bereich der Front-End-Entwicklung eine große Anzahl von Frameworks entstanden, die die Menschen bei der Auswahl verwirrt und verwirrt haben. Heute vergleichen wir für Sie die fünf beliebtesten Front-End-JavaScript-Frameworks und geben einen Überblick. Dabei stellen wir ihre Hauptfunktionen, Tools, Lernkurven und andere Faktoren vor, die Ihnen bei der Entscheidungsfindung und Auswahl helfen sollen.

Beliebtheitsmessung

Bestimmen Sie die Framework-Popularität anhand der Framework-Nutzung gemäß der State of JavaScript Survey 2020. Die Umfrage wurde von 23.765 Befragten ausgefüllt und die Ergebnisse sind wie folgt:

React：80％
Angular：56％
Vue.js：49％
Svelte：15％
PreACT：13％

Berücksichtigt wird auch „Framework Awareness“ aus derselben Umfrage:

React：100％
Angular：100％
Vue.js：99％
Ember：88％
Svelte：86％

Definition von Front-End-Frameworks

Für die Zwecke dieses Artikels wird das Der Text verwendet die von Fowler bereitgestellte Martin-Definition:

Eine Bibliothek besteht im Wesentlichen aus einer Reihe von Funktionen, die Entwickler aufrufen können und die normalerweise in Klassen organisiert sind. Der Aufruf führt einen Teil der Arbeit aus und gibt die Kontrolle an den Client zurück.

Das Framework verkörpert abstraktes Design und verfügt über mehr integrierte Verhaltensweisen. Entwickler können Verhaltensweisen an verschiedenen Stellen im Framework einfügen, indem sie Unterklassen bilden oder ihre eigenen Klassen einfügen, und das Framework ruft den Code an diesen Stellen auf. Rahmen reagieren. Es wird in Unternehmensprodukten wie Facebook, Netflix und Airbnb verwendet und verfügt über eine große Anzahl von Entwicklern und umfangreiche Lernressourcen zur Nutzung.

Es gibt viele React-bezogene Tools. Die vom Team bereitgestellte CLI wird zum einfachen Erstellen eines neuen Projekts verwendet, und die Tool-Erweiterung ist für Chrome und Firefox geeignet. Es enthält viele Pakete von Drittanbietern für eine Vielzahl von Aufgaben (z. B. Routing, Umgang mit Formularen und Animationen) sowie mehrere React-basierte Frameworks wie Next.js und Gatsby. React folgt dem Konzept „Einmal lernen, überall schreiben“. Es kann mobile Apps mit React Native betreiben, mit Node auf dem Server rendern und bietet hervorragende SEO-Unterstützung.

Die gängige Meinung ist, dass React zu einfach ist: Es bezieht sich nur auf die Ansichtsebene der Anwendung, und alles wird den Entwicklern überlassen, und es gibt gemischte Meinungen über den übermäßigen Freiheitsgrad.

Wenn Sie lernen, ist die Lernkurve moderat. React ermutigt Entwickler, verschiedene funktionale Programmierparadigmen (z. B. Unveränderlichkeit und reine Funktionen) zu verwenden, und erfordert, dass Entwickler vor dem Erstellen über ein grundlegendes Verständnis grundlegender Konzepte verfügen. Wenn Sie mit der Reaktionsfreiheit zufrieden sind, ist dies ideal für datengesteuert Anwendungen jeder Größe.

2. Angular 1) in 10 Jahren, und es war sofort ein Erfolg, vor allem weil es den Entwicklern gelang, das erste Framework für das zu erstellen, was heute als Single-Page-Anwendungen bekannt ist. Um Leistungsprobleme und die Herausforderungen beim Erstellen großer JavaScript-Anwendungen zu lösen, hat Google AngularJS neu geschrieben und 2016 Angular 2 veröffentlicht (heute nur Angular). Da sie nicht einfach migriert werden können, werden AngularJS und Angular zu zwei unabhängigen Frameworks. Angular nimmt eine wichtige Position im Front-End-Framework ein. Es wurde nach strengen Tests von Unternehmen wie Google und Microsoft in den Produktionseinsatz übernommen, und es gibt auch zahlreiche zugehörige Online-Ressourcen.

Im Gegensatz zu React, das sich nur mit der Ansichtsebene befasst, bietet Angular eine Komplettlösung für die Erstellung von Single-Page-Client-Anwendungen. Angular-Komponenten implementieren eine bidirektionale Datenbindung, um Ereignisse abzuhören und Werte gleichzeitig zwischen übergeordneten und untergeordneten Komponenten zu aktualisieren. Vorlagen sind Teile von HTML, die die Verwendung einer speziellen Syntax ermöglichen, um die zahlreichen Funktionen von Angular zu nutzen. TypeScript ist die Hauptsprache, die für die Angular-Entwicklung verwendet wird, daher ist das Framework für Unternehmen und Anwendungen geeignet.

Aus der Perspektive verwandter Tools bietet Angular eine äußerst vollständige CLI zum Initialisieren, Entwickeln, Erstellen und Warten seiner Anwendungen sowie Chrome- und Firefox-Dev-Tools-Erweiterungen zum Debuggen von Angular-Anwendungen.

Aber aus Lernperspektive hat Angulard die steilste Lernkurve. Entwickler müssen mit TypeScript vertraut sein, um arbeiten zu können. Es ist nicht die beste Wahl für Anfänger und eignet sich eher für die Rolle in einem Team.

3. Vue.js

Empfohlen: „Die neuesten 5 vue.js-Video-Tutorial-Auswahlen“

Hinweis: Statistiken gelten für Vue v2, Version 3 ist verfügbar und muss installiert werden vue@next.

Vue ist ein Model-View-ViewModel (MVVM)-Frontend-Framework zum Erstellen von Benutzeroberflächen und Single-Page-Anwendungen. Geschrieben von Evan You und erstmals 2014 veröffentlicht.

Vue wird mittlerweile in der Produktion von Unternehmen wie Alibaba, Gitlab und Adobe eingesetzt. Es handelt sich wohl um die beste Dokumentation aller Frameworks, und das Forum ist eine hervorragende Quelle, um Hilfe bei Codierungsfragen zu erhalten. Vue ist in der PHP-Welt beliebt und Teil des Laravel-Frameworks.

Das Hauptverkaufsargument von Vue ist, dass es von Grund auf neu entwickelt wurde und schrittweise übernommen werden kann. Das heißt, Vue kann reguläre Webseitenfunktionen verbessern oder Komponenten erstellen, um Einzelseitenanwendungen zu verbessern an das auf HTML basierende Basisdatenmodell an und stellen einzelne Dateikomponenten bereit.

In Bezug auf die Vollständigkeit der zugehörigen Tools kann einerseits die offizielle CLI Gerüste erstellen und Vue-Anwendungen entwickeln, und darüber hinaus kann die Devtools-Erweiterung für Chrome und Firefox verwendet werden, um das Debuggen zu unterstützen. Im Gegensatz zu React bietet Vue offizielle Pakete für Routing und Statusverwaltung, die eine praktische und standardisierte Verarbeitungsmethode bieten, sowie verschiedene Tools von Drittanbietern und Vue-basierte Frameworks.

Aber die Einstiegshürde ist im Vergleich zu anderen Frameworks sehr niedrig, sodass es auch für weniger erfahrene Entwickler geeignet ist.

4. Svelte

wurde 2016 von Rich Harris veröffentlicht. Als neues Mitglied des Front-End-Frameworks verwendet es einen anderen Ansatz als andere Frameworks zum Erstellen von Webanwendungen.

Es verzichtet auf das Konzept eines virtuellen DOM und kompiliert den Code während des Builds in ein kleines rohes JavaScript-Modul, das das DOM aktualisiert, wenn sich der Anwendungsstatus des Entwicklers ändert. Erzielen Sie eine geringe Größe und eine schnelle Anwendung.

Rich Harris hat eine niedrige Lernkurve und eine kleine Community, aber es wurde in der Produktion von Unternehmen wie IBM und der New York Times eingesetzt und hat großes Potenzial für die Zukunft.

Aufgrund der geringen Reife wird es nur als kleines Projekt bevorzugt, aber die Situation ändert sich allmählich. SvelteKit befindet sich in der öffentlichen Betaphase und die Community wächst ständig. Obwohl Svelte derzeit noch jung ist, sollten Entwickler aufpassen.

5. Ember.js

Das zuletzt eingeführte Ember gibt es seit der Einführung des Front-End-Frameworks. Ursprünglich im Jahr 2011 veröffentlicht, aber immer noch beliebt in der Entwicklungswelt:

Es stammt aus der Zeit vor React, Vue, Svelte und all den anderen. Das Framework stand nie im Vordergrund des Front-End-Hypes, macht aber weiterhin stetige Fortschritte. Zu den Partnern gehören Qonto und CLARK, zwei der 50 größten Fintech-Unternehmen in Europa im Jahr 2020.

Ember verfolgt bei der App-Entwicklung einen batterieintegrierteren Ansatz, ähnlich wie Angular, und bietet alles, was Sie zum Erstellen moderner Front-End-JavaScript-Anwendungen benötigen. Es wird ein sechswöchiger Veröffentlichungszyklus eingehalten und die Stabilität ist ausgezeichnet.

In Bezug auf verwandte Tools gibt es viele verwandte Tools, von Ember CLI bis Ember Inspector, und es sind viele Bibliotheken von Drittanbietern verfügbar.

Die Community ist nicht größer als die anderer beliebter Framework-Communities, aber ihre Mitglieder sind sehr engagiert, und mit einem Forum und einem Discord-Server ist es einfach, Hilfe bei Codierungsproblemen zu erhalten.

Wenn Entwickler lernen möchten, ist die Lernkurve mäßig bis steil und für Anfänger oder kleinere Projekte ist Ember möglicherweise nicht die beste Wahl. Es besteht aus vielen beweglichen Teilen und bietet nicht viel Flexibilität bei der Organisation von Dingen als Teil einer Teamarbeit.

Fazit

Dieser Artikel vergleicht die fünf derzeit beliebtesten Front-End-Frameworks auf dem Markt und bietet Entwicklern eine bessere Referenz zur Auswahl basierend auf ihren persönlichen Fähigkeiten und Projektanforderungen.