2015-10-07 52 views
53

好的,所以我們都可能聽說谷歌的AMP HTML什麼是AMP HTML?它如何適應框架/工具X?

我很好奇的是這是怎麼回事,以適應我們現有的工作流程。如果您正在編寫React或Angular應用程序,AMP HTML如何適應開發流程?這些框架中的每一個都已經有了定義組件的方法,看起來AMP似乎只是添加到堆棧中。

我們大多數人已經在使用其他工具,如browserify或webpack。我不太樂於看到AMP 如何適合與其餘。其中一些工具已經允許我們以優化的方式爲我們的網站提供服務。 AMP HTML會改變這一切嗎?

+1

好吧:首先,它來自Google,而不是Twitter。其次,它完全基於移動網頁。它限制了Javascript,而不是鼓勵它。我認爲它有很大的潛力。是的,像Angular這樣的圖書館可以使網站更快,但並不鼓勵你使用Javascript。你有你的區別。 – Siyah

+0

對不起,我今天看到Twitter發佈了一條消息,讓我的線路越過了。 – naomik

+0

https://github.com/ampproject/amphtml –

回答

23

AMP HTML基本上回歸到基礎知識並提供最快的HTML。我想起了WAPNokia 7110

這是一套嚴格的用於製作網頁的規則,那就是開放的發展和開放給其他公司和開發人員擴展。

這如何與SPA(單頁應用程序)和其他JavaScript前端重框架是未知的在這一點上,這是對那些開發人員要弄清楚。

在它的核心它的靜態HTML頁面設計,儘可能快地加載慢速連接和小意見自定義元素。任何人都可以優化他們的移動網站,並且如果他們真的想把它縮小到幾KB,AMP-HTML或者不。

主要好處是

  1. 谷歌會支持它,認爲Android,Chrome和谷歌搜索,谷歌CDN。
  2. 頁面加載速度非常快,可以看起來很漂亮。

Wordpress和其他發佈商的初始採用可能是一組單獨的移動友好AMP頁面。這是來自谷歌誰希望你使所有的普通網頁移動友好或面對搜索引擎優化點擊。

如果從長遠來看,想想它側重於性能的移動網頁的規範。如果採用,5年後,無論連接質量如何,任何網頁都可能在幾秒鐘內加載移動連接。如果我們不能等待技術和電信公司加快速度,那麼我們至少可以減少我們頁面的大小。

+21

它解釋了AMP,但並非真的如何在其他工作流程中起作用。 – staypuftman

13

AMP是爲靜態頁面設計的。開發人員必須製作兩個不同的頁面:普通版本和AMP版本。 AMP頁面將鏈接到正常頁面,反之亦然。每當請求從移動頁面轉到正常頁面時,它將加載AMP頁面,反之亦然。谷歌有它自己的AMP緩存來加載它更快。在開發AMP頁面時,我們只需要考慮AMP規則。

1

事情現在更清楚通過該URL

中最大的優化是,它使這來源於異步外部資源的一切,所以沒有在頁面可以呈現任何阻擋的事實。

因此,沒有更多的渲染阻擋CSS。

其他性能技術包括對所有iframe進行沙盒,在加載資源之前預先計算頁面上每個元素的佈局以及禁用慢速CSS選擇器。

希望這個新的鏈接幫助。