https://frontend-conf.fukuoka.jp/
3FBEZGPS3FBDUJO'SPOUFOE$POGFSFODF'VLVPLB !LPCB
View Slide
"HFOEBw 'VODUJPO$PNQPOFOUw 69GPSBMMVTFSTw 'VUVSF1MBOTw -JWF$PEJOH
'VODUJPO$PNQPOFOU
3FBDUNFNPw 0QUJNJ[F'VODUJPO$PNQPOFOUw 1VSF$PNQPOFOUGPS'VODUJPO$PNQPOFOU
)PPLTCustom Hook
w )PPLTNVTUCFDBMMFEJOUIFTBNFPSEFS)PPLTHookHooknextFibermemoizedState
"WPJEl8SBQQFSIFMMzhttps://www.youtube.com/watch?v=dpw9EHDh2bM
+BWB4DSJQU`T$MBTTJTIBSEw 'PSw )BSEUPPQUJNJ[Fw 'PSw AUIJTAPG+BWB4DSJQUIBTNBOZQJUGBMMT
.PSF%FUBJMTʜhttps://blog.cybozu.io/entry/2018/11/02/113000
69GPSBMM6TFST
4VTQFOTF1. Throw a Promise2. Wait to resolve the Promise3. Resume the rendering
4VTQFOTFThrow a Promiseif the resource doesn’thave a cache data
3FBDUMB[ZXJUI 4VTQFOTFw $PEF4QMJUUJOHXJUI%ZOBNJD*NQPSU 4UBHF
5JNFTMJDJOHUser BlockingNormal Priority
5JNFTMJDJOHw 8PSLJOHPOTUBOEBSEJ[JOHUIFTDIFEVMJOHNFDIBOJTNXJUIB$ISPNF5FBNw IUUQTHJUIVCDPNTQBOJDLFSNBJOUISFBETDIFEVMJOHw 8IBUBCPVU8FC8PSLFSTʁ
/FX1SPpMFS
69GPSBMMVTFSTw 4VTQFOTFMB[Zw 'PSVTFSTJOIJHITQFFEOFUXPSLBOETMPXOFUXPSLw 5JNFTMJDJOHMB[Zw 'PSVTFSTVTJOHIJHIQPXFSEFWJDFTBOEMPXQPXFSEFWJDFTw 1SFMPBE1SFSFOEFS
https://medium.com/@addyosmani/the-cost-of-javascript-in-2018-7d8950fbb5d4
'VUVSF
3FMFBTF1MBOTGPS4UBCMFw 3FBDUMB[ZXJUI4VTQFOTFw 3FBDU)PPLT 2w $PODVSSFOU.PEF 2w %BUBGFUDIJOHXJUI4VTQFOTF NJEw 4FSWFS3FOEFSFSGPS4VTQFOTF w .PEFSOJ[JOH3FBDU%0. w Now
1SFQBSFGPSUIFGVUVSFw :PVDBOVTFOFXGFBUVSFTJODSFNFOUBMMZXJUIPVUCSFBLJOHDIBOHFTw 6TF3FBDU4USJDU.PEF$PNQPOFOUw 'JYXBSOJOHTJO4USJDU.PEFʜ4USJDU.PEF
-JWF$PEJOHhttps://github.com/koba04/react-hacker-news-stories
5IBOLZPVspeakerdeck.com/koba04