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
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
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
59
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.6k
Other Decks in Technology
See All in Technology
OpenClawでPM業務を自動化
knishioka
1
280
AIエージェント時代に必要な オペレーションマネージャーのロールとは
kentarofujii
0
160
Zephyr(RTOS)でOpenPLCを実装してみた
iotengineer22
0
130
Change Calendarで今はOK?を仕組みにする
tommy0124
1
120
Blue/Green Deployment を用いた PostgreSQL のメジャーバージョンアップ
kkato1
0
150
非同期・イベント駆動処理の分散トレーシングの繋げ方
ichikawaken
1
150
DMBOKを使ってレバレジーズのデータマネジメントを評価した
leveragestech
0
420
Phase07_実務適用
overflowinc
0
2.1k
MCPで決済に楽にする
mu7889yoon
0
130
SaaSに宿る21g
kanyamaguc
2
180
PostgreSQL 18のNOT ENFORCEDな制約とDEFERRABLEの関係
yahonda
0
130
ADK + Gemini Enterprise で 外部 API 連携エージェント作るなら OAuth の仕組みを理解しておこう
kaz1437
0
210
Featured
See All Featured
Bash Introduction
62gerente
615
210k
Intergalactic Javascript Robots from Outer Space
tanoku
273
27k
Product Roadmaps are Hard
iamctodd
PRO
55
12k
How to Talk to Developers About Accessibility
jct
2
160
Crafting Experiences
bethany
1
94
Building Better People: How to give real-time feedback that sticks.
wjessup
370
20k
Six Lessons from altMBA
skipperchong
29
4.2k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Navigating Team Friction
lara
192
16k
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
130
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
200
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