Comment comparer et analyser les trois principaux frameworks front-end Web

La comparaison est la suivante : 1. Vue, les API fournies sont relativement simples et intuitives, utilisant des modèles DOM ; 2. Angulaire, s'appuyant sur une vérification sale des données, plus il y a d'observateurs, plus lent 3. React, en utilisant un JSX spécial ; syntaxe, l'utilisation de Virtual DOM effectuera des vérifications sales sur les résultats rendus.

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

Modèle de framework MVX : MVC+MVP+MVVM

1.MVC : Modèle+Vue+contrôleur, principalement basé sur l'objectif de superposition, pour séparer les responsabilités de chacun.

View communique avec Model via Controller. Controller est le coordinateur de View et Model View et Model ne sont pas directement connectés et la communication de base est unidirectionnelle.

L'utilisateur exploite le modèle modèle via le contrôleur pour apporter des modifications à la vue.

2. MVP : il a évolué à partir du modèle MVC. Il utilise un contrôleur/présentateur pour gérer la logique + un modèle pour fournir des données + une vue à afficher.

Dans MVP, Presenter sépare complètement la vue et le modèle, et la logique principale du programme est implémentée dans Presenter.

De plus, le présentateur et la vue ne sont pas directement liés. Ils interagissent via une interface définie, de sorte que le présentateur peut rester inchangé lorsque la vue est modifiée.

Cadre du modèle MVP : Riot, js.

3.MVVM : MVVM modifie le contrôleur dans MVC et le présentateur dans MVP en ViewModel. Modèle+Vue+ViewModel.

Les modifications dans la vue seront automatiquement mises à jour dans le modèle, et les modifications dans le modèle seront également automatiquement synchronisées avec la vue pour l'affichage.

Cette synchronisation automatique est due au fait que les propriétés de ViewModel implémentent Observer et que les opérations correspondantes peuvent être déclenchées lorsque les propriétés changent.

Qu'est-ce que Vue.js ?

En voyant l'introduction du modèle de framework ci-dessus, nous pouvons savoir qu'il s'agit d'un framework appartenant au modèle MVVM. Alors quelles sont ses caractéristiques ?

En fait, Vue.js n'est pas un framework, car il se concentre uniquement sur la couche de vue et est une bibliothèque pour créer des interfaces Web basées sur les données.

Vue.js fournit une liaison de données efficace et un système de composants flexible via une simple API (Application Programming Interface).

Les fonctionnalités de Vue.js sont les suivantes :

1. Framework léger

2. Liaison de données bidirectionnelle

3. Commandes

4. d'autres cadres ?

1. Différences

Similarités avec AngularJS :

Les deux instructions de support : instructions intégrées et instructions personnalisées.

Les deux prennent en charge les filtres : filtres intégrés et filtres personnalisés.

Les deux prennent en charge la liaison de données bidirectionnelle.

Ne prend pas en charge les navigateurs bas de gamme.

Différences :

1. AngularJS a un coût d'apprentissage élevé, comme l'ajout de la fonctionnalité d'injection de dépendances, alors que les API fournies par Vue.js lui-même sont relativement simples et intuitives.

2. En termes de performances, AngularJS s'appuie sur une vérification sale des données, donc plus il y a d'observateurs, plus cela devient lent.

Vue.js utilise l'observation basée sur le suivi des dépendances et utilise des mises à jour de file d'attente asynchrones. Toutes les données sont déclenchées indépendamment.

Pour les applications volumineuses, cette différence d'optimisation est assez évidente.

2. Différences avec React

Similarités :

React utilise une syntaxe JSX spéciale, Vue.js recommande également d'écrire un format de fichier spécial .vue dans le développement de composants et a certaines conventions sur le contenu des fichiers, qui sont toutes deux obligatoires à utiliser après la compilation. .

L'idée centrale est la même : tout est un composant, et les instances de composants peuvent être imbriquées.

Tous fournissent des fonctions de hook raisonnables, permettant aux développeurs de personnaliser leurs besoins.

Il n'y a pas de fonctions AJAX, Route et autres intégrées dans le package principal, mais sont chargées sous forme de plug-ins.

Prend en charge les fonctionnalités des mixins dans le développement de composants.

Différence :

React s'appuie sur Virtual DOM, tandis que Vue.js utilise des modèles DOM. Le DOM virtuel utilisé par React effectuera des vérifications approfondies sur les résultats rendus.

Vue.js fournit des instructions, des filtres, etc. dans le modèle, qui peuvent faire fonctionner le DOM très facilement et rapidement.

【Apprentissage recommandé :

Tutoriel avancé javascript

】

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!