Svelte Runtime 101 (JSConf JP 2022)

4WFMUF3VOUJNF CBTFCBMMZBNB

ର৅ಡऀ - 4WFMUFʹڵຯ͕͋Δํ - ͳͥ4WFMUF͕ߴ଎Ͱ͋Δ͔Λཧղ͍ͨ͠ํ - 4WFMUFʹίϯτϦϏϡʔτͯ͠Έ͍ͨํ

͜ͷൃදͰಘΒΕΔ͜ͱ - 4WFMUF͕ߴ଎Ͱ͋Δཧ༝Λ۩ମతʹཧղͰ͖Δ ˠʮԾ૝%0.͕ͳ͍͔Β଎͍ʯͱ͍͏ந৅తͳཧղ͔Βͷ୤٫ - 4WFMUFΛಋೖ͢ΔϋʔυϧΛԼ͛Δ͜ͱ͕Ͱ͖Δ ˠ࢓૊ΈΛཧղ͍ͯ͠Ε͹՝୊͕ൃੜͯ͠΋ࣗྗͰղܾͰ͖Δ

લఏ஌ࣝ +BWB4DSJQU͕ಡΊΔਓ

ຊ೔ͷίʔε - 8IBUJT4WFMUF - )PXUPHFU4WFMUF3VOUJNF$PEF - 4WFMUF3VOUJNF

࿩͞ͳ͍͜ͱ - )ZESBUJPO443࣌ͷϥϯλΠϜͷಈ࡞ ˠ෼Ͱ͸͜͜·Ͱ౸ୡͰ͖ͳ͍ͷͰࠓճ͸͠·ͤΜɻ - 4WFMUFίϯύΠϥࣗମͷ࢓૊Έ

ࣗݾ঺հ

ࣗݾ঺հ - ࢁԼ ༟Ұ࿕Ͱ͢ - CBTFCBMMZBNBͱ͍͏໊લͰ׆ಈ͍ͯ͠·͢ - גࣜձࣾϑϥΠϧͷιϑτ΢ΣΞΤϯδχΞͰ͢ - 4WFMUFͷϝϯςφͰ͢
- 5XJJUFS !CBTFCBMMZBNB@ ࠷ޙ͕Ξϯμʔόʔ - (JU)VC CBTFCBMMZBNB

ඵ͚ͩձࣾͷ͜ͱ ঺հ͍ͤͯͩ͘͞͞

גࣜձࣾϑϥΠϧ ࢖༻ٕज़

஥ؒΛืूதͰ͢ IUUQTIFSQDBSFFSTWGMZMF

গ͠Ͱ΋ڵຯΛ࣋ͬͯ௖͍ͨํ͸ɺ 4QFDJBM$IBU΍ 5XJUUFSͷ%.Ͱ੠Λ͔͚ͯ௖͚Δͱخ͍͠Ͱ͢ ໪࿦ 4WFMUF-PWFST ΋ 4QFDJBM$IBUͰ୔ࢁ͓͠Ό΂Γ͠·͠ΐ͏

8IBUJT4WFMUF

4WFMUFͱ͸

/PWJSUVBM%0. Ծ૝%0.͕୲͏૬౰ͷॲཧΛίϯύΠϧ࣌఺Ͱॲཧ͢Δ ˠ݁ՌόϯυϧαΠζ͕খ͘͞ͳΔ 8SJUFMFTTDPEF5SVMZSFBDUJWF ߏจ͕γϯϓϧͰ͋Δ ˠ4WFMUF͸ 3FBDUͷ ⒟ͷ࣮૷ྔ

3FBDU 4WFMUF

)PXUPHFU 4WFMUF3VOUJNF$PEF

4WFMUFͷϥϯλΠϜίʔυ͸Ͳ͏΍ͬͨΒݟΕΔͷ ࠓճ͸ͭͷํ๏Λ঺հ͠·͢ - 4WFMUF3&1-Ͱ֬ೝ͢Δํ๏ - 7JUFͰϏϧυ͢Δํ๏

4WFMUF3&1-Ͱ֬ೝ͢Δํ๏ IUUQTTWFMUFEFWSFQM

7JUFͰϏϧυ͢Δํ๏ IUUQTWJUFOFXTWFMUFUT WJUFDPOGJHUT FYQPSU EFGBVMU EFGJOF$POGJH \ ҎԼΛ௥Ճ CVJME \
NJOJGZ GBMTF SPMMVQ0QUJPOT \ PVUQVU \ FOUSZ'JMF/BNFT <OBNF>KT ^ ^ ^ ^ ࣍ͷίϚϯυΛ࣮ߦ OQY WJUF CVJMErXBUDI

#BTJDPG4WFMUF3VOUJNF

ࠓճ͸؆୯ͳ4WFMUFίϯϙʔωϯτ͕ ͲΜͳϥϯλΠϜίʔυʹͳΔͷ͔Λ ݟ͍͖ͯ·͠ΐ͏

OBNF͕มߋ͞ΕΔ౓ʹ Iλάͷ಺༰͕ߋ৽͞ΕΔίϯϙʔωϯτ TDSJQU FYQPSU MFU OBNF XPSME TDSJQU I)FMMP\OBNF^I

͜ͷίʔυΛίϯύΠϧ͢Δͱ ͜ͷΑ͏ͳϥϯλΠϜίʔυʹͳΓ·͢ ॏཁͳՕॴͷΈൈਮ

DMBTT "QQ FYUFOET 4WFMUF$PNQPOFOU \ DPOTUSVDUPS PQUJPOT \ TVQFS
JOJU UIJT PQUJPOT JOTUBODF DSFBUF@GSBHNFOU TBGF@OPU@FRVBM \OBNF ^ ^ ^ GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU \OBNF XPSME ^QSPQT TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ SFUVSO <OBNF> ^

N UBSHFU BODIPS \ JOTFSU UBSHFU I BODIPS BQQFOE
I U BQQFOE I U BQQFOE I U ^ Q DUY <EJSUZ> \ JG EJSUZ OBNF TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI I ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU I MFU U MFU U MFU U SFUVSO \ D \ I FMFNFOU I U UFYU )FMMP U UFYU OBNF DUY<> U UFYU ^

࠷ॳͷײ૝͸

ίʔυྔ͕গͳ͍

͜ΕͳΒཧղͰ͖ͦ͏

ॱ൪ʹઆ໌͠·͢

ຕ໨ Ϋϥεͱ JOTUBODFؔ਺

JOJU UIJT PQUJPOT JOTUBODF DSFBUF@GSBHNFOU TBGF@OPU@FRVBM \OBNF ^ ^ ^ GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU \OBNF XPSME ^QSPQT TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ SFUVSO <OBNF> ^

JOJU UIJT PQUJPOT JOTUBODF DSFBUF@GSBHNFOU TBGF@OPU@FRVBM \OBNF ^ ^ ^ GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU \OBNF XPSME ^QSPQT TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ SFUVSO <OBNF> ^ 4WFMUFίϯϙʔωϯτ͸Ϋϥε ʹίϯύΠϧ͞Ε·͢ ίϯετϥΫλʹ͸ϨϯμϦϯά͢Δ৔ॴ΍ QSPQTͳͲΛ౉͠·͢ ࢀর 4WFMUFυΩϡϝϯτ

JOJU UIJT PQUJPOT JOTUBODF DSFBUF@GSBHNFOU TBGF@OPU@FRVBM \OBNF ^ ^ ^ GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU \OBNF XPSME ^QSPQT TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ SFUVSO <OBNF> ^ JOJUؔ਺͸ओʹҎԼͷͭΛ࣮ࢪ͠·͢ɻ AJOTUBODFAؔ਺ ୈҾ਺ Λ༻͍ͯίϯϙʔωϯτ಺εςʔτΛॳظԽ͢Δ ADSFBUF@GSBHNFOUAؔ਺ ୈҾ਺ Λ༻͍ͯ%0.Λඳը͢Δ ޙͰৄࡉΛઆ໌ JOJUؔ਺Λܦͯɺશͯͷঢ়ଶ͸ AUIJTAʹΞλον͞ΕΔ

JOJU UIJT PQUJPOT JOTUBODF DSFBUF@GSBHNFOU TBGF@OPU@FRVBM \OBNF ^ ^ ^ GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU \OBNF XPSME ^QSPQT TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ SFUVSO <OBNF> ^ ͜Ε͸ͳʹ

JOJU UIJT PQUJPOT JOTUBODF DSFBUF@GSBHNFOU TBGF@OPU@FRVBM \OBNF ^ ^ ^ GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU \OBNF XPSME ^QSPQT TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ SFUVSO <OBNF> ^ "QQΫϥεͷΠϯελϯε

JOJU UIJT PQUJPOT JOTUBODF DSFBUF@GSBHNFOU TBGF@OPU@FRVBM \OBNF ^ ^ ^ GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU \OBNF XPSME ^QSPQT TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ SFUVSO <OBNF> ^ ίϯϙʔωϯτʹ౉͢ QSPQT ࠓճͷྫͷ৔߹͸ OBNF TDSJQU FYQPSU MFU OBNF XPSME TDSJQU I)FMMP\OBNF^I

JOJU UIJT PQUJPOT JOTUBODF DSFBUF@GSBHNFOU TBGF@OPU@FRVBM \OBNF ^ ^ ^ GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU \OBNF XPSME ^QSPQT TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ SFUVSO <OBNF> ^ εςʔτ͕ߋ৽͞ΕͨࡍͷॲཧΛ࣮ߦ͢Δؔ਺ Ҿ਺ AOBNFAΛઃఆ͢Δͱ UIJTTFUؔ਺ΛݺͿ ͱ TFUؔ਺͕࣮ߦ͞ΕΔɻ // set 関数 $set($$props) { if (this.$$set && !is_empty($$props)) { this.$$.skip_bound = true; this.$$set($$props); this.$$.skip_bound = false; } }

J SFU SFTU \ DPOTU WBMVF SFTUMFOHUI SFTU<>SFU JG
DUY OPU@FRVBM DUY<J> DUY<J>WBMVF \ JG TLJQ@CPVOE CPVOE<J> CPVOE<J> WBMVF JG SFBEZ NBLF@EJSUZ DPNQPOFOU J ^ SFUVSO SFU ^ JOWBMJEBUFؔ਺ͷத਎ ྫ

DUY OPU@FRVBM DUY<J> DUY<J>WBMVF \ JG TLJQ@CPVOE CPVOE<J> CPVOE<J> WBMVF JG SFBEZ NBLF@EJSUZ DPNQPOFOU J ^ SFUVSO SFU ^ JOWBMJEBUFؔ਺ͷத਎ ࠓճηοτ͞Εͨ஋͕લճͱҧ͏஋ͩͬͨΒ

DUY OPU@FRVBM DUY<J> DUY<J>WBMVF \ JG TLJQ@CPVOE CPVOE<J> CPVOE<J> WBMVF JG SFBEZ NBLF@EJSUZ DPNQPOFOU J ^ SFUVSO SFU ^ JOWBMJEBUFؔ਺ͷத਎ ʮͲͷίϯϙʔωϯτ DPNQPOFOU ʯͷ ʮͲͷεςʔτ J ʯ͕ มߋ͞ΕͨΑɺͱ͍͏͜ͱΛهԱ͢Δ

GVODUJPO NBLF@EJSUZ DPNQPOFOU J \ JG DPNQPOFOUEJSUZ<> \ EJSUZ@DPNQPOFOUTQVTI DPNQPOFOU
TDIFEVMF@VQEBUF DPNQPOFOUEJSUZGJMM ^ DPNQPOFOUEJSUZ<J c>c J ^ NBLF@EJSUZؔ਺ͷத਎

TDIFEVMF@VQEBUF DPNQPOFOUEJSUZGJMM ^ DPNQPOFOUEJSUZ<J c>c J ^ NBLF@EJSUZؔ਺ͷத਎ มߋ͞ΕͨίϯϙʔωϯτҰཡ؅ཧΦϒδΣΫτ ʹొ࿥ͯ͠

TDIFEVMF@VQEBUF DPNQPOFOUEJSUZGJMM ^ DPNQPOFOUEJSUZ<J c>c J ^ NBLF@EJSUZؔ਺ͷத਎ %0.൓өεέδϡʔϥʔΛىಈ GVODUJPO TDIFEVMF@VQEBUF \ JG VQEBUF@TDIFEVMFE \ VQEBUF@TDIFEVMFE USVF SFTPMWFE@QSPNJTFUIFO GMVTI ^ ^ ࣍ͷϚΠΫϩλεΫͰ%0.൓өॲཧΛ࣮ߦ͢Δ GMVTIؔ਺ͷதͰ͸ɺEJSUZ@DPNQPOFOUT Λݟͯ %0.ߋ৽ॲཧΛݺΜͰ͍͘ ৄࡉͳઆ໌͸ׂѪ

TDIFEVMF@VQEBUF DPNQPOFOUEJSUZGJMM ^ DPNQPOFOUEJSUZ<J c>c J ^ NBLF@EJSUZؔ਺ͷத਎ ʲࡉ͔͍࿩ʳ ίϯϙʔωϯτ಺ͷεςʔτͰԿ͕มߋ͞Εͨͷ؅ཧʹ͸ Ϗοτԋࢉ͕༻͍ΒΕ͍ͯΔɻ ྫ͑͹ɺ<GPP CBS CB[>ͱ͍͏εςʔτ͕͋ͬͯɺ GPPͱ CB[ ͕ߋ৽͞Εͨ৔߹ɺEJSUZͷ஋͸ ʹͳΔ ਐ਺Ͱ

Α͏΍͘ JOTUBODFؔ਺ʹ໭ͬͯ

JOJU UIJT PQUJPOT JOTUBODF DSFBUF@GSBHNFOU TBGF@OPU@FRVBM \OBNF ^ ^ ^ GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU \OBNF XPSME ^QSPQT TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ SFUVSO <OBNF> ^ εςʔτ͸഑ྻͰ؅ཧ͍ͯ͠Δ UIJTDUYʹ୅ೖ͞ΕΔ

͜͜·Ͱͷ·ͱΊ

JOJU UIJT PQUJPOT JOTUBODF DSFBUF@GSBHNFOU TBGF@OPU@FRVBM \OBNF ^ ^ ^ GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU \OBNF XPSME ^QSPQT TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ SFUVSO <OBNF> ^ • 4WFMUFίϯϙʔωϯτ͸ΫϥεʹͳΔ • ίϯϙʔωϯτͷεςʔτ͸ UIJTDUYΛݟΕ͹Α͍ • εςʔτ͕มԽ͢Δ౓ʹ JOWBMJEBUFؔ਺͕ݺ͹ΕΔ • JOWBMJEBUFؔ਺͔Β࠷ऴతʹ͸%0.ߋ৽ॲཧ GMVTIؔ ਺ ͕ݺ͹ΕΔ

Α͏΍͘ຕ໨ͷઆ໌͕ऴΘΓ·ͨ͠

͋ͱ൒෼ ؤுΓ·͠ΐ͏

ຕ໨ DSFBUF@GSBHNFOUؔ਺

JOJU UIJT PQUJPOT JOTUBODF DSFBUF@GSBHNFOU TBGF@OPU@FRVBM \OBNF ^ ^ ^ GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU \OBNF XPSME ^QSPQT TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ SFUVSO <OBNF> ^ ͜Ε͸ͳʹ

I U BQQFOE I U BQQFOE I U ^ Q DUY <EJSUZ> \ JG EJSUZ OBNF TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI I ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU I MFU U MFU U MFU U SFUVSO \ D \ I FMFNFOU I U UFYU )FMMP U UFYU OBNF DUY<> U UFYU ^

େ͖͘ύʔτʹ෼͚·͢

I U BQQFOE I U BQQFOE I U ^ Q DUY <EJSUZ> \ JG EJSUZ OBNF TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI I ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU I MFU U MFU U MFU U SFUVSO \ D \ I FMFNFOU I U UFYU )FMMP U UFYU OBNF DUY<> U UFYU ^ DDSFBUFؔ਺

I U BQQFOE I U BQQFOE I U ^ Q DUY <EJSUZ> \ JG EJSUZ OBNF TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI I ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU I MFU U MFU U MFU U SFUVSO \ D \ I FMFNFOU I U UFYU )FMMP U UFYU OBNF DUY<> U UFYU ^ NNPVOUؔ਺

I U BQQFOE I U BQQFOE I U ^ Q DUY <EJSUZ> \ JG EJSUZ OBNF TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI I ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU I MFU U MFU U MFU U SFUVSO \ D \ I FMFNFOU I U UFYU )FMMP U UFYU OBNF DUY<> U UFYU ^ QVQEBUFؔ਺

I U BQQFOE I U BQQFOE I U ^ Q DUY <EJSUZ> \ JG EJSUZ OBNF TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI I ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU I MFU U MFU U MFU U SFUVSO \ D \ I FMFNFOU I U UFYU )FMMP U UFYU OBNF DUY<> U UFYU ^ EEFUBDIؔ਺

ύʔτͣͭઆ໌͍͖ͯ͠·͢

I U BQQFOE I U BQQFOE I U ^ Q DUY <EJSUZ> \ JG EJSUZ OBNF TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI I ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU I MFU U MFU U MFU U SFUVSO \ D \ I FMFNFOU I U UFYU )FMMP U UFYU OBNF DUY<> U UFYU ^ GVODUJPO FMFNFOU OBNF \ SFUVSO EPDVNFOUDSFBUF&MFNFOU OBNF ^ GVODUJPO UFYU EBUB \ SFUVSO EPDVNFOUDSFBUF5FYU/PEF EBUB ^ DDSFBUFؔ਺ ίϯϙʔωϯτͰ࢖༻͢ΔશͯͷཁૉΛ࡞੒ JOJUؔ਺͔Βݺ͹ΕΔɻ

I U BQQFOE I U BQQFOE I U ^ Q DUY <EJSUZ> \ JG EJSUZ OBNF TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI I ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU I MFU U MFU U MFU U SFUVSO \ D \ I FMFNFOU I U UFYU )FMMP U UFYU OBNF DUY<> U UFYU ^ GVODUJPO JOTFSU UBSHFU OPEF BODIPS \ UBSHFUJOTFSU#FGPSF OPEF BODIPS ccOVMM ^ GVODUJPO BQQFOE UBSHFU OPEF \ UBSHFUBQQFOE$IJME OPEF ^ NNPVOUؔ਺ DSFBUFؔ਺Ͱ࡞੒ͨ͠ཁૉΛ%0.ʹϚ΢ϯτ UBSHFUBODIPS͔ΒཁૉͷૠೖҐஔΛಛఆ JOJUؔ਺͔Βݺ͹ΕΔɻ

I U BQQFOE I U BQQFOE I U ^ Q DUY <EJSUZ> \ JG EJSUZ OBNF TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI I ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU I MFU U MFU U MFU U SFUVSO \ D \ I FMFNFOU I U UFYU )FMMP U UFYU OBNF DUY<> U UFYU ^ GVODUJPO TFU@EBUB UFYU EBUB \ EBUB EBUB JG UFYUXIPMF5FYU EBUB UFYUEBUB EBUB ^ QVQEBUFؔ਺ ߋ৽͞Εͨঢ়ଶʹӨڹͷ͋ΔཁૉΛ࠷৽Խ DUY ίϯϙʔωϯτͷεςʔτ EJSUZ มߋ͕͋ͬͨεςʔτΛ؅ཧ͢Δม਺ JOWBMJEBUFؔ਺Ͱ࠷ऴతʹݺͼग़͞ΕΔ GMVTIؔ਺ ͔Βݺ͹ΕΔɻ ิ଍ ͜ͷίϯϙʔωϯτ͕ࢠίϯϙʔωϯτΛ͍࣋ͬͯΔ৔߹ɺ ࢠίϯϙʔωϯτͷ TFUؔ਺ΛݺͿɻ

I U BQQFOE I U BQQFOE I U ^ Q DUY <EJSUZ> \ JG EJSUZ OBNF TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI I ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU I MFU U MFU U MFU U SFUVSO \ D \ I FMFNFOU I U UFYU )FMMP U UFYU OBNF DUY<> U UFYU ^ GVODUJPO EFUBDI OPEF \ OPEFQBSFOU/PEFSFNPWF$IJME OPEF ^ EEFUBDIؔ਺ %0.ʹϚ΢ϯτͨ͠શͯͷཁૉΛ%0.͔Β࡟আ ਌ίϯϙʔωϯτͷ VQEBUFؔ਺΍ Ϋϥεͷ EFTUSPZ ؔ਺͔Βݺ͹ΕΔɻ ิ଍ EFUBDIJOH͸جຊతʹ͸ USVF͕ͩ ਌ཁૉ͕ͳ͍ͳͲͷ৔߹ʹ GBMTF͕ઃఆ͞ΕΔ͜ͱ͕͋Δ

΄ͱΜͲ %0.ૢ࡞ "1*ΛݺΜͰ͍Δ͚ͩ

͜͜·Ͱొ৔ͨ͠ॲཧΛ ࠶੔ཧͨ͠ͷ͕ͪ͜Β

DPOTU BQQ OFX "QQ \^ JOJU UIJT PQUJPOT JOTUBODF
DSFBUF@GSBHNFOU TBGF@OPU@FRVBM \OBNF ^ TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ JOJUؔ਺ͷதͰ࣮ߦ NBLF@EJSUZ DPNQPOFOU J TDIFEVMF@VQEBUF GMVTI BQQTFU ΋͘͠͸ VQEBUFؔ਺͔Βݺ͹ΕΔ DSFBUF NPVOUFE VQEBUF EFTUSPZ ผͷϚΠΫϩλεΫͰ࣮ߦ

4WFMUF,JU ͕·΋ͳ͘όʔδϣϯʹͳΓ·͢ɻ 4WFMUF͸ 4WFMUF,JU ͱҰॹʹ࢖͏͜ͱ͕ਪ঑͞Ε͍ͯ·͢ɻ ·ͩ৮͍ͬͯͳ͍ਓ͸ੋඇ৮ͬͯΈ͍ͯͩ͘͞ɻ

͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠

஥ؒΛืूதͰ͢ IUUQTIFSQDBSFFSTWGMZMF

΋͕࣌ؒ͠༨Ε͹ʜ

%FFQ%JWFJOUP4WFMUF 3VOUJNF

AOBNFAΛߋ৽͢ΔίʔυΛ௥Ճͯ͠Έ·͢ TDSJQU FYQPSU MFU OBNF XPSME DPOTU VQEBUF
OBNF VQEBUFE TDSJQU I)FMMP\OBNF^I CVUUPO PODMJDL\VQEBUF^$MJDLCVUUPO

ίϯύΠϧ͢Δͱʜ

JOTUBODFؔ਺

GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU \OBNF XPSME ^QSPQT
DPOTU VQEBUF JOWBMJEBUF OBNF VQEBUFE TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ SFUVSO <OBNF VQEBUF> ^ DPOTU VQEBUF OBNF VQEBUFE ͱ࣮૷ͨؔ͠਺͸ɺAJOWBMJEBUFAؔ਺Ͱϥοϓ͞Εͨɻ ίϯύΠϧ࣌ʹɺؔ਺͕Ͳͷঢ়ଶΛมߋ͢Δ͔Λೝࣝ͢Δɻ ࠓճͷ৔߹ɺAVQEBUFAؔ਺͕ݺ͹ΕΔ౓ʹ ঢ়ଶͷ൪໨ͷ஋ ࠓճͷ৔߹ɺঢ়ଶ͸ <OBNF VQBEUF>ͳͷͰ ൪໨͸ AOBNFA ʹؔ࿈͢Δ%0.ཁૉΛߋ৽͢Δɻ

DSFBUF@GSBHNFOUؔ਺ มߋ෦෼ͷΈൈਮ

Q DUY <EJSUZ> \ JG EJSUZ OBNF
TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI CVUUPO NPVOUFE GBMTF EJTQPTF ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU CVUUPO MFU NPVOUFE MFU EJTQPTF SFUVSO \ D \ CVUUPO FMFNFOU CVUUPO CVUUPOUFYU$POUFOU $MJDL ^ N UBSHFU BODIPS \ JOTFSU UBSHFU CVUUPO BODIPS JG NPVOUFE \ EJTQPTF MJTUFO CVUUPO DMJDL VQEBUF DUY<> NPVOUFE USVF ^

TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI CVUUPO NPVOUFE GBMTF EJTQPTF ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU CVUUPO MFU NPVOUFE MFU EJTQPTF SFUVSO \ D \ CVUUPO FMFNFOU CVUUPO CVUUPOUFYU$POUFOU $MJDL ^ N UBSHFU BODIPS \ JOTFSU UBSHFU CVUUPO BODIPS JG NPVOUFE \ EJTQPTF MJTUFO CVUUPO DMJDL VQEBUF DUY<> NPVOUFE USVF ^ DDSFBUFؔ਺ CVUUPNཁૉΛ࡞੒ DDSFBUFؔ਺ CVUUPNཁૉΛ࡞੒

TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI CVUUPO NPVOUFE GBMTF EJTQPTF ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU CVUUPO MFU NPVOUFE MFU EJTQPTF SFUVSO \ D \ CVUUPO FMFNFOU CVUUPO CVUUPOUFYU$POUFOU $MJDL ^ N UBSHFU BODIPS \ JOTFSU UBSHFU CVUUPO BODIPS JG NPVOUFE \ EJTQPTF MJTUFO CVUUPO DMJDL VQEBUF DUY<> NPVOUFE USVF ^ NNPVOUؔ਺ CVUUPNཁૉΛϚ΢ϯτͯ͠ɺ ΫϦοΫΠϕϯτϦεφʔΛొ࿥͢Δɻ

TFU@EBUB U OBNF DUY<> ^ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI CVUUPO NPVOUFE GBMTF EJTQPTF ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU CVUUPO MFU NPVOUFE MFU EJTQPTF SFUVSO \ D \ CVUUPO FMFNFOU CVUUPO CVUUPOUFYU$POUFOU $MJDL ^ N UBSHFU BODIPS \ JOTFSU UBSHFU CVUUPO BODIPS JG NPVOUFE \ EJTQPTF MJTUFO CVUUPO DMJDL VQEBUF DUY<> NPVOUFE USVF ^ EEFUBDIؔ਺ CVUUPOཁૉ΁ͷΠϕϯτϦεφʔΛղআ

ϦΞΫςΟϒεςʔτϝϯτΛ௥Ճͯ͠Έ·͢ TDSJQU FYQPSU MFU OBNF XPSME EPVCMF/BNF OBNF OBNF DPOTU
VQEBUF OBNF VQEBUFE TDSJQU I)FMMP\OBNF^I CVUUPO PODMJDL\VQEBUF^$MJDLCVUUPO Q\EPVCMF/BNF^Q

JOTUBODFؔ਺

GVODUJPO JOTUBODF TFMG QSPQT JOWBMJEBUF \ MFU EPVCMF/BNF MFU \OBNF
XPSME ^QSPQT DPOTU VQEBUF JOWBMJEBUF OBNF VQEBUFE TFMGTFU QSPQT \ JG OBNF JO QSPQT JOWBMJEBUF OBNF QSPQTOBNF ^ TFMGVQEBUF \ JG TFMGEJSUZ OBNF \ JOWBMJEBUF EPVCMF/BNF OBNF OBNF ^ ^ SFUVSO <OBNF EPVCMF/BNF VQEBUF> ^ EPVCMF/BNF΋ঢ়ଶͱͯ͠ѻ͏ɻ ίϯύΠϧ࣌ʹɺϦΞΫςΟϒεςʔτϝϯτ಺Ͱ ࢖༻͍ͯ͠Δঢ়ଶΛೝࣝ͠ɺͦͷม਺͕มߋ͞ΕΔ ౓ʹ࠶ܭࢉ͢Δɻ ࠓճͷ৔߹ɺAOBNFA͕มߋ͞ΕΔ౓ʹ EPVCMF/BNFΛ࠶ܭࢉ͢Δɻ

DSFBUF@GSBHNFOUؔ਺ มߋ෦෼ͷΈൈਮ

Q DUY <EJSUZ> \ JG EJSUZ EPVCMF/BNF
TFU@EBUB U EPVCMF/BNF DUY<> ^ J OPPQ P OPPQ E EFUBDIJOH \ JG EFUBDIJOH EFUBDI Q ^ ^ ^ GVODUJPO DSFBUF@GSBHNFOU DUY \ MFU Q MFU U SFUVSO \ D \ Q FMFNFOU Q U UFYU EPVCMF/BNF DUY<> ^ N UBSHFU BODIPS \ JOTFSU UBSHFU Q BODIPS BQQFOE Q U ^ ADSFBUF@GSBHNFOUA͸ଞͷঢ়ଶͱಉ༷ʹ AEPVCMF/BNFA͕มߋ͞ΕΔ౓ʹ%0.ʹ൓ө͢Δɻ

͓ΘΓ

Svelte Runtime 101 (JSConf JP 2022)

Svelte Runtime 101 (JSConf JP 2022)

More Decks by Yuichiro Yamashita

Other Decks in Technology

Featured

Transcript