Chrome Dev Summit

2018に

参加した話

Ryo Utsunomiya(@ryo511)

Tokyo WordPress Meetup

2018-12-21

自己紹介

Chrome Dev Summitとは

  • Googleが毎年開催している、Webフロントエンド技術のカンファレンス
    • 今年は11/12〜13
  • PWAとか、新しいブラウザの機能とかの話が聞ける
  • WordPressを中心とした、CMSの話題も

今年のCDS

  • 1日目は「現在のWebをより良くするためにできること」
  • 2日目は「未来のWebで出来るようになること」
  • ざっくりいうと、1日目はPWA、2日目はChromeの新しいAPIの話
  • WordPressについては、1日目の「Progressive Content Management Systems」というセッションで触れられていた

ハイライト

Progressive CMS?

  • 一般に、CMSは遅い 😓
    • 汎用性や後方互換性維持のため、コアのパフォーマンス最適化は難しいことも
  • しかし、ユーザの側でモダンなWebテクノロジーを取り入れることで、CMSを高速化できる!
  • モダンなWebテクノロジーを、必要に応じて取り入れられるCMSを、Progressive CMSと呼んでいる

モダンなWebテクノロジー?

  • ざっくりいうと、AMPとPWA
  • AMPはページの高速化に効く
    • AMPによる制約、amp cache
  • PWAはいくつかの要素技術からなる
    • HTTPS => セキュアなWebサイト
    • Service Worker => オフラインWebアプリケーション、precacheによる高速化
    • Web App Manifest => ホームスクリーンにインストール

AMP

  • AMP: Accelerated Mobile Pages
  • 高速なWebページを作るために、様々な制約の付けたWebページ
  • JavaScriptを実行できない、外部CSSを読み込めない等の制約がある
  • Google検索にキャッシュされるという特徴がある

PWA

  • Progressive Web Apps
  • あまり明確な定義はない(Googleの定義も変遷がある)
  • 最低限必要な要素は、HTTPS/Service Worker/Web App Manifestの3つ
  • これらの技術によって、
    • セキュリティ
    • パフォーマンス
    • エンゲージメント
  • などが改善される

WordPressの場合

  • AMPとPWAのプラグインが、Googleの協力によって提供されている
  • AMPプラグインは1.0がこの前リリース、Gutenbergに対応し、かなり機能が強化された
  • PWAプラグインは開発が滞ってるような…。今後に期待。
  • サードパーティのAMP/PWAプラグインも盛況

まとめ

  • Webサイトのユーザ体験を改善するための技術の手札は増えてきている
  • WordPressのプラグインも充実してきた
  • モダンなWebテクノロジーを使って、Webサイトを改善しよう!
Made with Slides.com