Qu’est-ce que AMP HTML et comment s’intègre-t-il avec framework / tool X?

OK, nous avons tous probablement entendu parler de AMP HTML de Google maintenant.

Je suis curieux de savoir comment cela va s’intégrer à nos stream de travail existants. Si vous écrivez une application React ou Angular, comment HTML AMP s’intègre-t-il dans le processus de développement? Chacun de ces frameworks a déjà un moyen de définir des composants et il semble que AMP ne fait qu’append à la stack.

La plupart d’entre nous utilisent déjà d’autres outils comme browserify ou webpack. Je ne vois pas facilement comment l’AMP s’intègre au rest. Certains de ces outils nous permettent déjà de servir notre site de manière optimisée. AMP HTML va-t-il changer tout cela?

AMP HTML revient essentiellement aux bases et propose le HTML le plus rapide possible. Cela me rappelle le WAP et le Nokia 7110 .

C’est un ensemble de règles ssortingctes pour créer une page Web, ouverte à la croissance et ouverte aux extensions d’autres sociétés et développeurs.

Comment cela fonctionne-t-il avec SPA (Single Page Apps) et autres frameworks lourds javascript front-end est inconnu à ce stade, c’est à dire pour ces développeurs à comprendre.

À la base, ses pages HTML statiques avec des éléments personnalisés conçus pour se charger aussi rapidement que possible sur des connexions lentes et de petites vues. N’importe qui peut déjà optimiser son site pour le mobile et le réduire à quelques Ko seulement s’ils le souhaitaient vraiment, AMP-HTML ou non.

Le principal avantage est

  1. Google le supportera, selon Android, Chrome et Google Search, Google CDN.
  2. Les pages se chargent très rapidement et peuvent paraître jolies.

L’adoption initiale, telle que WordPress et d’autres éditeurs, peut constituer un ensemble distinct de pages AMP compatibles avec les mobiles. Cela vient de Google, qui voulait que vous rendiez toutes vos pages Web normales conviviales pour le mobile ou faire face à des résultats SEO.

Si vous y réfléchissez à long terme, c’est une spécification pour le Web mobile qui met l’accent sur la performance. Si elle est adoptée, dans 5 ans, toute page Web peut se charger en quelques secondes sur une connexion mobile, quelle que soit la qualité de cette connexion. Si nous ne pouvons pas attendre que les entresockets de technologie et de télécommunications augmentent leur vitesse, nous pouvons au moins diminuer la taille de nos pages.

AMP est conçu pour les pages statiques. Les développeurs doivent créer deux pages différentes: la version normale et la version AMP. La page AMP aura un lien vers la page normale et inversement. Chaque fois qu’une requête arrive à la page normale du mobile, elle charge la page AMP et vice versa. Google dispose de son propre cache AMP pour le charger plus rapidement. Tout en développant des pages AMP, il suffit de considérer les règles AMP.

Les choses sont plus claires maintenant via cette URL

Parmi les optimisations les plus importantes, citons le fait que tout ce qui provient de ressources externes est asynchrone. Par conséquent, rien dans la page ne peut bloquer le rendu.

Donc plus de CSS de blocage de rendu.

Parmi les autres techniques de performance, citons le sandboxing de tous les iframes, le calcul préalable de la présentation de chaque élément sur la page avant le chargement des ressources et la désactivation des sélecteurs CSS lents.

J’espère que ce nouveau lien vous aidera.