Quand utiliser un framework react comme Next ou Gatsby vs Create React App

je suis dans le même bateau. J'ai commencé avec CRA pour créer un SPA qui était génial pour commencer et dépasser la courbe d'apprentissage. Mais je me suis vite rendu compte de deux questions importantes:

1. partage sur les réseaux sociaux: je n'ai pas pu changer les balises OGP par trajet. L'effet de cela est, seulement votre route de base (setup correctement avec les étiquettes OGP) lorsque partagé sur un réseau social peut produire la carte (terme twitter), tout autre route que vous partagez montrera essentiellement comme blanc. Cela est également vrai pour Facebook et LinkedIn. Voir ici .
2. optimisation des moteurs de recherche : bien qu'il y ait eu peu d'articles sur les moteurs de recherche capables de parcourir votre SPA correctement pour l'indexation, dans mon expérience, il n'a pas été satisfaisant. Par exemple, dans Google, j'ai remarqué que seule la page d'accueil est indexée et qu'elle n'est pas analysée correctement. Les titres distincts des éléments distincts sont concaténés ensemble. Bing, ne semble pas l'avoir indexé. Peut-être Google l'a indexé parce que j'ai indexé la page d'accueil en utilisant la Console de recherche de Google. 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.

Create-React-App : un très bon outil de bootstrapper pour commencer à créer un SPA.

Gatsby / React-Static: similaire à Create-React-App mais produit une sortie de construction HTML à la place de "pre-rendering". Je suis encore à expérimenter avec cela. Je suis j'espère que cela résoudra (1) et (2) puisque je peux maintenant avoir différentes balises OGP déjà dans le HTML étant servies à partir d'un serveur de site statique (Pages Blobs S3/Azure/Github) au lieu d'être changées localement après le fetch. Je ne suis pas sûr si cela fonctionne encore. L'avantage supplémentaire est que, puisque Gatsby pré-rend déjà pendant le temps de construction, l'utilisateur fait l'expérience d'une meilleure performance. (Peut-être quelqu'un d'expérimenté avec Gatsby peut clarifier, ou je modifierai cette réponse après que je suis fait.) Mettre (2/19/2018) : je peux confirmer que (1) est résolu par Gatsby.js alors qu'il est toujours hébergé comme un site Web statique.

suivant.js: si Gatsby ne résout pas (1) et (2), suivant.js sera mon retour pour créer une application SSR entièrement soufflée. Le problème ici est, maintenant je vais devoir utiliser PaaS pour héberger le site (par exemple Azure Web Apps ou AWS ElasticBeanStalk ou Heroku) au lieu d'un service d'hébergement de site statique (Azure Blob, AWS S3, GitHub Pages). Ce sera légèrement plus coûteux et un peu plus de travail à configurer Pipelines CI / CD.

Voir aussi ces solutions de rechange énumérées dans les documents de l'Arc.

j'ai récemment fait beaucoup de recherche moi-même sur ce sujet en particulier create-react-app vs Gatsby.js et moi avons découvert que les deux outils vous permettent d'écrire du code react tout de suite sans trop vous inquiéter de la configuration, cependant, Gatsby, par exemple, offre en plus de ce rendu côté serveur au moment de la compilation, ce qui est crucial pour SEO. Vous n'avez pas besoin de serveur pour afficher vos vues, ce 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 le HTML la version sera chargée en premier et une fois le javascript chargé, votre site web deviendra une application web react entièrement fonctionnelle.

la bonne chose est qu'ils partagent tous la même couche de vue de sorte que vous pouvez passer d'un outil à l'autre. vous pouvez cocher en passant de create-react-app à Gatsby.js qui va dans les détails.

je fais cette recherche moi-même. Ma compréhension est que la Prochaine.js fournit le rendu côté serveur de la boîte. Create React App ne fait pas cela, vous devez donc fournir votre propre solution pour SSR (pour des choses comme des charges de page plus rapides et SEO).