React Native Matsuri 2021で発表したスライドです。 https://reactnative-matsuri.com/ja
3FBDU/BUJWF.BUTVSJ-5 3FBDU/BUJWF +4*ιʔείʔυϦʔσΟϯά4IPLFO'VKJTBLJ
View Slide
ࣗݾհw 4IPLFO'VKJTBLJ !TIPLFOYw גࣜձࣾΩονϋΠΫ ڞಉۀऀ$50w ڞஶ3FBDU/BUJWFʹࢧ͑Β͑Δاۀw ΩονϋΠΫΤϯδχΞνʔϜͰ ݄ץ3/'FBUVSFT࿈ࡌத IUUQTUFDILJUDIIJLFDPN
ࠓճ+4*ʹͨ͠ ίʔυϦʔσΟϯάͰ͢
ΞδΣϯμ 3FBSDIJUFDUVSFͱ+4* +4*ͷιʔείʔυΛಡΉ +4*.PEVMFͷιʔείʔυΛಡΉ
ΞδΣϯμ 3FBSDIJUFDUVSFͱ+4* +4*ؔ࿈ͷιʔείʔυΛಡΉ +4*ΛͬͨϥΠϒϥϦΛಡΉ
#SJEHF$4IBEPX5ISFBE:PHB/BUJWF.PEVMFT +BWB0CK$+4#VOEMF +BWB4DSJQU+4$+40/ +40/ඇಉظΩϡʔ6*5ISFBE+45ISFBE/BUJWF6* +BWB0CK$3FBSDIJUFDUVSFҎલ#SJEHF
#SJEHF$4IBEPX5ISFBE:PHB/BUJWF.PEVMFT +BWB0CK$+4#VOEMF +BWB4DSJQU+4$+40/ +40/ඇಉظΩϡʔ6*5ISFBE+45ISFBE#SJEHFҰͭͳͷͰϘτϧωοΫʹͳΓ͍͢ඇಉظͰॲཧ͢ΔͨΊɺىಈ࣌ʹશͯಡΈࠐΉඞཁ͕͋Δૄ݁߹ͳඇಉظॲཧͰྑͦ͞͏͕ͩ τϨʔυΦϑඇಉظͷͨΊɺύϑΥʔϚϯεʹͳΔՄೳੑ/BUJWF6* +BWB0CK$ϨϯμϦϯάߋ৽ʹ#SJEHFɾ+45ISFBEͷ௨՟͕ඞཁ
+4#VOEMF +BWB4DSJQU+45ISFBE3FBSDIJUFDUVSFҎ߱/FX"SDIJUFDUVSFͱ+4*+4*+47.0CKFDUJWF$+BWB+/*$
+4#VOEMF +BWB4DSJQU+45ISFBE3FBSDIJUFDUVSFҎ߱/FX"SDIJUFDUVSFͱ+4*+4*+47./BUJWF.PEVMFT +BWB0CK$6*5ISFBE/BUJWF6* +BWB0CK$
+4#VOEMF +BWB4DSJQU+45ISFBE3FBSDIJUFDUVSFҎ߱/FX"SDIJUFDUVSFͱ+4*+4*+47./BUJWF.PEVMFT +BWB0CK$6*5ISFBE/BUJWF6* +BWB0CK$$+40/͕ͳ͘ͳͬͨ#SJEHFܦ༝ͷඇಉظॲཧ͔Β ͷಉظॲཧ$Ͱڞ௨ͷ/BUJWF.PEVMFT͕ॻ͚ΔΑ͏ʹͳͬͨ-B[ZMPBEJOH͕Մೳʹ
݄ʹ+4$͔Β+4*ͷมߋ͕ίϛοτ͞ΕΔIUUQTHJUIVCDPNGBDFCPPLSFBDUOBUJWFDPNNJUDEFGCCCBGDBCBCE3$5$YY#SJEHFͰҎԼͷมߋ มߋલ+4$&YFDVUPS'BDUPSZมߋޙ+4*&YFDVUPS'BDUPSZ+4$3VOUJNF
+4*&YFDVUPS'BDUPSZ ͱ͍͏ͷ͕ॏཁͦ͏🤔
3$5$YY#SJEHFͰҎԼͷมߋ มߋલ+4$&YFDVUPS'BDUPSZมߋޙ+4*&YFDVUPS'BDUPSZ+4$3VOUJNF
ݱࡏͷ3$5$YY#SJEHFNNIUUQTHJUIVCDPNGBDFCPPLSFBDUOBUJWFCMPCDEFCECFEFEDBGDGCB3FBDU$YY#SJEHF3$5$YY#SJEHFNN--[email protected]&@)&3.&4͕USVFͳΒ )FSNFT&YFDVUPS'BDUPSZ+4*&YFDVUPS3VOUJNF*OTUBMMFS GBMTFͳΒ +4$&YFDVUPS'BDUPSZ+4*&YFDVUPS3VOUJNF*OTUBMMFS
+4*&YFDVUPS3VOUJNF*OTUBMMFS 🤔
)FSNFT&YFDVUPS'BDUPSZIIUUQTHJUIVCDPNGBDFCPPLSFBDUOBUJWFCMPCFBEBDGDBECBDEECGD3FBDU$PNNPOIFSNFTFYFDVUPS)FSNFT&YFDVUPS'BDUPSZI)FSNFT&YFDVUPS'BDUPSZͷୈҰҾ͕ +4*&YFDVUPS3VOUJNF*OTUBMMFS
3$5+4*&YFDVUPS3VOUJNF*OTUBMMFSNNIUUQTHJUIVCDPNGBDFCPPLSFBDUOBUJWFCMPCFBEBDGDBECBDEECGD3FBDU$YY#SJEHF3$5+4*&YFDVUPS3VOUJNF*OTUBMMFSNNίʔυΛಡΜͰΘ͔ͬͨ͜ͱɾ/BUJWFͱCJOE͍ͯ͠ΔɾSVOUJNFΛͯ͠ϥοϓͯ͠ΔSVOUJNFʹ)FSNFTͳͲ+BWB4DSJQU&OHJOF͕ࢀর͞ΕΔɻ+4*+4&OHJOFͷϥούʔɻ
+4*ؔ࿈Ϋϥεw SFBDUOBUJWF3FBDU$PNNPOKTJFYFDVUPSKTJSFBDU+4*&YFDVUPSw SFBDUOBUJWF3FBDU$PNNPOKTJFYFDVUPSKTJSFBDU+4*/BUJWF.PEVMFT
+4*&YFDVUPSDQQIUUQTHJUIVCDPNGBDFCPPLSFBDUOBUJWFCMPCBBDDCBGFBFE3FBDU$PNNPOKTJFYFDVUPSKTJSFBDU+4*&YFDVUPSDQQ/BUJWF.PEVMF1SPYZ/BUJWF.PEVMFTͷࢀরΛ࣋ͭ
+4*/BUJWF.PEVMFTDQQIUUQTHJUIVCDPNGBDFCPPLSFBDUOBUJWFCMPCBBDDCBGFBFE3FBDU$PNNPOKTJFYFDVUPSKTJSFBDU+4*/BUJWF.PEVMFTDQQSVOUJNFHMPCBM HFU1SPQFSUZ"T'VODUJPO SVOUJNFHMPCBM HFU1SPQFSUZ"T0CKFDU Λݺͼग़ͯ͠࡞ͨ͠NPEVMFΛฦ͢
+4#VOEMF +BWB4DSJQU+45ISFBE+4*+47./BUJWF.PEVMFT +BWB0CK$6*5ISFBE/BUJWF6* +BWB0CK$$͜͜·ͰಡΜͩίʔυKTJ3VOUJNFΦϒδΣΫτ +4*&YFDVUPS +4*/BUJWF.PEVMFT )FSNFT +4$)FSNFT&YFDVUPS'BDUPSZ+4$&YFDVUPS'BDUPSZ3$5+4*&YFDVUPS3VOUJNF*OTUBMMFSKTJDQQ+4*%ZOBNJDDQQSVOUJNFHMPCBM TFU1SPQFSUZ SVOUJNFHMPCBM HFU1SPQFSUZ
ίϥϜTFU5JNFPVUͷ࣮
SFBDUOBUJWF-JCSBSJFT$PSF5JNFST +45JNFSTKT/BUJWF5JNJOHͱ
SFBDUOBUJWF-JCSBSJFT$PSF5JNFST /BUJWF5JNJOHKT5SVCP.PEVMFʂ
SFBDUOBUJWF3FBDU$PSF.PEVMFT3$55JNJOHNNTFU5JNFPVUͰΘΕΔDSFBUF5JNFSͷJ04ωΠςΟϒ࣮
TFU5JNFPVU5VSCP.PEVMFԽࡁΈ
DSBGU[EPH͞ΜͷSFBDUOBUJWFRVJDLCBTFͷίʔυΛಡΉIUUQTHJUIVCDPNDSBGU[EPHSFBDUOBUJWFRVJDLCBTF
IUUQTUFDILJUDIIJLFDPNFOUSZSFBDUOBUJWFGFBUVSFT•React NativeͷύϑΥʔϚϯεͱɺNULLจࣈΛؚΉόΠφϦจࣈྻΛॲཧͰ͖ͳ͍՝•base64 ͰΤϯίʔυ͞Εͨը૾σʔλΛJS ͔ΒReact Native ϒϦοδΛհͯ͠WebView ʹ͢ͷͰ͕͔͔࣌ؒΔ•C++ ͰJSI ωΠςΟϒϞδϡʔϧΛ࡞ͨ͠•JSI Λ༻͢Δ͜ͱʹΑΓɺJavaScript C++ ϗετΦϒδΣΫτͷࢀরΛอ࣋͠ɺϝιουΛݺͼग़͢͜ͱ͕Ͱ͖Δɻ͜ΕʹΑΓɺઌʹड़ͨNULLจࣈͷΛ࠷ऴతʹճආͰ͖ͨɻ
͜ͷลΓͷίʔυΛಡΉ
DQQCBTFI[email protected][email protected]ͳͲͷ͕ؔએݴ͞Ε͍ͯΔɻ࣮CBTFDQQ
DQQSFBDUOBUJWFRVJDLCBTFDQQ࣮ࡍͷ+4*όΠϯσΟϯάॲཧɻ+BWB4DSJQU͢ΛKTJ7BMVFͱͯ͠࡞JOTUBMM#BTFؔͷ࣮+BWB4DSJQUͷάϩʔόϧ +BWB4DSJQUͰ͑ΔϓϩύςΟʢؔʣ
JPT2VJDL#BTFNN+4*όΠϯσΟϯάެ։༻ʹ 3FBDU3$5#SJEHF1SJWBUFϔομʔϑΝΠϧΛΠϯϙʔτDYY#SJEHFSVOUJNFͷࢀরΛऔಘɻ$ίʔυͰૢ࡞༻ͷ+BWB4DSJQU7BMVFTΛ࡞͢ΔͨΊʹඞཁͳSVOUJNFΦϒδΣΫτSVOUJNFΛJOTUBMM#BTFؔʹͯ͠ɺ+4*όΠϯσΟϯάΛ࡞
JOEFYUTͰؔόΠϯσΟϯάΛએݴDQQͰKTJ3VOUJNFHMPCBM TFU1SPQFSUZ ͨؔ͠FYQPSUGVODUJPO
"QQUTYͰJNQPSUFYQPSUͨ͠GVODUJPO
+4#VOEMF +BWB4DSJQU+45ISFBE+4*+47./BUJWF.PEVMFT +BWB0CK$6*5ISFBE/BUJWF6* +BWB0CK$$CBTFI DQQ SFBDUOBUJWFRVJDLCBTFI DQQ2VJDL#BTFI NN·ͱΊKTJ3VOUJNFΦϒδΣΫτ +4*&YFDVUPS +4*/BUJWF.PEVMFT )FSNFT +4$)FSNFT&YFDVUPS'BDUPSZ+4$&YFDVUPS'BDUPSZ3$5+4*&YFDVUPS3VOUJNF*OTUBMMFSKTJDQQ+4*%ZOBNJDDQQ
͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ΩονϋΠΫςοΫϒϩάͰ 3FBDU/BUJWF࠷৽ใΛ࿈ࡌத IUUQTUFDILJUDIIJLFDPN