Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
オフラインWebアプリの仕組み
Search
Yosuke Onoue
April 14, 2018
Technology
1
670
オフラインWebアプリの仕組み
Ionic Meetup Nagoya #1のLT発表資料です。
Yosuke Onoue
April 14, 2018
Tweet
Share
More Decks by Yosuke Onoue
See All by Yosuke Onoue
ネットワーク可視化の世界
likr
8
6.7k
Think About Front-end Web Development with Rust
likr
2
540
Yewにおけるoff-the-main-thread
likr
1
770
行政事業レビューデータの可視化 / Visualization of Japan's National Budget with JUDGIT!
likr
1
230
モダンJavaScript再入門 / Re-introduction to Modern JavaScript
likr
24
11k
Web-based Data Visualization with Rust and WebAssembly
likr
4
5.9k
Introduction to Graph Drawing
likr
0
510
20190707Ionic_Meetup.pdf
likr
0
450
About the end of the web
likr
2
540
Other Decks in Technology
See All in Technology
AI時代だからこそ考える、僕らが本当につくりたいスクラムチーム / A Scrum Team we really want to create in this AI era
takaking22
6
3.1k
[2025-09-30] Databricks Genie を利用した分析基盤とデータモデリングの IVRy の現在地
wxyzzz
0
450
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
11
77k
コンテキストエンジニアリングとは? 考え方と応用方法
findy_eventslides
4
880
extension 現場で使えるXcodeショートカット一覧
ktombow
0
200
いま注目しているデータエンジニアリングの論点
ikkimiyazaki
0
580
Sidekiq その前に:Webアプリケーションにおける非同期ジョブ設計原則
morihirok
17
7.2k
ACA でMAGI システムを社内で展開しようとした話
mappie_kochi
0
220
PLaMo2シリーズのvLLM実装 / PFN LLM セミナー
pfn
PRO
2
950
データエンジニアがこの先生きのこるには...?
10xinc
0
440
神回のメカニズムと再現方法/Mechanisms and Playbook for Kamikai scrumat2025
moriyuya
4
450
多野優介
tanoyusuke
1
310
Featured
See All Featured
Speed Design
sergeychernyshev
32
1.1k
Documentation Writing (for coders)
carmenintech
75
5k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
188
55k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
Context Engineering - Making Every Token Count
addyosmani
5
170
Testing 201, or: Great Expectations
jmmastey
45
7.7k
The Straight Up "How To Draw Better" Workshop
denniskardys
237
140k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Art, The Web, and Tiny UX
lynnandtonic
303
21k
A Tale of Four Properties
chriscoyier
160
23k
Making Projects Easy
brettharned
119
6.4k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Transcript
ΦϑϥΠϯ8FCΞϓϦͷΈ ͓ͷ͏͑ *POJD.FFUVQ/BHPZB ݄ ͜ͷεϥΠυͷ63- IUUQCJUMZ*4Z1
ࣗݾհ w ඌ্༸հ :PTVLF0OPVF w ຊେֶจཧֶ෦ใՊֶՊॿڭ w ՄࢹԽɺ࠷దԽɺΞϧΰϦζϜͷݚڀ w
*POJDΞϯν w ϚΠϒʔϜ w -JHIUIPVTFͰຬΛࢦ͢
8FCαΠτ ωοτ͕ͳͯ͘ ݟΕΔ࣌
ΦϑϥΠϯ8FCΞϓϦ w ωοτ͕͍ɺෆ௨ͳॴͰ͑Δ8FCΞϓϦ w Լɺτϯωϧͷதɺաૄɺൃల్্ࠃɺӉɺʜ w 1SPHSFTTJWF8FC"QQT 18" ͷཁ݅ͷҰͭ w
18"$IFDLMJTU IUUQTEFWFMPQFSTHPPHMFDPNXFCQSPHSFTTJWFXFCBQQTDIFDLMJTU w -JHIUIPVTF IUUQTDISPNFHPPHMFDPNXFCTUPSFEFUBJMMJHIUIPVTFCMJQNEDPOMLQJOFGFIONKBNNGKQNQCKL w ࡞ͬͨ w IUUQTFHSJEKQ
ΦϑϥΠϯ8FCΞϓϦΛࢧ͑Δٕज़ w ϒϥβετϨʔδ w 8FC4UPSBHF TFTTJPO4UPSBHFMPDBM4UPSBHF w *OEFYFE%# w
ΦϑϥΠϯΩϟογϡ w 4FSWJDF8PSLFS $BDIF"1* w ͦͷଞ w /BWJHBUPS0O-JOF w #BDLHSPVOE4ZOD
ΦϑϥΠϯ8FCΞϓϦΛࢧ͑Δٕज़ w ϒϥβετϨʔδ w 8FC4UPSBHF TFTTJPO4UPSBHFMPDBM4UPSBHF w *OEFYFE%# w
ΦϑϥΠϯΩϟογϡ w 4FSWJDF8PSLFS $BDIF"1* w ͦͷଞ w /BWJHBUPS0O-JOF w #BDLHSPVOE4ZOD
"QQ4IFMMΞʔΩςΫνϟͷస 8FCϖʔδ )5.-$44+4 αʔόʔαΠυ ΫϥΠΞϯταΠυ %# ίϯςϯπ )5.-$44+4 Ωϟογϡ ैདྷͷ8FCΞϓϦ
"QQ4IFMM 5FNQMBUF 8FCϖʔδ Precache Runtime Cache
4FSWJDF8PSLFS w ωοτϫʔΫϦΫΤετͷϑοΫॲཧ w ΦϑϥΠϯΩϟογϡ w 1SFDBDIF3VOUJNF$BDIF w ϓογϡ௨ w
#BDLHSPVOE4ZOD w ʜ
4FSWJDF8PSLFSʹΑΔΩϟογϡ ίϯςϯπ )5.-$44+4 Ωϟογϡ 8FCϖʔδ Precache Runtime Cache Ωϟογϡ w
1SFDBDIF w 8FCΞϓϦʹඞཁͳϑΝΠϧΛ 4FSWJDF8PSLFSొ࣌ʹΩϟογϡ w 3VOUJNF$BDIF w ίϯςϯπɺը૾ΛඞཁʹԠͯ͡Ωϟογϡ
4FSWJDF8PSLFSΛॻ͘ w ੜ w :PVS'JSTU1SPHSFTTJWF8FC"QQ IUUQTEFWFMPQFSTHPPHMFDPNXFCGVOEBNFOUBMTDPEFMBCTZPVSpSTUQXBQQ w TXQSFBDBDIFTXUPPMT w
8FCΞϓϦͷΦϑϥΠϯԽʹඞཁͳॲཧͷఏڙ w 8PSLCPY w TXQSFDBDIFTXUPPMTΛΑΓ͍͘͢ߴػೳʹ
8PSLCPY IUUQTEFWFMPQFSTHPPHMFDPNXFCUPPMTXPSLCPY
4FSWJDF8PSLFSͷੜ w XPSLCPYDMJ w XPSLCPYίϚϯυ w XPSLCPYCVJME w /PEFKTHVMQ͔Βར༻ w
XPSLCPYXFCQBDLQMVHJO w XFCQBDLϓϥάΠϯ w XBUDIɺ8FCQBDL%FW4FSWFSରԠ
4FSWJDF8PSLFSͷੜ w XPSLCPYDMJ w XPSLCPYίϚϯυ w XPSLCPYCVJME w /PEFKTHVMQ͔Βར༻ w
XPSLCPYXFCQBDLQMVHJO w XFCQBDLϓϥάΠϯ w XBUDIɺ8FCQBDL%FW4FSWFSରԠ
XPSLCPYXFCQBDLQMVHJO const WorkboxPlugin = require('workbox-webpack-plugin') module.exports = { plugins: [
new WorkboxPlugin.GenerateSW({ swDest: 'sw.js', globDirectory: './public', globPatterns: [ '*.{html,css,js}' ], globIgnores: [ '_redirects', 'bundle.js', 'sw.js' ], navigateFallback: '/index.html' }) ] }
4FSWJDF8PSLFSͷొ if ('serviceWorker' in navigator) { navigator.serviceWorker.register('/sw.js') .then((registration) => {
}).catch(() => { }) }
·ͱΊ w 8FCΞϓϦΦϑϥΠϯͰಈ࣌͘ w ͜Ε·Ͱͷ8FCͷৗࣝɺΞϓϦͷৗࣝΛݟͦ͏ w *POJD͚͕ͩ18"ͷબࢶͰͳ͍ w 8PSLCPY͍͍ͧ