AMP HTMLとは何ですか？また、フレームワーク/ツールXにはどのように適合しますか？
OK、だから私たちはおそらく今までにGoogleから AMP HTML について聞いたことがあるでしょう。
私が興味を持っているのは、これが既存のワークフローにどのように適合するかということです。 ReactまたはAngularアプリを作成している場合、AMP HTMLは開発プロセスにどのように適合しますか？これらのフレームワークにはそれぞれ、コンポーネントを定義する方法がありますAMPがスタックに追加されているようです。
私たちのほとんどは、すでにbrowserifyやwebpackなどの他のツールも使用しています。私は、AMPが残りの部分にどのように適合するかを簡単には見ていません。これらのツールの一部により、すでに最適化された方法でサイトを提供することができます。 AMP HTMLはこれらすべてをどの程度変更しますか？
AMP HTMLは基本的に基本に戻り、可能な限り高速なHTMLを提供しています。 WAPおよびNokia 7110。
これは、Webページを作成するための厳格なルールのセットであり、他の企業や開発者による拡張に対して開かれ、開かれています。
これがSPA（シングルページアプリ）やその他のJavaScriptフロントエンドの重いフレームワークでどのように機能するかは、現時点では不明です。
低速の接続と小さなビューで可能な限り高速にロードするように設計されたカスタム要素を備えた静的なHTMLページの中核です。 AMP-HTMLを使用するかどうかに関係なく、誰でもサイトをモバイル向けに既に最適化し、数KBに削減することができます。
主な利点は
- GoogleはAndroidをサポートします、ChromeとGoogle検索、Google CDN。
- ページは非常に高速にロードされ、かなり静かに見えることがあります。
Wordpress や他の出版社による最初の採用は、モバイルフレンドリーなAMPページの別個のセットである可能性があります。これは、通常のWebページをすべてモバイルフレンドリーにするか、SEOヒットに直面させたいGoogleからのものです。
長期的に考えると、パフォーマンスに焦点を当てたモバイルWebの仕様です。採用された場合、5年後には、その接続の品質に関係なく、モバイル接続でWebページが数秒でロードされる場合があります。テクノロジーや通信会社が速度を上げるのを待てないなら、ページのサイズを少なくとも小さくすることができます。
AMPは静的ページ用に設計されています。開発者は、通常バージョンとAMPバージョンの2つの異なるページを作成する必要があります。 AMPページには通常のページへのリンクがあり、逆の場合も同様です。リクエストがモバイルから通常のページに来るたびに、AMPページがロードされ、その逆も同様です。 Googleには独自のAMPキャッシュがあり、高速にロードできます。 AMPページの開発中に、AMPルールを考慮する必要があります。
これにより、事態はより明確になりました [〜＃〜] url [〜＃〜]
最大の最適化の1つは、外部リソースからのすべてを非同期にするため、ページ内の何もレンダリングをブロックできないことです。
したがって、CSSをブロックするレンダリングはもうありません。
他のパフォーマンステクニックには、すべてのiframeのサンドボックス化、リソースがロードされる前のページ上のすべての要素のレイアウトの事前計算、遅いCSSセレクターの無効化が含まれます。
この新しいリンクがお役に立てば幸いです。