Workbox概要ページを日本語訳してみた - Qiita
Workboxの概要ページを自分の勉強も兼ねて日本語訳に初チャレンジしました。英語は苦手なので、ほぼGoogle翻訳です。何か間違い等あればご指摘頂けると大変助かります。 https://workboxjs.org/overview.html Workboxは、Webサイトのリソースをローカルに、ユーザーのデバイスに簡単に保存できるライブラリとビルドツールのコレクションです。次の場合は、Workboxを検討してください。 サイトをオフラインで作業させたい。 リピート訪問時の負荷パフォーマンスを向上させたい。ワークボックスを使用すれば、共通リソースをネットワークからではなくローカルに格納して提供することができます。 Workboxの背後にある技術 ServiceWorkerを使えば、最新技術であるオフラインWebアプリケーションの構築が可能です。ServiceWorkerはJavaScrip
GoogleChrome/sw-precache が便利そう - console.lealog();
知ってた人には今さらーって感じかもやけど。 正月休み最後の日ということで、何か新しい目のやつを学びたいなあと思い。 ServiceWorkerでできることやデザインについては追ってたつもりやったけど、実際にコード書いたことはないなということで。 スーパーイカメーカーとかいう丁度よい題材も手元にあることやので、これにServiceWorkerを適応するならどんな感じかとやってみた。 ただ結局リリースはしてなくて、その紆余曲折もまとめてメモ。 ServiceWorkerでやりたかったこと 主にはCache APIによるオフライン対応。 もはや更新の予定がないのでプッシュ通知もいらないし、他のテクいことにも使えなさそう。 最初は勉強がてら手書きで全部いこうかと思ったけど、細かいとこまで考慮しようとすると色んなイベントで色んなことが必要なのと、キャッシュしたいパスをコードに手書きするのはアレやなー
サンプルコードで学ぶPWA - Qiita
はじめに Google I/O 2017の動画を確認し、そろそろPWAについて真面目に把握していかなければと思い至り、GitHubからいくつかサンプルプログラムを探してきて触ってみたので基本的な技術情報と合わせてまとめました。なのでPWA初心者向けです。 特定のJSフレームワークを扱う専門のエンジニアでない限り（私自身がそうなので）、それぞれのJSフレームワークの対応状況なども気になるところだと思いますので、 React.js , Angular , Vue.js の3つにおけるPWAのサンプルについても調べました。 確認した手順などを含めて要点だけまとめていますが、詳細はそれぞれのGitHubページを参照しつつcloneして触ってみて頂ければと思います。 シンプル構成 まずはJSフレームワークなどが入っていないシンプルな構成で、PWAの仕組みについてざっくりまとめました。 PWA ret
いまさら聞けないPWAとAMP - Qiita
概要 PWA = モバイルのWEBページでネイティブアプリのようなUXを提供するためのもの ※ 2020/04/05 追記: PWAに関する仕様の策定当初はモバイルでのユースケースが主だったと記憶していますが、PWAはモバイルに限定されたものではなく、実際にデスクトップでの活用例も増えています。参考: PWAs: building bridges to mobile, desktop, and native (Google I/O '18) AMP = モバイルのWEBページを高速化するためのもの どちらもGoogleが主軸となって策定されている、モバイルページを進化させるためのプロジェクトおよび技術。ネイティブアプリの代替技術ではなく、ブラウザAPIの進化によってネイティブアプリのようなUXをウェブページで提供することが主眼。 1. PWAとは Progressive Web Appsの
service workerを実際のRailsで開発しているサービスに導入してみよう - Qiita
##「service worker」とは？ Chrome ソフトウェアエンジニアの@nhiroki_さんによると、 ページのバックグラウンドで動くイベント駆動の JavaScript 環境 （ゆえに “Service” Worker） とのこと。 大きくは現在は2つ特徴がある。 Cache機能 (オフライン環境でのアクセスを可能に) Push機能 (アプリと同様にリエンゲージメントを高める) 引用:Service Worker の紹介 Service Workerのライフサイクルは上記。 引用: Service Worker hackathon 2015 - introduction talk 1秒ってのは、人がシームレスに感じる(=違和感なくかなり心地よい)秒数だが、実際今のmobileでの1秒の内訳は上記にある通り、コネクション張ったり通信を発生させる部分で既に大枠を使っている・・・w
Service Workerについて調べてみた - Qiita
はじめに 先日cordovaユーザ会の勉強会で恥ずかしながら初めてService Workerという言葉を知り、興味を持ちました。アドベントカレンダーを書くということで自分も勉強になるという目的て調べた結果と個人的な感想(少々)をまとめてみました。実装について全く書いていません、ご了承ください。 なぜService Workerを使う その前にProgressive Web Apps (PWA)っていうのがあって Googleさんの定義はこうですと1 要するにネイティブアプリ的なユーザ体験を提供できるウェブアプリということですかね。 ホーム画面に追加機能について ウェブページをホーム画面にブックマークする機能です。ChromeではWeb App Manifestを導入、iOS Safari対策でapple-mobile-web-app-capableメタタグを追加などで簡単にネイテブアプリ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
