Build with Chrome Learn how Chrome works, participate in origin trials, and build with Chrome everywhere.
はじめに 5/17(米国時間)〜3日間、Google I/O 2017が開催されました 今年も盛況だったようです いつものように 全てのセッションの動画 が公開されています 去年のセッションの中で話題になっていたAMP・PWAについて今年のセッション動画から動向を確認してみました AMP・PWAとは?(おさらい) AMP(Accelerated Mobile Pages) GoogleとTwitterが合同で開発 モバイルでページを高速表示する 必要な技術 AMP HTML…専用のhtml/CSS/JSコーディング AMP JS…専用のJSライブラリ Google AMP Cache…キャッシングのためのCDN 参考 Accelerated Mobile Pages Project(公式) Googleの AMPデモ AMP Start …AMP+Material Designのコンポーネ
$ lighthouse --help lighthouse <url> <options> Logging: --verbose Displays verbose logging [boolean] [default: false] --quiet Displays no progress, debug logs, or errors [boolean] [default: false] Configuration: --save-assets Save the trace contents & devtools logs to disk [boolean] [default: false] --list-all-audits Prints a list of all available audits and exits [boolean] [default: false] --list
[レベル: 上級] 先週投稿したプログレッシブ ウェブ アプリ(以下、PWA)の記事で、「AMPよりもPWAに注目したい」と個人的な思いに触れました。 ところが、PWAとAMPの対立軸を作ったように思わせてしまったかもしれません。 しかし、PWAとAMPは排他的な技術では決してありません。 それどころか、両者を組み合わせることによってさらに優れたモバイルユーザー体験を提供できます。 そこでこの記事では、PWAとAMPを組み合わせる、通称”PWAMP”について解説します。 AMPとPWAを連携する3つのパターン GoogleのAMPチームに所属している Paul Bakaus(ポール・バカウス)氏は、AMPとPWAを組み合わせるパターンとして、次の3つの形態をSmashing Magazineの記事で紹介しています。 AMP as PWA AMP to PWA AMP in PWA それぞれ
Google が Android 用の Chrome Dev と Chrome Canary に WEB アプリを通常の Android アプリのように利用できる「WebAPK」の実装を開始しました。 WebAPK は Chrome 47 以降がサポートしている「Progressive Web App(PWA)」を Android アプリのパッケージ形式である APK に変換して端末にインストールする仕組みです。これにより、WEB アプリを通常の Android アプリと同等に利用できるようになります。 PWA では、WEB アプリを Chrome カスタムタブなどの Chrome 標準機能を利用して表示しますが、一般の WEB サイトとは違い、スプラッシュスクリーンやプッシュ通知をサポートしており、Android のアプリドロワーやアプリ履歴画面には WEB アプリ名が表示されます。WE
大変ご無沙汰しております。TechFeedの白石です。 前回の記事でお伝えしたとおり、先日2016/11/7、TechFeed初回リリース(7月26日)以来初めてのメジャーバージョンアップを果たしました。 コードベースを大幅に書き換え、Webアプリとモバイルアプリを全て一つのソースコードで実現するようにしました(実際には、一部以前のコードも残っていますが)。ついでにService Workerによるプッシュ通知やオフラインキャッシュ(現在無効化していますが近々有効化)、Web App Manifestの配置なども行い、Progressive Web Apps化も果たしました。 1ソースであらゆるデバイスとブラウザに対応Progressive Web Appsの定義もあいまいな気がしていますが、ぼくらとしては、対応ブラウザ(Android Chromeなど)でWebサイトにアクセスした際に「
Web上でPWAについて検索をすると、さまざまな相反する情報や判断基準が表示されます。PWAを定義するには、テクニカルな面でこれから紹介する4つの基準があり、Google Chrome、Opera、Samsungのブラウザーが対応しています。 この4つの基準を満たせば、開発者は望み通り自由に機能をカスタマイズでき、オフラインでのエラーページやオフラインでのブラウジングが可能になります。 プログレッシブになるための条件 Webサイトが、サーバー上にPWAがあると認識されるためには、ユーザーに「Add To Home Screen(ホームスクリーンに追加)」と表示することも含めて、次の4つの条件がグーグルによって定められています。 ユーザーが5分以上間隔を空けて2回訪れるか HTTPSをサポートしているか 有効なJSONのマニフェストが含まれているか Service Workerが含まれている
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く