Už je to pár týdnů, kdy proběhla nejnovější konference představující novinky ze světa AMP. Neměl jsem ale moc času sepsat všechny ty zajímavé body, protože dopisuju e-book… no… hádejte o čem.
Zpráv bylo docela dost. Vybral jsem zde čtyři nejzajímavější. Předesílám, že budu často odkazovat na nově redesignovaný web téhle mé aktuálně nejoblíbenější technologie, který určitě za pozornost stojí taky – amp.dev.
Nebudu se také příliš zdržovat vysvětlováním základů AMP.
Projekt Bento: AMP jako framework na tvorbu webů
Jeden ze způsobů, jak lze AMP použít, je jako HTML, CSS a JS framework pro tvorbu webů. Například pro nasazení karuselu vezmete amp-carousel namísto jQuery (a jiných) pluginů:
<amp-carousel height="300" layout="fixed-height" type="carousel">
<amp-img src="image1.jpg" width="400" height="300" alt="…"></amp-img>
<amp-img src="image2.jpg" width="400" height="300" alt="…"></amp-img>
<amp-img src="image3.jpg" width="400" height="300" alt="…"></amp-img>
</amp-carousel>
Velká výhoda takového přístupu je, že nemusíte vytvářet dvě verze webu – AMP a ne-AMP (běžný responzivní web). Jenže to má háček – všechny komponenty vyžadují stažení hlavní knihovny, které občas autoři říkají AMP runtime. A ta stahuje něco kolem 75 kilobajtů. Velké mrzení, že?
AMP Bento je interní projekt, který má zařídit osamostatnění komponent, tedy možnost využití bez základní knihovny.
Mě se to moc líbí a doufal jsem, že AMP půjde kromě jiného přesně tímhle směrem. Řešilo by to jednu z nevýhod současného webdesignu – přílišnou složitost pro začínající. Už začaly vznikat první kurzy AMP pro webdesignem nedotčené.
Více je v textu „AMP as your web framework“.
Weby z Cache na původních URL? Uvidíme…
Zásadní výhoda AMP je zrychlení zobrazení webu. To je ale možné jen z AMP Cache, mezipaměti pro celé weby vytvářené touhle technologií.
Zásadní nevýhoda AMP je v tom, že se pak stránky zobrazují na URL poskytovatele keše, což je v českém případě skoro vždy Google. Moje stránka o HTTP/2 například sedí na této adrese:
https://www.google.com/amp/s/www.vzhurudolu.cz/amp/prirucka/http-2
Někomu to může být vcelku jedno, ale docela hodně lidem to fakt moc vadí. Jenže zatím to jinak nešlo.
Signed HTTP Exchanges je technologie, která by prohlížeči umožnila zobrazování původních URL, i když bude AMP stránka kešovaná.
AMP pages are beautiful, but links to AMP pages? Not so much …
— AMP Project (@AMPhtml) April 17, 2019
Until today! Signed exchanges are here: now you can get instant loading for AMP on your own domain! #AMPConf pic.twitter.com/OSEcKDc3A5
Zatím je předčasné říci, zda se to ujme – nejen kvůli podpoře v prohlížečích, ale také kvůli kritice Mozilly. Každopádně – poptávka je velká.
JavaScript v AMP!
Aby platformy jako Google nebo Bing mohly AMP stránky kešovat, z výkonnostních a bezpečnostních důvodů není možné, aby do nich vývojáři psali klientský JavaScript tak jako to dělají na současných webech.
AMP tohle řeší mnoha způsoby, hlavně ale sadou hotových komponent, díky kterým se u běžných webů bez JavaScriptu opravdu dokážete obejít. Navíc – nějaké programování tady omezeně možné je – podívejte se například na amp-bind.
Jak bylo na AMP Conf 2019 uvedeno, tým pracuje na výrazném rozšíření javascriptových možnosti.
Now at #AMPConf, we release the Kraken@kristoferbaxter takes the stage to introduce ‘amp-script’. Now your custom logic can be expressed with the world’s most popular programming language. April 17, 2019
JavaScript by se spouštěl bokem ve Web Workeru a mohl by podporovat známé frameworky jako je Vue.js, React nebo Preact. Podívejte se na chystanou komponentu amp-script.
Už to je opravdu jen „AMP“
„Áempé“ jako „Accelerated Mobile Pages“ už neplatí. Jak jsem před časem říkal ani jedno slovo v té zkratce už plně neodpovídá zaměření technologie. Takže nově jen „AMP“.
To by za mě mohlo stačit. Jak se vám novinky líbí? Neváhejte mi napsat.
Představili toho samozřejmě více – nativní podporu v Next.js, krásný nástroj pro tvorbu AMP Stories a tak dále. Více toho je v oficiálním blogpostu.
Komentáře
Máte doplnění, komentář nebo jste našli chybu?
Pro přidání názoru se prosím
přihlaste nebo si zřiďte účet.