ep.12 AMP Conf 2019 Report

このエピソードについて

LINE

@potato4d が @tori3_jp と @okazou に AMP Conf 2019 に参加しての感想を聞いてみました。

ゲスト

清水さん

@tori3_jp
LINE UIT室 & Engineering Manager / Webview PM

岡崎さん

@okazou
UIT室 & Data Science and Engineering Center

AMP Conf 2019

2019/04/17, 2019/04/18 開催
今年は東京(六本木ヒルズ!)・昨年はオランダで開催
AMP に関するトピックのアップデート・企業ナレッジの共有などがある

Day 1 注目のトピック

AMP Stories
- SnapChat や Facebook、 Instragram の「ストーリーズ」を AMP に持ち込んだようなもの
- 特定のサービスに依存しない Web をベースとして共有しやすい体験を共有
- 文字ベースの時代から映像の時代に近づく中で、新しい Web コンテンツの形として開発
- AMP としてはコンテンツファーストを目指して開発していく方向性であると発表
オーサリングツール
- AMP Stories についてはオーサリングツールが新しく提供開始
- コードを書かずとも AMP 対応されたコンテンツの作成がはじまった
- 広告担当者が AMP Stories で広告を出稿していく世界観を想定
Next.js の AMP Support
- Zeit 製の React.js 向け Server Side Rendering フレームワーク
- すでに Next.js の Web サイトは AMP で作られている
AMP Script
- AMP 上で JavaScirpt が実行可能に
  - Worker DOM を利用した
  - まだまだ preact のようなライブラリがまだ完全に動くわけではない状態の様子
- 制限
  - un-gziped の状態で 150k 未満である必要有
  - ユーザーインタラクション起因のイベント発火後 5 秒のみの実行時間制限

Day 2 注目のトピック

ヤフー株式会社の SXG 対応
- ヤフートラベルでの事例
- SXG 対応についてのセッション
SXG について
- Signed HTTP Exchange
- AMP コンテンツの配信が Google から行われる場合、ドメインが Google のものとなる問題
  - Cookie が扱えない
  - アクセス解析に問題を及ぼすことがある
  - ユーザーからの信頼性
  - 画面上部のヘッダーがノイズとなる
- AMP ドメインの問題解消として Yahoo! トラベルでは SXG で対応した
SXG でできること
- コンテンツの配信とドメインの信頼性を切り分けることができる
  - yahoo.co.jp ドメインから Google 側にキャッシュされているコンテンツを配信できる
- 専用のサーバーを立ててパッケージングされたコンテンツを配信元へと渡す必要がある
  - AMP ページをパッケージングして Google へと送信するイメージ
  - ドメイン問題が解消されるという大きなメリットが有る一方、更新のために毎回パッケージングが必要でありシビア
- SaaS では Cloudflare が対応している
利用にあたっていくつかの課題感がある
- iOS 以外の Chrome 73+ でのみ動作する
- デバッグ方法が確立されていないためリリースしないと確認ができない

LINE や現場での利用について

アプリ内ブラウザについては今後に期待
- Bento AMP への期待
  - AMP の基準を満たしていなくても既存の Web サイトに一部 AMP を導入できる
  - AMP 専用の Web サイトを開発するのがコストが高いため、 AMP と非 AMP の相互運用性を考慮
  - 最終的には全ての Web サイトを AMP 対応できるように、漸進的な実装を期待
  - Web View の中で一部だけでも AMP が適用可能か
社内では使えないかもしれないけれど AMP Email も魅力的
- 後方互換性を維持したメール配信の仕様
  - これまでの Email に加えて、AMP 対応のクライアントは AMP Email が利用可能
  - Gmail でだけ動く、現状 Yahoo! メールなど各メーラーが実装中
- メールに対して動的なコンテンツ配信することが可能となる
  - 例えば空き部屋情報など、リアルタイムな情報が求められるものを AMP で提供できる
- すでに Indeed で実装されており、成果が二倍になったとのこと
現場利用には AMP と事業のタイムラインのミスマッチが課題となる
- AMP で実装する場合は AMP にある要素でページを作り終えないといけない
- 作りたいときに本当に必要な要素が全て AMP にあるのか
- 清水さんの場合は現場でカルーセルの UI が必要に
  - 当時の AMP にはカルーセルがなく、 Pull Request を発行
  - AMP としては Web を遅くしないため議論にはそれなりの時間を要し、 1 年後にマージ
  - 実装時には AMP と完全に合うとは限らないことを念頭に億

採用について

使用素材・クレジット

BGM&SE