Qu'est-ce que réagir ? Que fait principalement React ? (Questions et réponses)

Cet article vous présente principalement la compréhension de base de react Oserez-vous dire que vous en savez beaucoup sur React ? Sinon, jetez un œil à cet article

. 1. Pourquoi Facebook construit-il React ?

Lorsque les ingénieurs de Facebook travaillent sur de grands projets , En raison de leur très grande base de code et de leur grande organisation, MVC est rapidement devenu très complexe. Chaque fois qu'une nouvelle fonction ou fonctionnalité devait être ajoutée, la complexité du système augmentait de façon exponentielle, rendant le code fragile et imprévisible. leur MVC s'effondre, Facebook estime donc que MVC n'est pas adapté aux applications à grande échelle. Lorsqu'il existe de nombreux modèles et vues correspondantes dans le système, sa complexité augmentera rapidement, ce qui le rendra très difficile à comprendre et à déboguer, en particulier. le flux de données bidirectionnel possible entre le modèle et la vue.

Sur la base des raisons ci-dessus, Facebook estime que MVC ne peut pas répondre à ses besoins d'expansion. Afin de résoudre les problèmes ci-dessus, ils doivent "organiser le code en. un moyen de le rendre plus utilisable." Prediction", ils ont donc proposé à Flux et React de l'implémenter.

2. Qu'est-ce que React ?

Réagir Il s'agit d'un projet interne à Facebook. Parce que l'entreprise n'était pas satisfaite de tous les frameworks JavaScript MVC du marché, elle a décidé d'écrire le sien pour créer le site Web Instagram. Après l'avoir réalisé, j'ai trouvé que cet ensemble de choses est très utile, il a donc été open source en mai 2013.

React est une bibliothèque JavaScript permettant de créer des interfaces utilisateur. React est principalement utilisé pour créer une interface utilisateur, pensent beaucoup de gens React est le V (vue) dans MVC. React a des performances élevées et une logique de code très simple. De plus en plus de gens ont commencé à y prêter attention et à l'utiliser.

3. Quel problème React résout-il ?

Nous avons construit React pour résoudre un problème : créer de grandes applications avec des données qui changent au fil du temps. Créez de grandes applications où les données changent au fil du temps

4. Fonctionnalités React >1.

Conception déclarative −React adopte un paradigme déclaratif, qui facilite la description des applications. 2.

Efficace −React minimise l'interaction avec DOM en simulant DOM.

3.Flexible −React fonctionne bien avec des bibliothèques ou des frameworks connus.

4.JSX − JSX est Une extension de la syntaxe JavaScript. React ne doit pas nécessairement être utilisé pour le développement JSX, mais nous vous recommandons de l'utiliser.

5.Composants − utilise React pour créer des composants, ce qui rend le code plus facile à réutiliser et peut être bien appliqué dans le développement de grands projets.

6.Flux de données de réponse unidirectionnelle − React implémente un flux de données de réponse unidirectionnel, réduisant ainsi le code répété, c'est pourquoi il est plus simple que la liaison de données traditionnelle.

5. Grands principes de React

Traditionnel In Dans les applications Web, les opérations DOM sont généralement mises à jour directement, mais nous savons que les mises à jour du DOM sont généralement relativement coûteuses. Afin de réduire autant que possible les opérations sur le DOM, React fournit un moyen différent et puissant de mettre à jour le DOM au lieu des opérations directes du DOM. Il s'agit de VirtualDOM, un DOM virtuel léger, qui est un objet abstrait par React, décrivant à quoi devrait ressembler le dom et comment il doit être présenté. Grâce à ce Virtuel DOM met à jour le vrai DOM, et ce Virtual DOM gère la mise à jour du vrai DOM. (Si vous souhaitez en savoir plus, rendez-vous sur le site Web PHP chinois React Reference Manual pour en savoir plus)

Pourquoi les opérations Virtual DOM peuvent-elles être plus rapides grâce à cette couche supplémentaire ? En effet, React a un algorithme de différence. La mise à jour de VirtualDOM ne garantit pas qu'elle affectera immédiatement le vrai DOM. React attendra la fin de la boucle d'événements, puis utilisera cet algorithme de différence pour calculer l'étape minimale en comparant la nouvelle représentation dom actuelle. avec le précédent. Mettez à jour le vrai DOM.

L'avantage le plus évident est ce que l'on appelle le dom diff de React, qui peut réaliser des mises à jour dom de niveau delta. Lorsque des modifications de données entraînent des modifications du DOM, React ne s'actualise pas globalement, mais calcule les différences via son algorithme dom diff interne, puis les met à jour avec la plus petite granularité. C'est aussi la raison pour laquelle React aurait de bonnes performances.

6. Composants Composants

sur l'arborescence DOM Les nœuds sont appelés éléments, ce qui est différent ici. Ils sont appelés composants sur Virtual DOM. Le nœud de Virtual DOM est un composant abstrait complet, composé de composants. composant est utilisé dans C'est extrêmement important dans React car l'existence de composants rend le calcul des différences DOM plus efficace.

7. Candidature

Il existe de nombreuses applications étrangères, comme Facebook, Yahoo, Reddit, etc. Vous pouvez voir une liste de Sites-Using-React sur github : https://github.com/facebook/react/wiki/Sites-Using-React Si vous êtes en Chine, je l'ai vérifié et il semble qu'il y en ait relativement. Quelques-uns actuellement, j'en connais un à Hangzhou. Recherche de voiture. La plupart des technologies mettent généralement du temps à être appliquées au niveau national.

8. Analyse comparative

et quelques autres js. Par rapport aux frameworks, tels que Backbone, Angular, etc., comment React se compare-t-il

1. composants faciles à appeler à plusieurs reprises. Concentrez-vous sur l'interface utilisateur, c'est-à-dire la couche de vue

2. données à afficher, liaison de données non bidirectionnelle

3 N'utilisez pas directement l'objet DOM, mais utilisez le DOM virtuel pour l'appliquer au réel. DOM dans les plus petites étapes grâce à l'algorithme diff.

4. Il n'est pas pratique de faire fonctionner directement le DOM La plupart du temps, vous programmez simplement le DOM virtuel

<.> 9. Relation avec React Native

Parce que l'idée de conception de React est extrêmement unique, c'est une révolution. l'innovation et ses performances sont exceptionnelles. La logique du code est très simple. Par conséquent, de plus en plus de gens commencent à y prêter attention et à l’utiliser, pensant que cela pourrait être l’avenir du Web. Outils grand public pour le développement.

Le projet lui-même est devenu de plus en plus grand, du premier moteur d'interface utilisateur à un ensemble complet de solutions d'applications Web frontales et back-end. Le projet dérivé React Native a des objectifs encore plus ambitieux et espère l'utiliser pour écrire des applications Web. façon d’écrire une application native. Si cela peut être réalisé, l'ensemble de l'industrie Internet sera bouleversé, car le même groupe de personnes n'a besoin d'écrire l'interface utilisateur qu'une seule fois et celle-ci peut fonctionner simultanément sur le serveur, le navigateur et le téléphone mobile.

Cet article se termine ici (si vous voulez en voir plus, rendez-vous sur le site PHP chinois Manuel d'utilisation de ReactEtude dans la rubrique), si vous avez des questions, vous pouvez laisser un message ci-dessous.

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!