Service Workerとは、それを使ってできること / what-is-service-worker

Slide 1

Slide 1 text

4FSWJDF8PSLFSͱ͸ ͦΕΛ࢖ͬͯͰ͖Δ͜ͱ ,BOB[BXBKT3FNPUF.FFUVQ 5PTIJIJTB5PNBUTV 1

Slide 2

Slide 2 text

֎দढ़ঘ 5PTIJIJTB5PNBUTV αΠϘ΢ζגࣜձࣾ ϑϩϯτΤϯυ ۚ୔ େֶଔۀ·Ͱ ˠ౦ژˠѪඤ !UPTIJUPNB !UPTIJ@@UPNB

Slide 3

Slide 3 text

4FSWJDF8PSLFSͱ͸ 3

Slide 4

Slide 4 text

4FSWJDF8PSLFS 48 8FCϖʔδͱ͸ผʹϒϥ΢βͷόοΫάϥ΢ϯυͰ ಈ࡞͢Δ+4ͷ࣮ߦ؀ڥͰ ϖʔδ͔ΒͷωοτϫʔΫϦΫΤετʹհೖͰ͖Δ 4

Slide 5

Slide 5 text

Α͘Θ͔Βͳ͍ 5

Slide 6

Slide 6 text

4FSWJDF8PSLFS 48 ᶃ8FCϖʔδͱ͸ผʹϒϥ΢βͷόοΫάϥ΢ϯυͰ ᶄಈ࡞͢Δ+4ͷ࣮ߦ؀ڥͰ ᶅϖʔδ͔ΒͷωοτϫʔΫϦΫΤετʹհೖͰ͖Δ 6

Slide 7

Slide 7 text

4FSWJDF8PSLFS 48 ᶃ8FCϖʔδͱ͸ผʹϒϥ΢βͷόοΫάϥ΢ϯυͰ ᶄಈ࡞͢Δ+4ͷ࣮ߦ؀ڥͰ ᶅϖʔδ͔ΒͷωοτϫʔΫϦΫΤετʹհೖͰ͖Δ 7

Slide 8

Slide 8 text

Ұൠతͳ8FCϖʔδ Ұൠతʹϒϥ΢βͰಈ͘+4͸ɺ8FCϖʔδͷ ϥΠϑλΠϜͷதͰ࣮ߦ ˠλϒΛดͨ͡Βɺऴྃ͢Δ 8FCϖʔδ +4 )5.- $44 8FCϖʔδ +BWB4DSJQUͷ࣮ߦ 8

Slide 9

Slide 9 text

8FCϖʔδͱ͸ผʹϒϥ΢βͷ όοΫάϥ΢ϯυ 48͸ɺϒϥ΢βͷཪͰಈ͘ͷͰ ϖʔδΛดͯ͡΋ੜଘ͢Δ 8FCϖʔδ 48 +4 +4 )5.- $44 8FCϖʔδ 4FSWJDF8PSLFS 9

Slide 10

Slide 10 text

4FSWJDF8PSLFS 48 ᶃ8FCϖʔδͱ͸ผʹϒϥ΢βͷόοΫάϥ΢ϯυͰ ᶄಈ࡞͢Δ+4ͷ࣮ߦ؀ڥͰ ᶅϖʔδ͔ΒͷωοτϫʔΫϦΫΤετʹհೖͰ͖Δ 10

Slide 11

Slide 11 text

+4ͷ࣮ߦ؀ڥ 8FC8PSLFS ผεϨουͰ+BWB4DSJQUΛ࣮ߦ͢Δ 11

Slide 12

Slide 12 text

4FSWJDF8PSLFS 48 ᶃ8FCϖʔδͱ͸ผʹϒϥ΢βͷόοΫάϥ΢ϯυͰ ᶄಈ࡞͢Δ+4ͷ࣮ߦ؀ڥͰ ᶅϖʔδ͔ΒͷωοτϫʔΫϦΫΤετʹհೖͰ͖Δ 12

Slide 13

Slide 13 text

ϦΫΤετʹհೖͰ͖Δ 8FCϖʔδ αʔόʔ BQJBSUJDMFT ʹΞΫηε 4FSWJDF8PSLFS APIϦΫΤετ΍ ϦιʔεͷϦΫΤετ͕͋Ε͹ɺ೚ҙͷ ॲཧΛ࣮ߦͰ͖ΔΑɻ ϦΫΤετΛൃߦ͢Δ͜ͱ΋Ͱ͖Δ 13

Slide 14

Slide 14 text

4FSWJDF8PSLFS 48 ͱ͸ 8FCϖʔδͱ͸ผʹϒϥ΢βͷόοΫάϥ΢ϯυͰ ಈ࡞͢Δ+4ͷ࣮ߦ؀ڥͰ ϖʔδ͔ΒͷωοτϫʔΫϦΫΤετʹհೖͰ͖Δ 14

Slide 15

Slide 15 text

ͪΐͬͱ෼͔Δؾ͕͢Δ 15

Slide 16

Slide 16 text

·ͩྑ͘Θ͔Βͳ͍ͷͰ 48Λ׆༻ͯ͠ΔαʔϏεΛݟͯ ΠϝʔδΛ෇͚Δ 16

Slide 17

Slide 17 text

48ΛऔΓೖΕ͍ͯΔ αʔϏε 17

Slide 18

Slide 18 text

4DSBQCPY ΦϑϥΠϯͰ΋ίϯ ςϯπΛӾཡՄೳ 18 IUUQTQSUJNFTKQNBJOIUNMSEQIUNM

Slide 19

Slide 19 text

5XJUUFS 8FCΞϓϦΛ 18"ͱͯ͠Πϯε τʔϧ πΠʔτ͕ˢ 19 IUUQTEFWFMPQFSTHPPHMFDPNXFCTIPXDBTFUXJUUFS

Slide 20

Slide 20 text

:PV5VCF ϖʔδΛ։͍ͯ ແͯ͘΋σεΫτοϓ ௨஌͕͘Δ 20

Slide 21

Slide 21 text

͜ΕΒ͸48Λϕʔεʹ ࣮ݱ͍ͯ͠Δ 21

Slide 22

Slide 22 text

48ͱ͸ ͦΕΛ࢖ͬͯͰ͖Δ͜ͱ 22

Slide 23

Slide 23 text

4FSWJDF8PSLFSͱ͸ 8FCϖʔδͷϥΠϑλΠϜΛ௒͑ͯ αʔϏε FH1VTI௨஌ɺΦϑϥΠϯମݧ ΛఏڙͰ͖Δ΋ͷ 8FCϖʔδ 48 +4 )5.- $44 8FCϖʔδͱ͸ผʹϒϥ΢βͷόοΫάϥ΢ϯυͰಈ࡞͢Δ+4ͷ࣮ߦ؀ڥ Ͱϖʔδ͔ΒͷωοτϫʔΫϦΫΤετʹհೖͰ͖Δ 23

Slide 24

Slide 24 text

4FSWJDF8PSLFSʓʓ w 4FSWJDF8PSLFS͚ͩͰϓογϡ௨஌΍ΦϑϥΠϯମݧͳͲ ͕ఏڙͰ͖ΔΘ͚Ͱ͸ͳ͍ w ΦϑϥΠϯମݧ w $BDIF"1*48 w ϓογϡ௨஌ w 1VTI"1*48 ϙΠϯτ͸ɺ48͸ϖʔδ ͱ͸ผͰϒϥ΢βͷόοΫάϥ΢ϯ υͰಈ࡞ͯ͠ɺϖʔδͷϦΫΤετ ΛϑοΫͰ͖Δ 24

Slide 25

Slide 25 text

2020/09/26 ֤ϒϥ΢βͷαϙʔτঢ়گ 25

Slide 26

Slide 26 text

Ͱ͖Δ͜ͱ ᶃ8FCϖʔδ͔Βαʔόʔ΁ͷϦΫΤετΛϑοΫͰ͖Δ ˠΩϟογϡͷ׆༻ ΦϑϥΠϯମݧɺදࣔ଎౓ͷߴ଎Խ ᶄ8FCϖʔδΛ։͍ͯແͯ͘΋ɺಛఆͷॲཧΛߦ͑Δ ˠϓογϡ௨஌ ᶅ48ΛΠϯετʔϧͯ͠ɺ8FCΞϓϦΛ18"ͱͯ͠Πϯετʔϧ ˠ"EEUP)PNF4DSFFO ")4 ChromeɾEdge Firefox Safari Firefox Safari Firefox ChromeɾEdge ChromeɾEdge 26

Slide 27

Slide 27 text

ᶃ8FCϖʔδ͔Βαʔόʔ΁ͷϦΫΤ ετΛϑοΫͰ͖ΔˠΦϑϥΠϯମݧ 8FCϖʔδ αʔόʔ JOEFYIUNM͍ͩ͘͞ ʹΞΫηε 4FSWJDF8PSLFS ࣄલʹϦιʔεΛ Ωϟογϡ͓͍͔ͯͨ͠Βɺ ΦϑϥΠϯͰ΋ϦιʔεΛ ฦͤΔͶ $BDIF 27

Slide 28

Slide 28 text

ᶃ8FCϖʔδ͔Βαʔόʔ΁ͷϦΫΤ ετΛϑοΫͰ͖Δˠදࣔ଎౓ͷߴ଎Խ ᶃΩϟογϡϑΝʔετ ᶃωοτϫʔΫϑΝʔετ ଞʹ΋͍͔ͭ͘ Ωϟογϡઓུ͕͋Δ 28

Slide 29

Slide 29 text

͋·Γසൟʹ಺༰͕ߋ৽͞Εͳ͍ Ϧιʔε΍σʔλ͸ Ωϟογϡ͔Βฦͤ͹ྑ͍Ͷʂ 29

Slide 30

Slide 30 text

ᶃΩϟογϡϑΝʔετ 8FCϖʔδ αʔόʔ JOEFYIUNM͍ͩ͘͞ ʹΞΫηε 4FSWJDF8PSLFS Cache͋Δ͔ΒɺCache͔Βฦ͢Ͷ $BDIF 30

Slide 31

Slide 31 text

ɹᶃΩϟογϡϑΝʔετ 8FCϖʔδ αʔόʔ JOEFYIUNM͍ͩ͘͞ ʹΞΫηε 4FSWJDF8PSLFS Cacheແ͍ͳΒαʔόʔʹϦΫΤε τ͢ΔΑ $BDIF 'FUDI"1* JOEFYIUNM 31

Slide 32

Slide 32 text

සൟʹ಺༰͕ߋ৽͞Εͦ͏ͳ৘ใ͸ʁ 32

Slide 33

Slide 33 text

ᶃωοτϫʔΫϑΝʔετ 8FCϖʔδ αʔόʔ GPPIUNM͍ͩ͘͞ GPPʹΞΫηε 4FSWJDF8PSLFS ·ͣ͸αʔόʔʹ ϦΫΤετ͢ΔΑ 'FUDI"1* GPPIUNM $BDIF 33

Slide 34

Slide 34 text

ɹᶃωοτϫʔΫϑΝʔετ 8FCϖʔδ αʔόʔ GPPIUNM͍ͩ͘͞ GPPʹΞΫηε 4FSWJDF8PSLFS OfflineͳΒCache͔Βฦ͢Α $BDIF 34

Slide 35

Slide 35 text

ᶄ8FCϖʔδΛ։͍ͯແͯ͘΋ɺ ಛఆͷॲཧΛߦ͑Δˠϓογϡ௨஌ 8FCϖʔδ αʔόʔ 4FSWJDF8PSLFS 1VTI4FSWJDF 35

Slide 36

Slide 36 text

ᶄ8FCϖʔδΛ։͍ͯແͯ͘΋ɺ ಛఆͷॲཧΛߦ͑Δˠϓογϡ௨஌ 8FCϖʔδ αʔόʔ 4FSWJDF8PSLFS 1VTI4FSWJDF 36 ϖʔδΛ։͍ͯແͯ͘ ΋ɺ1VTI4FSWJDF͔Β ͷ௨஌Λड͚औΕΔΑ

Slide 37

Slide 37 text

ᶄ8FCϖʔδΛ։͍ͯແͯ͘΋ɺ ಛఆͷॲཧΛߦ͑Δˠϓογϡ௨஌ 8FCϖʔδ αʔόʔ 4FSWJDF8PSLFS 1VTI4FSWJDF 37 '$. 'JSFCBTF$MPVE.FTTBHJOH '$.Λ࢖͏ͷ͕Ұൠత ϖΠϩʔυͷ҉߸ԽͳͲ໘౗ͳ ॲཧΛ೚ͤΕΔ

Slide 38

Slide 38 text

ᶅ48ΛΠϯετʔϧͯ͠ 8FCΞϓϦΛ18"ͱͯ͠Πϯετʔϧ ˠ"EEUP)PNF4DSFO ")4 38

Slide 39

Slide 39 text

39 ᶅ48ΛΠϯετʔϧͯ͠ 8FCΞϓϦΛ18"ͱͯ͠Πϯετʔϧ ˠ"EEUP)PNF4DSFO ")4

Slide 40

Slide 40 text

40 ᶅ48ΛΠϯετʔϧͯ͠ 8FCΞϓϦΛ18"ͱͯ͠Πϯετʔϧ ˠ"EEUP)PNF4DSFO ")4

Slide 41

Slide 41 text

18" 41

Slide 42

Slide 42 text

18"ͱ͸ʁ w 1SPHSFTTJWF8FC"QQT w ৽͍͠"1*ͱϓϩάϨογϒͳ֦ுઓུΛ࢖༻ͯ͠ɺΫϩεϓϥοτ ϑΥʔϜͳ΢ΣϒΞϓϦ w 8FCΞϓϦͰωΠςΟϒΞϓϦͷΑ͏ͳϢʔβʔମݧΛఏڙ͢Δ 3FMJBCMF *OUFHSBUFE 'BTU &OHBHJOH w ϞόΠϧˠϞόΠϧΞϓϦ w 1$ˠσεΫτοϓΞϓϦ 42

Slide 43

Slide 43 text

18"ͱ͸ʁ w ϞόΠϧ΢Σϒʹ͓͚ΔϢʔβʔମݧͷ޲্ w 'BTU ߴ଎ ΢ΣϒΞϓϦͷίϯςϯπΛߴ଎ʹఏڙ͢Δ w *OUFHSBUFE ౷߹ σόΠε΍04ʹ߹Θͤͨମݧ w 3FMJBCMF ৴པ ௿଎ͳωοτϫʔΫ΍ΦϑϥΠϯͰ΋ར༻Մೳ w &OHBHJOH Τϯήʔδ ୺຤ʹΠϯετʔϧՄೳɺϓογϡ௨஌ 43

Slide 44

Slide 44 text

18"ͷಋೖࣄྫ w 466.0 w ಡΈࠐΈ࣌ؒΛ୹ॖɺϓογϡ௨஌ͷ։෧཰ IUUQTEFWFMPQFSTHPPHMFDPNXFCTIPXDBTFTVVNP w 5XJUUFS w πΠʔτ਺૿Ճɺ௚ؼ཰ݮগ IUUQTEFWFMPQFSTHPPHMFDPNXFCTIPXDBTFUXJUUFS w ೔ܦ w ίϯόʔδϣϯ ձһొ࿥ ૿Ճɺ೔ͷΞΫςΟϒϢʔβʔ਺૿Ճ IUUQTEFWFMPQFSTHPPHMFDPNXFCTIPXDBTFOJLLFJ 44

Slide 45

Slide 45 text

18"ͷ࡞Γํ 8FCΞϓϦΛ࡞Δ 4FSWJDF8PSLFSΛΠϯετʔϧ͢Δ NBOJGFTUKTPOΛ࡞੒ͯ͠MJOLλάͰಡΈࠐ· ͤΔ 45

Slide 46

Slide 46 text

18"Ͱͷମݧ w 48Λج൫ʹͨ͠8FCͷٕज़ͱ૊Έ߹ΘͤΔ͜ͱͰɺωΠςΟ ϒΞϓϦͷΑ͏ͳମݧΛఏڙՄೳ w ϓογϡ௨஌ w ϗʔϜը໘΁ͷΠϯετʔϧ w ΦϑϥΠϯͰͷӾཡ w ωΠςΟϒΞϓϦͷΑ͏ͳߴ଎ͳදࣔ 46

Slide 47

Slide 47 text

18"ͷϝϦοτɾσϝϦοτ w ϝϦοτ w 8FCʹ௥ՃͰ͔͔ΔωΠςΟϒΞϓϦ։ൃίετ͕௿͍ w ωΠςΟϒετΞ͔ΒͷΠϯετʔϧ͕ෆཁ w ετΞͷ৹͕ࠪෆཁϢʔβʔ͕Ξοϓσʔτ͢ΔλΠϛϯάΛؾʹ͠ͳͯ͘ྑ͍ w σϝϦοτ w ΞϓϦετΞܦ༝Ͱͷू٬͕Ͱ͖ͳ͍ 58" w J04Ͱ͸Ұ෦ػೳ੍͕ݶ͞ΕΔ w ωΠςΟϒͷମݧʹྼΔ෦෼͸΋ͪΖΜ͋Γͦ͏ ैདྷͷ8FCͷ Ԇ௕ઢ্Ͱগͣͭ͠௥Ճ͍͚ͯ͠Δ 47

Slide 48

Slide 48 text

18" 8FCͰྑ͍ମݧΛఏڙ͍ͯ͜͠͏ɻ 48

Slide 49

Slide 49 text

ͦͷଞ࠷ۙͷಈ޲ 49

Slide 50

Slide 50 text

ݱঢ়ͱࠓޙͷมԽ 8FCΞϓϦ 4FSWJDF8PSFLS ৽͍͠ "1* ৽͍͠ "1* ৽͍͠ "1* 48্Ͱ࣮ݱͰ͖Δ "1*͕૿͍͑ͯ͘ ؆୯ʹ͔͚Δ Α͏ʹ ϕʔεʹͳΔ ߟ͑΍ٕज़͸ ग़དྷ্͕ͬͯͦ͏ 50

Slide 51

Slide 51 text

؆୯ʹ͔͚ΔΑ͏ʹ w 8PSLCPY w IUUQTEFWFMPQFSTHPPHMFDPNXFCUPPMTXPSLCPY w 4FSWJDF8PSLFSʹؔ࿈͢Δɺ༷ʑͳॲཧΛ ؆୯ʹ࣮૷Ͱ͖ΔϥΠϒϥϦ w ๛෋ͳ1MVHJO͕༻ҙ͞Ε͍ͯΔ 51

Slide 52

Slide 52 text

48Ͱ#BDLHSPVOEॲཧ w #BDLHSPVOE'FUDI w όοΫάϥ΢ϯυͰσʔλΛऔಘͰ͖Δ w #BDLHSPVOE4ZOD w ΦϑϥΠϯ࣌ʹࣦഊͨ͠ϦΫΤετΛ෮ؼ࣌ʹ࠶࣮ߦͰ͖Δ w 1FSJPEJD#BDLHSPVOE4ZOD w όοΫάϥ΢ϯυͰλεΫΛఆظ࣮ߦͰ͖Δ 52

Slide 53

Slide 53 text

༷ʑͳϓϥοτϑΥʔϜͰ18" w σεΫτοϓ18" $ISPNF04 8JOEPXT -JOVY NBD04 w 8JOEPXTͰͷ18" w IUUQTXXXTMJEFTIBSFOFUPTBNVNQXBPOXJOEPXT w 5SVTUFE8FC"DUJWJUZ 58" w ಛఆͷ৚݅΍1MBZετΞͷϙϦγʔʹै͏͜ͱͰ18"͔Β"1,Λ࡞੒ ͯ͠(PPHMF1MBZʹొ࿥Մೳ w CVCCMFXSBQͱ͍͏$-*πʔϧ΋༻ҙ͞Ε͍ͯΔ 53

Slide 54

Slide 54 text

8FCͷ৽͍͠"1*ͱ૊Έ߹Θͤͯ ΑΓωΠςΟϒΞϓϦͷΑ͏ͳମݧ΁ w 8FC4IBSF8FC4IBSF5BSHFU w 4.4 $POUBDU1JDLFS /BUJWF'JMF4ZTUFN w 4IPSUDVUT #BEHJOH w &UDʜ 54

Slide 55

Slide 55 text

J04Ͱͷ18" w J04 w ")4͕ར༻Մೳʹ w 4FSWJDF8PSLFS͕ΠϯετʔϧͰ͖ΔΑ͏ʹ w 0BVUIͰͷϩάΠϯ࣌ʹ4BGSJ͕ىಈ18"͔Β ೝূ৘ใʹΞΫηεͰ͖ͳ͍ w J04 w 0BVUIϩάΠϯ࣌ʹ18"಺΢Οϯυ΢͕ ্ཱ͕ͪΔೝূ৘ใ͕࢖͑Δ J04Ͱ΋18" ˞ 48ͷ1VTI"1*͸ ࢖͑ͳ͍ 55

Slide 56

Slide 56 text

·ͱΊ w 4FSWJDF8PSLFSͱ͸ w 8FCϖʔδͷϥΠϑλΠϜΛ௒͑ͯαʔϏεΛఏڙͯ͘͠ΕΔ 8PSLFS w 48Λ࢖͑͹ w ΦϑϥΠϯମݧ΍ϓογϡ௨஌ɺ18"ͱͯ͠ͷΠϯετʔϧͳ ͲωΠςΠϒΞϓϦʹ͍ۙ͜ͱΛ8FCΞϓϦͰ΋ఏڙͰ͖Δ 56