æè¿ããããæ°æ¸ã£ã¦ãããããªãã§ããã
å®è·µãã¦ã人ãã¡ã®ãã¤ã¼ãããªã¢ã«ã¿ã¤ã ã§çºããªããããã¯ã¼ãããããã®ãããã®ãããããã«æã£ã¦ããã®ã§ãããæãããã¦èªåã®æå ã«ããããæ°æ¸ãåºçã§ããï¼12æé以å ã§æä½éã®ææ³ã表æã§ãããã£ã³ã¹ãå·¡ã£ã¦ãã¾ããã
ããããçµå±ãããæ°æ¸çãªå½¢ã§åºãã®ã§ã¯ãªããå¤å°ã®æéãããã¦ããããããªã¥ã¼ã ã®ããè¨äºãæ¸ããã¨ãé¸ã³ã¾ããã
ãã®ãããã®å¿ã®åãã¯æ¥é±ãããã«ã¯å¿ãã¦ãã¾ã£ã¦ããããªã®ã§ãã¨ãã»ã¤ã¨ãã¦æ®ãã¦ããããã¨æãã¾ãã
æçµçãªææç©
æ¨æ¥ããããªè¨äºãå ¬éãã¾ããã
å·çæéã¨ãã¦ã¯5/21ã25ã§ãç´¯è¨ã§20æéãããããã£ã¦ããã¨æãã¾ãã
ãããæ°æ¸ã¨ãã¦åºãããããããªããã®
å®ã¯ãã¨ããã¦ããããæå±ãã¦ããç®æ¡æ¸ãã¿ã¤ãã®ãããæ°æ¸ã®ã¬ãã«ã§ããã°ã5/19ã20ãããã«æ¢ã«ã§ãã¦ãã¾ãããMacã¨iPhoneã®ã¡ã¢ã¢ããªã§ã¡ã¾ã¡ã¾ã¨æ¸ããããããã以ä¸ã®ãã®ã§ãã
ä»®é¡ï¼react-native-domãæµ®ã彫ãã«ããReact Nativeã®æ¬è³ª * react-native-domåºã¾ããã * react-native-webã¨ä½ãéããï¼ æ®éã®React Nativeã¨ã®éãã¯ï¼ * RNã¯Viewã®æ½è±¡å * æå®ã®ã³ã³ãã¼ãã³ããiOSãAndroidã®ãã¤ãã£ãViewã«å¤æãã¦æç»ãã * Reactã¯VDOMãç¨ããå·®åæ´æ°ã®ä»çµã¿ * DOMããã¤ãã£ãViewã«æ¸ãè¾¼ãã¨ããã¯Reactã¨ã¯å¥ã©ã¤ãã©ãª * react-domã¯åããããã * å·®åãéææ¸ãããã§ãã ã * React Nativeã¯2段é * ã¾ã大åæã¨ãã¦JavaScriptã¯ããã¯ã°ã©ã¦ã³ãã§åãã¦ã * Reactãç®åºããå·®åã¯React Native Rendererã«æ¸¡ããã * React DOMãªãããã§çµãããã ãã©ãReact Nativeã®å ´åã¯ãã¤ãã£ãå´ã«RCTShadowView/React ShadowViewã®ããªã¼ãæ§ç¯ããã * ããã®å·®åããæ°ãã«æ´æ°å½ä»¤ãä½ã£ã¦ãã¥ã¼ã«çªã£è¾¼ãã * Yogaã¯ãã®ã¿ã¤ãã³ã°ã§è©ä¾¡ãããã * ããã¾ã§ãããã¯ã°ã©ã¦ã³ãã¹ã¬ãã * ãã¨ã¯UIã¹ã¬ããããããªã«ãã¥ã¼ããå½ä»¤ãå¼ã£å¼µãåºãã¦æ´æ°ããã * ShadowViewã¯/å½ä»¤ãªãã¸ã§ã¯ãã¯ãã¤ãã£ãã³ã³ãã¼ãã³ãã¸ã®åç §ãæã£ã¦ããã®ã§ããã¤ãã£ãã³ã³ãã¼ãã³ãã«å®ç¾©ãããæ´æ°æ¹æ³ã§Viewãæ´æ°ããã * ãã¦ãreact-native-domã®è©±ãããã * RNdomã¯DOMããªã¼ããã¤ãã£ãViewã¨è¦ãªãã¦ä½ããããRNã®ãµã¼ããã¼ãã£å®è£ ã * RNWindowsãRNmacosã¨åãæ ã ãï¼RNWebãéãçç±ã¯å¾è¿°ï¼ * ããã¤ã¯ãã°ã * RNã®JSé¨åããã¯RNã«ããè¦ãã¦ãªãã®ããã°ã * WebWorkerã¾ã§ä½¿ã£ã¦2ã¹ã¬ããå¶ãåç¾ãã¦ãã®ããã°ã * Yogaãwasmåãã«ãã¼ãã£ã³ã°ãã¦ãã®ããã°ã * React DOMã使ã£ã¦ãªãã®ããã°ã * WebComponentsãªã®ããã°ã * iOS SDKã®åå®è£ ã«ã¾ã§ç足çªã£è¾¼ãã§ãã®ããã°ã * RNwebã¯ããã¾ã§ãã°ããªããã * RNã¨åãè¦ç´ åã¨å±æ§åã¨ããã£ã½ãã¹ã¿ã¤ã«ãæã¤ã³ã³ãã¼ãã³ããå®ç¾©ããUIã©ã¤ãã©ãªã§ãããªããã * RNdomã¯ãã°ã * DOMããã¤ãã£ãViewã ã¨è¨ãå¼µãããã£ã * ããã¯RNã·ãªã¼ãºã®ä¸è§ãå¼µãã®ã«æ¥ããªãä½ãããã¦ãã * ããã ããããªã * Reactã¢ããªã±ã¼ã·ã§ã³ã®å®è¡ã«WebWorkerã使ã£ãç¹ãè©ä¾¡ããã * ããããéãDOMã®æç»ãUIã¹ã¬ããã«ä»»ãã¦ãå®ã¯DOMã«è§¦ããªã * ããã¦åããã¯ã½éãå¦çãæ¸ãæ£ãããã¦ããReactã¢ããªã±ã¼ã·ã§ã³ãå¥ã¹ã¬ããã«éãã * ããã¯é«éåãè¦è¾¼ã¾ããã®ã§ã¯ãªããï¼è¦åºå ¸ï¼ * DOMãç´æ¥è§¦ããªãå¦çãWebWorkerã«éãããã©ãã¤ã ã¯ãä»å¾ã®ã¹ã¿ã³ãã¼ãã«ãªãããå¨åãæã¤ããã«æã£ã
大çã¨ãã¦ã¯æçµææç©ã¨åããã¨ãè¨ã£ã¦ãã¾ãããããæ¸ãå§ãããã ããã2æéãããã§æ¸ãã¦ãã¾ããã
ãã®ç®æ¡æ¸ããã§ããæç¹ã§ããµã¨ããããããä»æµè¡ãã®ãããæ°æ¸ã§åºããããããï¼ãã¨ããçºæ³ãè³è£ããããã¾ããã12æé以å ã«PDFãä½ã£ã¦BOOTHã«æããããããªããç¹ã«åé¡ãªãå¯è½ã ã£ãããã«æãã¾ãã
ããããããã¯å´ä¸ãããã¨ã«ãã¾ããã
è¨äºã®ç¹æ§ã¨ãããæ°æ¸ã®ãã¢
ããããããããæ°æ¸ã¨ãã¦åºãã®ã諦ããã®ã¯ã次ã®ãããªçç±ããã§ãã
- React Nativeã¯è¦ç´ æè¡ãå¤å²ã«ããããããèªè ãã©ã®è¦ç´ æè¡ã®åºèº«ãã«ãã£ã¦éãã話é¡ã¨éããªã話é¡ã®è½å·®ãæ¿ãã
- React Native DOMã®è©±ã¯ã§ããã°React Nativeæªçµé¨ã®JavaScriptã¨ã³ã¸ãã¢ãæ³å®èªè ã«ãããã£ãã®ã§ãèªãããã®åæç¥èãæ±ããããªã
- ãã®ãããã®åéãªã12æéã«æããã«ãããã¡ãã£ã¨æéããããã°æ®éã«ãããªãã®ã¯ãªãªãã£ã®ãã®ãåºããããããï¼
ããããã¾ã¨ããã¨ãã©ã®æèã®è©±é¡ãªã®ãããã£ããã¨å®ãã¦ãã話ãå§ããªãã¨ãä½ã®è©±ãããããªã人ã話é¡ãåéããã人ãåºã¦ãããã ãã©ãã§ããããã層ã®äººãã¡ãæ³å®èªè ã«ãããã®ã§ããã£ããæãããã¦æç« ãä»ä¸ããããã¨ãããã¨ã«ãªãã§ããããã
ãã®æããåãå¥ããã®ããæ®æ®µãªãReact Nativeã®ä¸åãã«èå³ã示ããªãããªäººã ãå¤ãèªãã§ãããããã§ããããªãããã»ãªãã»ããããªãã¼ãã«ã¤ãã¦èªã£ã¦ããè¨äºããããã³ããªå ¥ããããããªç¶æ³ã«ãªãã¾ããã
ã¼ãããã¨æã£ããããæ°æ¸ã®ç¹æ§
ãã¦ãæªæã®ååã¨ããããªãã¨ããããããããæ°æ¸ã«ãã¥ããé¡æããæ±ã£ããé°ã§ããªãã¨ãªããããæ°æ¸ã®ãã¢ã®ä¸ç«¯ãè¦ãããããªæ°ããã¾ããã
ç§ã¯ãããæ°æ¸ã«å¯¾ãã¦ã çè ã¨èªè ã®éã®æèã®å ±æã«ãããæéã極éã¾ã§ç«¯æã£ã¦ãæ¬é¡ã ããä¼ãããã¨ãã§ãã ã¨ããã¡ãªãããæãã¦ãã¾ãã
ãããããåæ¥ã¬ãã«ã®æç« ã¨ãããã®ãä½æ è¨èãä¸å¯§ã«é¸ã³ãè¨èãå°½ããã®ãã¨ããã¨ã ãã¹ãªã¼ããæ¸ãããããã ã§ããçè ãæ¬æ¥ä¼ãããã£ãæ å ±ã®ãã¥ã¢ã³ã¹ã誤解ãªãä¼ããããã«æ¥å¤é ãæ±ãã¦ãã人ãã¡ããã¾ãã
ãã¥ã¢ã³ã¹ã®ä¼éã«ããã¦ã¯ãå種ã®ç¨èªã«ã¤ãã¦ã®èªèãçè ã¨èªè ã®éã§å ±éãã©ãããéè¦ã§ããé常ã¯å種ã®å°éç¨èªã«ã¤ãã¦çè ã¨åãèªèãæã¦ã¦ããç¶æ ã§æ¬ãèªã¿å§ãã人éã¯å¤ãã¯ãªãã¨ããåæã§ãæç« ã®ç解ã«æä½éå¿ è¦ã«ãªããããªå°éç¨èªã«ã¤ãã¦ã¯ãéæéæã«è§£èª¬ãå ¥ããããå¾ãªããã¨ãããã¾ããã¾ããå°éç¨èªå士ã®é¢ä¿æ§ãç解ãã¦ããã°èªæã§ãããããªäºè±¡ã«ã¤ãã¦ããèªè ããããç¥ããªãå¯è½æ§ããããªãã°ãé¢ä¿æ§ã«ã¤ãã¦ãæç« ã®ä¸ã§è¨åããå¿ è¦ãããã§ãããã
ãããæ°æ¸ã¯ããã®ãæèãå ±æããæéããæèçã«æé¤ãããã¨ã§é«éã«ï¼æ¯è¼çï¼çãæç« ãä¸ã«åºãæåã§ããã¨ãç§ã¯èªèãã¦ãã¾ãã
æèãå ±æããæéãæããã å ´åãé常ã¯èª¤è§£ããã¹ãªã¼ããèµ·ããããããªãã¾ããããããå®ã¯ãã®åé¡ã軽æ¸ã§ããç¶æ³ãããã¾ãã çè ãæå±ããã³ãã¥ããã£ãæ³å®èªè ã§ãã ã±ã¼ã¹ã§ããåãã³ãã¥ããã£ã®ä¸ã§ã¯å°éç¨èªã®èªèãæã£ã¦ãããã¨ãå¤ãããããã®èªèã«æ²¿ã£ãç¨èªã®ä½¿ãæ¹ããã¦ããéãã¯ãããããè¨èãå°½ããã¦æèãå ±æããå ´é¢ãããªãå°ãªããªãã¨æããã¾ãã
è¨ã£ã¦ãã¾ãã°ãå 輪åããªã®ã§ç´°ãã説æããªãã¦ãã ãããä¼ããã以å¤ã®ä½ç©ã§ããªãã®ã§ãããã¾ããããããã®ãªã®ããªã¨æãã¾ãã
ã³ãã¥ããã£ã¨è¡¨ç¾ããã¨æ£ç¢ºã§ãªãã±ã¼ã¹ãæãããããã¾ãããããªãã«ãããè¨è足ããããã£ãã¨ãã¦ãè¡éãèªãã§ããããããããã¾ã§ããã®æç¹ã§ã®ã¹ãããã·ã§ããã¨ãã¦ã®ææ³ã§ãããã¨ãç解ãã¦ãããã¦ãããå¾ã«ã¢ãããã¼ãããã£ãå ´åã«ã¯ãã¶ããã£ããã¢ãããã¦ãããããã¨ãã£ãå®å¿æãæã£ã¦çè ãæ å ±æä¾ãã§ãããããªé¢ä¿æ§ãèªè ã¨æ§ç¯ã§ãã¦ããå ´åã«å¨åãçºæ®ãããã¨ã¯æå¾ ãã¦ãããããã§ãã
ãããã«
ããããæ°æ¸ã¨ã¯ä½ãããèªãã«ã¯å¨åé ãã¨ããæãããã¾ãããå½äºè ã«ãªãããã§ãªããªãã£ãç«å ´ã«ãªã£ãã®ã§ããã¾æã£ã¦ãããã¨ãæ¸ãã¦ã¿ã¾ããã
ç¹æ§ã¯ãªãã¨ãªãåãã£ã¦ããæ°ãããã®ã§ãé©åãªå ´é¢ãããã°åºãã¦ã¿ãããªãã¨æãã¾ãã
ãã¾ã
å®ã¯ãããæ°æ¸ã«ããã§ããªãã·ã§ã¼ããã¼ã¸ã§ã³ãããã¾ããã
react-native-domã¯æ¬å½ã«å¤æ ã®ææ¥ã ããReact Nativeã®æ´¾çã¨ãã¦ã¢ãªãã©ããï¼RNWebã§ååã§ã¯ãªããï¼ã¿ãããªè°è«ã¯ããã¨æããã ãã©ãWebWorkerãwasmãæ大éæ´»ç¨ãã¦ã¦ãReactã¨ãããã©ãã¤ã ã®ãã©ã¦ã¶ä¸ã§ã®ãããããã®PoCã¨ãã¦ã¯ãã³ããªãåªç§ãªã®ã§ãã¿ããªèªãã¹ãã
— ãªããã@ãããã¨ãã¼ã¦ãã¶ãããã (@Nkzn) 2018å¹´5æ19æ¥
ããã ãã§ãåãã人ã«ã¯åãã£ã¦ã»ããã£ããã©ããããªã®ã§åãã人ãªãããããããªãã®ã§ãç§ãã¡ã¯ãªãã ããã ã§ãããæ°æ¸ç¨åº¦ã«ã¯è¨èãå°½ããå¿ è¦ãããã®ã§ãã£ãã以ä¸ã