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
Service Workerとブラウザでの通知について
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Toshihisa Tomatsu
January 22, 2020
Technology
3
360
Service Workerとブラウザでの通知について
Ehime.js #4の資料です。
https://ehimejs.connpass.com/event/162348/
Toshihisa Tomatsu
January 22, 2020
Tweet
Share
More Decks by Toshihisa Tomatsu
See All by Toshihisa Tomatsu
"フロントエンドの技術"を移行する技術 / Frontend Migrations
10shi10ma
0
58
Service Workerとは、それを使ってできること / what-is-service-worker
10shi10ma
3
2k
フロントエンドのエコシステム / Frontend Ecosystem
10shi10ma
8
3.3k
意外に知らないnpmと便利なCLI
10shi10ma
8
2.4k
歴史から学ぶ現代のフロントエンド
10shi10ma
17
11k
サイボウズ フロントエンドエキスパートチームとOSSの管理について
10shi10ma
0
1.1k
大規模フロントエンドの技術的負債と向き合う。
10shi10ma
5
6k
Google I/O ’19から見る新しいJavaScript
10shi10ma
5
3.1k
React+Storybook ことはじめ
10shi10ma
8
2.5k
Other Decks in Technology
See All in Technology
JEDAI認定プログラム JEDAI Order 2026 受賞者一覧 / JEDAI Order 2026 Winners
databricksjapan
0
240
Phase02_AI座学_応用
overflowinc
0
2.3k
めちゃくちゃ開発するQAエンジニアになって感じたメリットとこれからの課題感
ryuhei0000yamamoto
0
260
スピンアウト講座05_実践活用事例
overflowinc
0
890
20260320_JaSST26_Tokyo_登壇資料.pdf
mura_shin
0
110
ソフトバンク流!プラットフォームエンジニアリング実現へのアプローチ
sbtechnight
1
250
How to install a gem
indirect
0
230
Phase12_総括_自走化
overflowinc
0
1.1k
AgentCoreとLINEを使った飲食店おすすめアプリを作ってみた
yakumo
2
180
Bill One 開発エンジニア 紹介資料
sansan33
PRO
5
18k
Phase01_AI座学_基礎
overflowinc
0
3.1k
FastMCP OAuth Proxy with Cognito
hironobuiga
3
120
Featured
See All Featured
A Soul's Torment
seathinner
5
2.5k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Stop Working from a Prison Cell
hatefulcrawdad
274
21k
Digital Ethics as a Driver of Design Innovation
axbom
PRO
1
230
Amusing Abliteration
ianozsvald
0
140
We Are The Robots
honzajavorek
0
200
Embracing the Ebb and Flow
colly
88
5k
[SF Ruby Conf 2025] Rails X
palkan
2
840
Fireside Chat
paigeccino
42
3.8k
Test your architecture with Archunit
thirion
1
2.2k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
55k
jQuery: Nuts, Bolts and Bling
dougneiner
65
8.4k
Transcript
4FSWJDF8PSLFSͱ ϒϥβͷ௨ʹ͍ͭͯ &IJNFKT 5PTIJIJTB5PNBUTV
֎দढ़ঘ 5PTIJIJTB5PNBUTV αΠϘζגࣜձࣾ ϑϩϯτΤϯυΤΩεύʔτνʔϜ ۚˠ౦ژˠѪඤ &IJNFKT !UPTIJUPNB !UPTIJ@@UPNB 2
None
࠷ۙɺ௨ΛٻΊΔαΠτ͕ଟ͘ͳ͖ͬͯͨ ▸ αΠτʹΞΫηεͨ͠ޙɺ௨ͷڐՄΛٻΊΔμΠΞϩά͕ग़ͨΒͲ͏͢Δʁ
▸ αΠτʹΞΫηεͨ͠ޙɺ௨ͷڐՄΛٻΊΔμΠΞϩά͕ग़ͨΒͲ͏͢Δʁ ▸ ͱΓ͋͑ͣʮ#MPDLʯ ▸ αʔϏεʹΑͬͯॏཁ ▸ ͦͷαʔϏεΛϝΠϯͰͬͯͳ͍͚Ͳɺ௨͕དྷͨΒݟ͍ͨ ▸ ϦϚΠϯμʔػೳɺλΠϚʔػೳFUD
࠷ۙɺ௨ΛٻΊΔαΠτ͕ଟ͘ͳ͖ͬͯͨ
ϒϥβͰ௨Λग़͢ʹʁ
ϒϥβͰ௨Λग़͢ʹ ▸ ํ๏ ▸ 8FC"1*/PUJpDBUJPO ▸ ํ๏ ▸ 8FC"1*1VTI"1* 4FSWJDF8PSLFS3FHJTUSBUJPOTIPX/PUJpDBUJPO
8FC"1*/PUJpDBUJPO
IUUQTEFWFMPQFSNP[JMMBPSHFO64EPDT8FC"1*OPUJpDBUJPO
ํ๏/PUJpDBUJPO ▸ /PUJpDBUJPOT"1*ͷ/PUJpDBUJPOΠϯλϑΣʔε ▸ σεΫτοϓ௨ͷઃఆදࣔΛՄೳʹ͢Δ ▸ λϒΛΓସ͑ͨΓɺผͷΞϓϦʹҠಈ͍ͯͯ͠0, ▸ ௨Λදࣔ͢ΔʹɺݱࡏͷΦϦδϯʹରͯ͠ڐՄΛಘΔඞཁ͕͋Δ ▸
$ISPNF 'JSFGPY 4BGBSJ
௨ͷڐՄ
௨ͷදࣔ
؆୯
$ISPNF%FW5PPMTͷ$POTPMFͰ؆୯ʹࢼͤΔ ▸ 'JSFGPY$POTPMF͔ΒμΠΞϩάग़ͤͳ͔ͬͨ
ͨͩ͠ɺ/PUJpDBUJPOΛग़ ͢+4Λ࣮ߦ͍ͯ͠ΔϖʔδΛ ։͍͓ͯ͘ඞཁ͕͋Δ
ͭ·ΓɺͦͷϖʔδΛด͡Δ ͱ௨͞Εͳ͍
ϒϥβͰ௨Λग़͢ʹ ▸ ํ๏ ▸ 8FC"1*/PUJpDBUJPO ▸ ํ๏ ▸ 8FC"1*1VTI"1* 4FSWJDF8PSLFS3FHJTUSBUJPOTIPX/PUJpDBUJPO
8FC"1*1VTI"1* 4FSWJDF8PSLFS3FHJTUSBUJPO TIPX/PUJpDBUJPO
IUUQTEFWFMPQFSNP[JMMBPSHFO64EPDT8FC"1*1VTI@"1*
IUUQTEFWFMPQFSNP[JMMBPSHFO64EPDT8FC"1*4FSWJDF8PSLFS3FHJTUSBUJPOTIPX/PUJpDBUJPO
IUUQTEFWFMPQFSNP[JMMBPSHFO64EPDT8FC"1*4FSWJDF8PSLFS3FHJTUSBUJPOTIPX/PUJpDBUJPO
4FSWJDF8PSLFS
4FSWJDF8PSLFS ▸ ҰൠతʹϒϥβͰಈ͘+4ɺ8FCϖʔδͷϥΠϑαΠΫϧͰ࣮ߦ ▸ 4FSWJDF8PSLFS8FCϖʔδͱผʹϒϥβͷόοΫάϥϯυͰಈ࡞ ͢Δ+4ͷ࣮ߦڥ Πϕϯτۦಈ 8FCϖʔδ 4FSWJDF8PSLFS +4
+4 )5.- $44
4FSWJDF8PSLFS͕͋Δͱ ▸ ͜Ε·ͰͰ͖ͳ͔ͬͨ͜ͱ͕ՄೳʹͳΔ ▸ ྫ ▸ ΦϑϥΠϯମݧ ▸ ϓογϡ௨ ▸
όοΫάϥϯυಉظ
4FSWJDF8PSLFS͕͋Δͱ ▸ ͜Ε·ͰͰ͖ͳ͔ͬͨ͜ͱ͕ՄೳʹͳΔ ▸ ྫ ▸ ΦϑϥΠϯମݧ ▸ ϓογϡ௨ ▸
όοΫάϥϯυಉظ ϞόΠϧͬΆ͍ʂ →PWA
Πϕϯτۦಈ 8FCϖʔδ 4FSWJDF8PSLFS αʔόʔ POGFUDI POQVTI POTZOD ΠϕϯτʹԠͯ͡ ॲཧ͢ΔΑ
4FSWJDF8PSLFS͕͋Δͱ ▸ ͜Ε·ͰͰ͖ͳ͔ͬͨ͜ͱ͕ՄೳʹͳΔ ▸ ྫ ▸ ΦϑϥΠϯମݧ ▸ ϓογϡ௨ ▸
όοΫάϥϯυಉظ
Ұൠతͳ8FCϖʔδ 8FCϖʔδ αʔόʔ JOEFYIUNM͍ͩ͘͞ BQQDTT͍ͩ͘͞ NBJOKT͍ͩ͘͞ ʹΞΫηε
8FCϖʔδXJUI4FSWJDF8PSLFS 8FCϖʔδ αʔόʔ JOEFYIUNM͍ͩ͘͞ ʹΞΫηε 4FSWJDF8PSLFS Cache͋Δ͔Βɺ ͔ͦͬͪΒฦ͢Ͷ $BDIF
8FCϖʔδXJUI4FSWJDF8PSLFS 8FCϖʔδ αʔόʔ GPPIUNM͍ͩ͘͞ GPPʹΞΫηε 4FSWJDF8PSLFS Cacheͳ͍͔Β αʔόʔʹϦΫΤετ $BDIF 'FUDI"1*
GPPIUNM
4FSWJDF8PSLFSͰ ΦϑϥΠϯରԠͷ࣮ྫ
JOEFYKT 4FSWJDF8PSLFSͷొ 8FCϖʔδ
TXKT 4FSWJDF8PSLFSͷΠϯετʔϧΩϟογϡ࡞ 4FSWJDF 8PSLFS
TXKT GFUDIΠϕϯτΛΩϟονΩϟογϡ͔Βฦ͢ 4FSWJDF 8PSLFS
4FSWJDF8PSLFS͕͋Δͱ ▸ ͜Ε·ͰͰ͖ͳ͔ͬͨ͜ͱ͕ՄೳʹͳΔ ▸ ྫ ▸ ΦϑϥΠϯମݧ ▸ ϓογϡ௨ ▸
όοΫάϥϯυಉظ
ํ๏1VTI"1* 4FSWJDF8PSLFS3FTJHUSBUJPOTIPX/PUJpDBUJPO ▸ 4FSWJDF8PSLFSΛར༻ͯ͠ϓογϡ௨Λ࣮ݱ ▸ 1VTI4FSWJDF͔Βͷϓογϡ௨Λड৴ͯ͠ɺσεΫτοϓ௨Λදࣔ͢Δ ▸ 4FSWJDF8PSLFSΛ͏ͷͰɺϖʔδΛดͯ͡௨͕Մೳ ▸
$ISPNF'JSFGPY
4FSWJDF8PSLFSΛ͏͜ͱͰ ϓογϡ௨Λ࣮ݱ͢Δ
1VTI"1*ͱ/PUJpDBUJPOT"1*Ͱͷ࣮ 4FSWJDF8PSLFSΛΠϯετʔϧ͢Δ 4FSWJDF8PSLFS3FHJTUSBUJPO 4FSWJDF8PSLFS3FHJTUSBUJPOΦϒδΣΫτ͔Β1VTI.BOBHFSΛऔಘ 1VTI.BOBHFSͷTVCTDSJCFؔͰBQQMJDBUJPO4FSWFS,FZΛ͢ͱϓογϡͷߪಡ Λ։࢝
ʙαʔόʔͰϓογϡαʔϏεʹϝοηʔδΛૹ৴ʙ 4FSWJDF8PSLFSͷPOQVTIͰ1VTI4FSWJDF͔Βͷϓογϡ௨Λड৴ /PUJpDBUJPOT"1*ͷ4FSWJDF8PSLFS3FHJTUSBUJPOTIPX/PUJpDBUJPOͰ௨Λ ग़͢
ϓογϡ௨ͷͬ͘͟ΓΠϝʔδ ຊࣄલʹαʔόʔʹ1VTI4VCTDSJQUJPOΛૹ৴͓ͯ͘͠ 8FCϖʔδ αʔόʔ 4FSWJDF8PSLFS 1VTI4FSWJDF ྫ'$. POQVTI
ΫϥΠΞϯτଆͷ ࣮ͷϙΠϯτ͚ͩൈਮ
JOEFYKT 4FSWJDF8PSLFSͷొ 8FCϖʔδ
JOEFYKT 1VTI.BOBHFSΛऔಘ 8FCϖʔδ
JOEFYKT ϓογϡαʔϏεͷߪಡΛཁٻ 8FCϖʔδ
"QQMJDBUJPO4FSWFS,FZͷ࡞ٴͼ1VTI௨Λ؆୯ʹࢼͤΔ IUUQTXFCQVTIDPEFMBCHMJUDINF
TXKT QVTIΠϕϯτ͕དྷͨΒ௨Λग़͢ 4FSWJDF 8PSLFS
TXKT ௨ΛΫϦοΫͨ࣌͠ͷॲཧ࣮Մೳ 4FSWJDF 8PSLFS
ϖʔδΛดͯ͡௨
αʔόʔଆͷ࣮͕ඞཁͳͷͰେม
·ͱΊ ▸ σεΫτοϓ௨Λग़͢߹ɺ/PUJpDBUJPOT"1*Λ͏ ▸ ϖʔδ͕ดͯͯ͡௨Λग़͢ʹɺ4FSWJDF8PSLFSͷ1VTI"1*ͱΈ߹ Θͤͯ͏ αʔόʔαΠυͷ࣮͕ඞཁ ▸ ϖʔδ͕։͍ͯΔ࣌ʹ௨Λग़͢ͳΒɺ/PUJpDBUJPOT"1*ͷ/PUJpDBUJPO
ΠϯλϑΣʔεΛ͑؆୯ʹग़ͤΔ ▸ ؆୯ʹ௨Λग़͗͢͠ΔͱϢʔβʔʹݏΘΕΔͷͰ͍ํҙ
ৄ͘͠Γ͍ͨਓ ▸ 4FSWJDF8PSLFSͷհc8FC'VOEBNFOUBMT ▸ IUUQTEFWFMPQFSTHPPHMFDPNXFCGVOEBNFOUBMT QSJNFSTTFSWJDFXPSLFST IMKB ▸ 8FC1VTIΛʢͪΐͬͱʣৄ͘͠ղઆ͢ΔGVLVPLBQXB ▸
IUUQTTQFBLFSEFDLDPNQJSPTJLJDLXFCQVTIXPUJZPUVUP YJBOHTJLVKJFTIVPTVSVOVNCFSGVLVPLBQXB