1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【視聴メモ】Going Big: PWAs Come to Desktop and Chrome OS (Google I/O ’19)

Posted at

この記事は Google I/O '19 のセッションの視聴メモです。
想定読者は自分なので正確性や網羅率には問題があるかもしれません。


References

Speaker(s): Paul Covell, Dominick Ng

Abstract

PWAはもはやモバイルだけのものではありません。このセッションではどうやってDesktop PWAをビルドするのか、それらならではの機能、ベストプラクティスといったことを紹介します。

Contents

  • Webのユニバーサリティをもっと色んな所に持ち込もう
  • PWAが始まったのは2015年のAndroidから
  • SketchUp
    • Desktopで動くことを前提としたPWA
    • 1つのコードベースで3プラットフォーム(Windows, Mac, ChromeOS)
  • Write once, run anywhere
  • しかも既存のサイトにいくつか追加の要素を追加するだけ
  • Web App Manifest
    • PWA用の設定ファイル
    • start_url: デスクトップアプリとして開くときの起点のURL
    • display: standaloneを指定するとデスクトップアプリとして追加できる
    • theme_color: デスクトップアプリとして起動するときのタイトルバーのカラー
  • Service Worker
    • WorkBox使って簡単にSWを書ける
      • CSSは基本的にキャッシュしてバックグラウンドでアップデートしたり
  • Desktop PWAはリンクで共有できるしSearchに出てくる
    • アプリのダウンロードリンクが「追加する」リンクに置き換わるとアプリを追加する心理的抵抗が非常に少なくなる
  • インストールのアクションも開発者が制御できる
    • ページを初めて訪れたときがデフォルトだが、ユーザーのエンゲージメントが高い瞬間に出すように制御できる
    • Spotifyではページ上にインストールリンクがあって、それがクリックされたときに追加できる
  • インストール後のイベントも取れる
  • Chrome76からオムニボックス(Chromeの検索ボックス)にインストールボタンが追加される
  • ビジネスインパクトの話
    • HuluがネイティブからPWAに舵を切った
    • Chromeブックで試してみたらなんの問題もなかった
    • 数ヶ月で96%のユーザーがネイティブからPWAに移行した
    • 再訪問率が27%増加し、エンゲージメントは5.5%増加した
  • Native File System API
    • Not virtual but real!
  • PWAアプリの起動時の動作制御
    • モバイルと違って複数ウィンドウが立ち上がることが期待されるときがある
    • ウィンドウを立ち上げたり立ち上がっているウィンドウにフォーカスしたりするAPIが開発中

デスクトップ開発状況

  • ファイルシステムとウィンドウ制御のAPIは年末には入る予定

image.png

Memo

  • モバイルと共通している内容も多く聞きやすかった
  • Chrome 76から追加されるオムニボックスのインストールボタンが激アツすぎる
    • インストールという行為の心理的抵抗がまったくなくて良い
  • ウィンドウ制御APIがどんな形になるのか想像がつかないがとても楽しみ
1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?