Quand utiliser un framework de réaction tel que Next ou Gatsby vs Create React App

Question

Je suis dans la phase de prototypage rapide de mon expérience d’apprentissage React / javascript. Je me demandais quand les gens se tourneraient vers un framework tel que Next.js ou Gatsby.js vs le standard Create React App.

Je creuse vraiment la structuration et la perspective basées sur les pages pour les liens de préchargement de Next.js. Cependant, je ne sais pas quand vous atteindrez Next comme étant rattaché à l'ARC ou même renvoyé à l'ARC.

Merci!

Answer 1

Je suis dans le même bateau. J'ai commencé avec l'ARC pour créer un SPA qui était super pour commencer et obtenir plus de la courbe d'apprentissage. Mais j'ai vite réalisé que deux questions importantes :

1. Le partage sur les réseaux sociaux : j'ai été incapable de changer l'OGP étiquettes par route. La conséquence, c'est, seulement votre gamme de base (installation correctement avec OGP tags) que lorsqu'il est partagé sur un réseau social peut produire la carte (twitter terme), tout autre itinéraire que vous partagez montrent fondamentalement vide. Cela est vrai pour Facebook et LinkedIn ainsi. Voir ici.
2. Optimisation des Moteurs de recherche : Si il y a eu quelques articles sur les moteurs de recherche capable d'analyser votre SPA correctement pour l'indexation, dans mon expérience, il n'a pas été satisfaisante. Pour, par exemple, dans Google, j'ai remarqué que seule la page d'accueil est indexé et il n'est pas analysé correctement. Des titres distincts à partir d'éléments séparés sont concaténées. Bing, ne semble pas avoir été indexé. Peut-être Google indexé parce que j'ai indexé la page d'accueil à l'aide de Google Recherche de la Console. Ce n'est pas une solution envisageable si je dois ré-indexer manuellement pour chaque nouvelle page ou après une mise à jour d'une page.

Créer-Réagir-App : vraiment Un très bon programme d'amorçage outil pour commencer à créer un SPA.

Gatsby/Réagir-Statique : Semblable à Créer-Réagir-App, mais produit des HTML la sortie de la construction au lieu donc de "pré-rendu". Je suis encore à expérimenter avec cela. J'ai bon espoir que cela permettrait de résoudre (1) et (2) puisque je peux maintenant avoir différentes OGP balises déjà dans le code HTML sont servies à partir d'un site statique serveur (S3/Azure Blob/Github Pages) au lieu de leur être modifié localement après l'extraction. Je ne suis pas sûr si cela fonctionne encore. L'avantage ici est que, depuis Gatsby déjà un pré-rendu pendant la construction, l'utilisateur est confronté à de meilleures performances. (Peut être que quelqu'un expérimenté avec Gatsby peuvent clarifier, ou je vais modifier cette réponse après je suis fait.) Mise à jour (2/19/2018) : je peux confirmer que (1) est résolu par Gatsby.js bien que toujours accueilli comme un site web statique.

Next.js : Si Gatsby ne résout pas le problème (1) et (2), Next.js sera ma chute en arrière pour créer une véritable RSS appli. Le problème est ici, maintenant, je vais avoir à utiliser PaaS pour héberger le site (par exemple, Azure Web Apps ou AWS ElasticBeanStalk ou Heroku) au lieu d'un site statique service d'hébergement (Azure Blob, AWS S3, Github Pages). Ce sera un peu plus coûteux et peu plus de travail pour le programme d'installation CI/CD pipelines.

Voir aussi ces alternatives figurant sur l'ARC docs.

Answer 2

Récemment, j'ai fait beaucoup de recherches moi-même sur ce sujet en particulier créer-réagir-app vs Gatsby.js et j'ai trouvé que les Deux outils vous permettent d'écrire réagir code immédiatement, sans trop se préoccuper de la configuration. Cependant, Gatsby, par exemple, offre en plus de cela, le rendu côté serveur au moment de la construction qui est crucial pour le RÉFÉRENCEMENT. Vous n'avez pas besoin de serveur pour le rendu de votre point de vue qui est le cas pour Next.js parce qu'ils sont déjà fait au moment de la construction. quand un utilisateur visite votre site web, la version HTML sera chargé en premier, et une fois que le javascript est chargé de votre site sera entièrement fonctionnelle réagir web app.

La bonne chose est qu'ils partagent tous le même point de vue de la couche de sorte que vous pouvez passer d'un outil à l'autre. vous pouvez vérifier le déplacement de créer-réagir-application à Gatsby.js qui va dans les détails.

Answer 3

Je fais cette recherche moi-même. D'après ce que je comprends, Next.js fournit un rendu prêt à l'emploi côté serveur. Create React App ne fait pas cela, vous devez donc fournir votre propre solution de SSR (pour des opérations telles que des chargements de page plus rapides et le référencement).