タグ

ServiceWorkerといつか試すに関するmasayoshinymのブックマーク (7)

  • Cache API を利用したフロントエンドキャッシュ - ボクココ

    ども、@kimihom です。 今回は Cache API を使う機会があったので、調査結果と利用のユースケースと共に紹介しよう。サーバーサイドをどんなに高速化するよりも、フロントエンドで そもそもリクエストをさせない 仕組みにすれば、それが最も速いというのを改めて感じた。 Service Worker と Cache API 「Service Worker を使えば、オフラインでもアクセスできるようになる」っていうのがよく聞く話だろう。これを実現するには、Cache API と Service Worker の2つを組み合わせることで実現できる。Service Worker を使うと、ページリクエスト時のイベントを横取りすることができるから、それが実現できる。詳しくは以下の Qiita が参考になる。 ServiceWorkerとCache APIを使ってオフラインでも動くWebアプリを

    Cache API を利用したフロントエンドキャッシュ - ボクココ
  • ServiceWorkerを簡単に書けるworkbox-swの使い方 - Qiita

    GMOペパボ Advent Calendar 2017の11日分のエントリーになります。 皆さんはPWA(Progressive Web Apps)をご存知でしょうか。 分かりやすさを優先して言うならば、新しい技術によってネイティブアプリのような動作が可能になったWebアプリケーションのことで、オフラインで動作したりプッシュ通知が送れるWebアプリケーションを実現することができます。 (詳細はGoogle Developersや私の発表スライドをご参照ください) さて今回はPWA作成にあたってとても便利なライブラリであるworkbox-sw(以下、workbox)の紹介記事となります。 workboxとは簡単な記述で最適なServiceWorkerのコードを生成してくれるライブラリです。 PWA自体どうやらまだ認知度が低く、それを作るためのライブラリ関連もまた情報不足だったため今回の記事を

    ServiceWorkerを簡単に書けるworkbox-swの使い方 - Qiita
  • Service Workerに関する仕様とか機能とか

    2014.12.29 Service Workerに関する仕様とか機能とか 今巷で流行りのService Workerについて調べ物してたので、まとめたメモ。 Service Workerが解決してくれること Service WorkerはHTMLCSS・JS・画像等などのリソースを、JavaScriptAPIから命令的にコントロールすることを実現する。Webページのパフォーマンスに関する指標としてネットワークを介して得るリソースをキャッシュさせたりすることが効果的であることは今更改めて挙げないが、Service Workerによって保持されたリソースは、オフライン状態でも返却することが可能という凄さを持っている。つまり、更新性の低いコンテンツであればオフラインでも閲覧させることが可能ということ。 更新性のあるコンテンツでも、回線が不安定な時はローカルに変更を保持して、サーバーに対して

    Service Workerに関する仕様とか機能とか
  • 中級者向け Service Worker Tutorial | blog.jxck.io

    Intro Service Worker の初心者向けのチュートリアルや、使ってみた系のエントリも増えてきました。 しかし、 Service Worker は通常のブラウザ用 JS の開発と少し経路が違い、慣れるまで開発やデバッグもなかなか難しいと思います。 そこで特に難しい部分、そして分かっていないと実際にデプロイした際に難しいと思う部分について、実際に動きを確認しながら解説したいと思います。 なお、 Service Worker の基的な概念などについては、他のチュートリアルなどを見て理解している前提で進めます。 思いつきで撮ったので色々ミスも有ります、また Chrome Dev Tools の UI はどうせ変わるのでそのつもりで見てください。 TODO になっている動画は、そのうち撮って追加します。 List claim controllerchange updatefound

    中級者向け Service Worker Tutorial | blog.jxck.io
  • 初めてのService Worker (Push API編) - Qiita

    はじめに この記事はGizumoエンジニア Advent Calendar 2015の17日目の記事です。 今回は、ServiceWorkerのPushAPIを使ってブラウザにPush通知を表示させてみたいと思います! このような記事はすでにあるので、今回は、 サンプルプログラムを用いて、より簡単にPush通知を体験してみる どんな流れでPush通知がくるのか流れを把握する この2点を中心に進めて行きます。 そして以下の点には触れません Service Worker 及び Push APIの詳しい仕様 今回はService WorkerのPush通知を体験し、おおまかな流れを掴むことを目的としています。 まだあまりJSに触れたことがない方も是非Push通知を体験してみてください!! それでは始めます! 開発環境 Chrome 42以上 MAMP(MAMPのインストールはこちら) 上記が使え

    初めてのService Worker (Push API編) - Qiita
  • Webでプッシュ通知するサービスを個人開発で作ってみた+ServiceWorkerPushAPIの実装方法まとめ - Qiita

    酒と子どもと開発と 開発期間に約3ヶ月間かかっていますが、実際にコードを書いた(コミットした)のは約24日間。家に帰って夜中にやったり、週末にまとめてやったりしたので、個人サービスならこんなものかなと思います。 僕はお酒が好きでほぼ毎日家で飲んでいるのですが、ついつい飲み過ぎてコードを書くことが出来ないことがよくありました。こんなんでは個人開発であるかぎり、いつまで経ってもリリースできません。なので、事前に「今日はコードを最低3時間は書くぞ」と決めて、酒を飲む量をコントロールしました。 ポイントは、禁酒はしなかったというところです。僕は自分が意思の弱い人間(特にお酒に対して)で、禁酒なんて難易度の高いことに挑戦するよりも、ビールを1飲みながら楽しく開発しよう!という方針のほうが継続できるということを知っているのです。という言い訳ですね。はい。 また、1歳半の子供もいるため週末の大半は家族

    Webでプッシュ通知するサービスを個人開発で作ってみた+ServiceWorkerPushAPIの実装方法まとめ - Qiita
    masayoshinym
    masayoshinym 2015/09/24
    “ついつい飲み過ぎてコードを書くことが出来ないことがよくありました。”俺か。
  • ServiceWorker解説 – オフラインWebアプリケーション開発技術の最前線

    ServiceWorker解説 – オフラインWebアプリケーション開発技術の最前線 岩瀬 義昌(HTML5 Experts.jp編集部) 今月上旬5月8日に、W3CよりServiceWorkerの草案初版が提示されました。ServiceWorkerは、オフラインWebアプリケーションの開発者が問題と考える点を解決する、非常に魅力的な仕様です。日語の情報がほとんどないこのタイミングで、HTML5 Expert.jp編集部が解説いたします! ServiceWorkerとは ServiceWorkerは、リソースの永続的なキャッシュを可能にする、およびWebアプリケーションのリソース要求の処理を可能にする新しい機能です。Webページを開く前であっても(ネットワークの接続/切断の有無にかかわらず)、独自の処理を挟み込めるのがポイントです。クライアント側に、一種のプロキシサーバがあるようにイメー

    ServiceWorker解説 – オフラインWebアプリケーション開発技術の最前線
  • 1