Workbox Broadcast Cache Update | Workbox | Google DevelopersBuild with Chrome Learn how Chrome works, participate in origin trials, and build with Chrome everywhere.
PWAで表示速度が2倍に！ スピード改善を妥協しない日経電子版に学ぶ、PWAのメリット＆デメリット - エンジニアHub｜Webエンジニアのキャリアを考える！
PWAで表示速度が2倍に！ スピード改善を妥協しない日経電子版に学ぶ、PWAのメリット＆デメリット ネイティブアプリに近い体験を簡単に提供できるとして注目を集めている「PWA」。実際に導入し、表示速度が2倍になったという日経新聞電子版の開発者に「PWA」のメリットとデメリットを伺いました。 PWA（Progressive Web Apps）は本当に「アリ」なのか――？ ネイティブアプリの開発にはWebとは異なる専門知識が必要であり、またAndroidやiOSなどOSごとでも異なるため、リソースが膨大にかかるという課題があります。そこで昨今は、XamarinやReact Nativeなどのクロスプラットフォーム開発ツールを使い、ネイティブアプリやWebの開発を一本化しようという動きが活発になっています。 一方で、ネイティブアプリに近い体験を簡単に提供できるとして注目を集めているのが、Goog
【新機能】PC版「Googleフォト」がPWA化、まるでネイティブアプリに変身！
人気オンラインストレージサービス「Googleフォト」のデスクトップ版が、Googleが提唱するPWAに対応しました。PWA化により、Web版のGoogleフォトをあたかもネイティブアプリのように利用できるようになります。 Googleフォトのデスクトップ版がPWAに対応！ Google（グーグル）が提供しているオンラインストレージサービス「Googleフォト」のデスクトップ版（パソコン版）が、このたびPWA（Progressive Web Apps）に対応しました。 PWA（Progressive Web Apps）とは、WebサービスをWebブラウザーとは別に独立したウィンドウで表示し、あたかもネイティブアプリのように利用できるようにする仕組みです。PWAは通常のWebサイトよりもレスポンスが速いとされ、ユーザーの操作性の向上が謳われています。また、Webベースでサービスを利用できるた
Chrome OS 67がPC版PWAをサポート。ゆくゆくは、Mac/WindowsでもPWAが使えるようになる
[レベル: 上級] デスクトップ版の PWA が Chrome OS 67 でサポートされました。 デスクトップ版 PWA Chrome OS、Chrome OS という OS が可動している PC です。 Android OS が可動しているスマートフォンではありません。 しかしながら、5月29日にリリースされた Chrome 67 の Chrome OS 版 では PWA が動くようになりました。 ブラウザで閲覧するウェブサイトはなく、1つの独立したアプリとしてウェブサイトをユーザーは PWA を利用できます。 こちらは、ブラウザ (Chrome) で閲覧したウェブ版の Twitter です。 タブやアドレスバー、メニューがある、おなじみの Chrome のインターフェイスです。 こちらは、ウィンドウとして開いた PWA 版 Twitter です。 タブもアドレスバーもありません。 単
Getting started with Progressive Web Apps
December 23, 2015 There's been much welcome discussion about Progressive Web Apps lately. They're still a relatively new model, but their principles can equally enhance apps built with vanilla JS, React, Polymer, Angular or any other framework. In this post, I'll summarise some options and reference apps for getting started with your own PWApp today. What is a Progressive Web App? A Progressive We
PWAを支える技術とPRPLパターンの実装 - embryo
この記事はトレタ Advent Calendar 2017の11日目の記事です。 dev.toで最近話題になったPWA実装ですが、今日はそのPWA設計パターンの１つであるPRPLを実践するために必要な技術スタックとその実装方法についてまとめました。 PRPLパターンとは Googleが提唱するPWAの設計パターンの１つです。 PRPL パターン | Web | Google Developers (P)ush: HTTP/2 Pushを用いて初期表示に必要なリソースを配信します (R)ender: 最小限の初期描画を行い、インタラクティブな状態にします (P)re-cache: ServiceWorkerを用いて事前に他のルートのリソースをキャッシュします (L)azy-load: ユーザー操作に合わせてオンデマンドにリソースの配信と生成を行います これらの頭文字をとってPRPLと
PWAのプッシュ通知の仕組み
PWAウェブプッシュ 2018.02.08 yamamoto エンジニアの山本です。 Progressive Web Applicationの入門記事『PWA対応をするためにやった最低限のこと』に続きまして、プッシュ通知を実装していきたいのですが、その前にWebプッシュの仕組みを理解する必要があると感じたため、本投稿ではどのようにWebプッシュが機能しているのかについて、説明します。 Webプッシュの登録から送信まで Webプッシュに関して、大きく分けて２つの段階があります。 登録が完了するまでの準備段階 プッシュ通知を送信する実行段階 この仕組みを段階的に確認しながら、プッシュ通知の理解を深めていただければと思います。 （準備段階）Webプッシュの登録が完了するまでのフロー まずは、Webプッシュの登録が完了するまでのフローをみていきます。 全体像はこんな感じです。 ステップ１ ユーザー
Debugging Service Workers
プログレッシブ ウェブアプリ: オフライン コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 1. ようこそ このラボでは、既存のウェブ アプリケーションをオフラインで使用できるようにします。これは、プログレッシブ ウェブアプリ ワークショップの一連のコンパニオン Codelab の最初です。このシリーズにはさらに 7 つの Codelab があります。 学習内容 Service Worker を手動で作成する 既存のウェブ アプリケーションに Service Worker を追加する Service Worker と Cache Storage API を使用してリソースをオフラインで使用できるようにする 必要な予備知識 簡易 HTML と JavaScript 必要なもの Service Worker をサポートするブラウザ 2. 準備 まず、この Co
PWA版GoogleマップがGoogle Playからインストール可能に、PWA対応したGoogle検索は高速化に成功 #io18 #io18jp
[レベル: 中級] Google は PWA の発展、普及に力を入れていますが、自社プロダクトの PWA 化にも乗り出しています。 この記事では、PWA 対応した Google マップと Google 検索について紹介します。 PWA 版 Google マップの Google Maps Go は Google Play からインストール可能 PWA に対応した Google マップは今年の2月に正式にリリースされていました。 その後 PWA 版 Google マップは「Google Maps Go」という名称で、Google Play にアプリとして掲載されるまでに至りました。 「Google Maps Go は、Google マップ アプリの軽量版のプログレッシブ ウェブアプリで」と説明に書かれています。 「プログレッシブ ウェブアプリ」が何なのかを一般ユーザーが理解できるかどうかはとも
What makes a good Progressive Web App? | Articles | web.dev
What makes a good Progressive Web App? Stay organized with collections Save and categorize content based on your preferences. Progressive Web Apps (PWA) are built and enhanced with modern APIs to deliver enhanced capabilities, reliability, and installability while reaching anyone, anywhere, on any device with a single codebase. To help you create the best possible experience, use the core and opti
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
プログレッシブウェブアプリチェックリスト
