Amplify le support pour Next.js

Amplify prend en charge le déploiement et l'hébergement des applications Web rendues côté serveur (SSR) créées à l'aide de Next.js. Next.js est un framework React pour développer SPAs avec JavaScript. Vous pouvez déployer des applications créées avec Next.js 14 avec des fonctionnalités telles que l'optimisation des images et le middleware.

Les développeurs peuvent utiliser Next.js pour combiner la génération de sites statiques (SSG) SSR dans un seul projet. SSGles pages sont prérendues au moment de la création et les SSR pages sont prérendues au moment de la demande.

Le prérendu peut améliorer les performances et l'optimisation des moteurs de recherche. Comme Next.js préaffiche toutes les pages du serveur, le HTML contenu de chaque page est prêt lorsqu'il atteint le navigateur du client. Ce contenu peut également être chargé plus rapidement. Des temps de chargement plus rapides améliorent l'expérience de l'utilisateur final avec un site Web et ont un impact positif sur le SEO classement du site. Le prérendu s'améliore également SEO en permettant aux robots des moteurs de recherche de trouver et d'explorer facilement le contenu d'un site Web. HTML

Next.js fournit un support analytique intégré pour mesurer divers indicateurs de performance, tels que Time to first byte (TTFB) et First contentful paint (FCP). Pour plus d'informations sur Next.js, consultez Getting started on the Next.js website.

Support des fonctionnalités de Next.js

Amplify Hosting Compute gère entièrement le rendu côté serveur (SSR) pour les applications créées avec Next.js 12, 13 et 14. Si vous avez déployé une application Next.js sur Amplify avant la sortie d'Amplify Hosting Compute, votre application utilise l'ancien SSR fournisseur d'Amplify, Classic (Next.js 11 uniquement). Amplify Hosting Compute ne prend pas en charge les applications créées à l'aide de Next.js version 11 ou antérieure. Nous vous recommandons vivement de migrer vos applications Next.js 11 vers le fournisseur de gestion SSR informatique Amplify Hosting.

La liste suivante décrit les fonctionnalités spécifiques prises en charge par le SSR fournisseur de calcul Amplify Hosting.

Fonctionnalités prises en charge

• Pages rendues côté serveur () SSR

• Pages statiques

• APIitinéraires

• Routes dynamiques

• Suivez tous les itinéraires

• SSG(Génération statique)

• Régénération statique incrémentielle () ISR

• Routage de sous-chemins internationalisé (i18n)

• Routage de domaine internationalisé (i18n)

• Détection automatique des paramètres régionaux internationalisée (i18n)

• Intergiciel

• Variables d’environnement

• Optimisation de l'image

• Répertoire de l'application Next.js 13

Fonctions non prises en charge

• APIRoutes Edge (le middleware Edge n'est pas pris en charge)

• Régénération statique incrémentielle à la demande () ISR

• Diffusion de Next.js

• Exécution d'un intergiciel sur des actifs statiques et des images optimisées

Images du fichier Next.js

La taille de sortie maximale d'une image ne doit pas dépasser 4,3 Mo. Vous pouvez stocker un fichier image plus volumineux quelque part et utiliser le composant Image Next.js pour le redimensionner et l'optimiser dans un format Webp ou un AVIF format, puis l'utiliser dans une taille plus petite.

Notez que la documentation Next.js vous conseille d'installer le module de traitement d'image Sharp pour permettre à l'optimisation des images de fonctionner correctement en production. Toutefois, cela n'est pas nécessaire pour les déploiements d'Amplify. Amplify déploie automatiquement Sharp pour vous.