web-dev-qa-db-fra.com

Qu'est-ce que AMP HTML et comment s'intègre-t-il au framework / outil X?

OK, nous avons donc probablement déjà entendu parler de AMP HTML de Google.

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

La plupart d'entre nous utilisent également d'autres outils comme browserify ou webpack. Je ne vois pas facilement comment AMP s'intègre avec le reste. Certains de ces outils nous permettent déjà de servir notre site de manière optimisée. Dans quelle mesure AMP HTML va-t-il changer tout cela?

56
user633183

AMP HTML revient à l'essentiel et propose le HTML le plus rapide possible. Je me souviens de WAP et du Nokia 7110.

Il s'agit d'un ensemble de règles strictes pour la création d'une page Web, ouverte à la croissance et ouverte aux extensions d'autres sociétés et développeurs.

Comment cela fonctionne avec SPA (Single Page Apps) et d'autres cadres lourds frontaux javascript est inconnu à ce stade, c'est à ces développeurs de comprendre.

Au cœur de ses pages HTML statiques avec des éléments personnalisés conçus pour charger aussi vite que possible sur les connexions lentes et les petites vues. N'importe qui peut déjà optimiser son site pour mobile et le réduire à quelques Ko s'il le souhaite vraiment, AMP-HTML ou non.

Le principal avantage est

  1. Google le supportera, pensez Android, Chrome et Google Search, Google CDN.
  2. Les pages se chargeront très rapidement et peuvent sembler assez belles.

L'adoption initiale comme par Wordpress et d'autres éditeurs peut être un ensemble distinct de pages AMP adaptées aux mobiles. Cela vient de Google qui voulait que vous rendiez toutes vos pages Web normales adaptées aux mobiles ou que vous rencontriez des succès SEO.

Si vous y pensez à long terme, c'est une spécification pour le Web mobile qui se concentre sur les performances. Si elle est adoptée, dans 5 ans, n'importe quelle 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 entreprises de technologie et de télécommunications augmentent la vitesse, nous pouvons au moins réduire la taille de nos pages.

25
kzap

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 vice versa. Chaque fois qu'une demande arrive sur une page normale depuis un mobile, elle charge la page AMP et vice versa. Google a son propre cache AMP pour le charger plus rapidement. Lors du développement de pages AMP, nous devons simplement tenir compte des règles AMP.

16
suraj naikwade

Les choses sont plus claires maintenant via ce URL

L'une des plus grandes optimisations est le fait qu'il rend tout ce qui provient des ressources externes asynchrone, donc rien dans la page ne peut empêcher quoi que ce soit du rendu.

Donc plus de CSS bloquant le rendu.

D'autres techniques de performance incluent le sandboxing de tous les iframes, le pré-calcul de la disposition 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.

1
prosti