Tweet
Tweet

Slide 1

Slide 1 text

3FBEZGPS 3FBDUJO 'SPOUFOE$POGFSFODF'VLVPLB !LPCB

Slide 2

Slide 2 text

No content

Slide 3

Slide 3 text

"HFOEB w 'VODUJPO$PNQPOFOU w 69GPSBMMVTFST w 'VUVSF1MBOT w -JWF$PEJOH

Slide 4

Slide 4 text

'VODUJPO$PNQPOFOU

Slide 5

Slide 5 text

3FBDUNFNP w 0QUJNJ[F'VODUJPO$PNQPOFOU w 1VSF$PNQPOFOUGPS'VODUJPO$PNQPOFOU

Slide 6

Slide 6 text

)PPLT Custom Hook

Slide 7

Slide 7 text

w )PPLTNVTUCFDBMMFEJOUIFTBNFPSEFS )PPLT Hook Hook next Fiber memoizedState

Slide 8

Slide 8 text

"WPJEl8SBQQFSIFMMz https://www.youtube.com/watch?v=dpw9EHDh2bM

Slide 9

Slide 9 text

+BWB4DSJQU`T$MBTTJTIBSE w 'PS w )BSEUPPQUJNJ[F w 'PS w AUIJTAPG+BWB4DSJQUIBTNBOZQJUGBMMT

Slide 10

Slide 10 text

.PSF%FUBJMTʜ https://blog.cybozu.io/entry/2018/11/02/113000

Slide 11

Slide 11 text

69GPSBMM6TFST

Slide 12

Slide 12 text

4VTQFOTF 1. Throw a Promise 2. Wait to resolve the Promise 3. Resume the rendering

Slide 13

Slide 13 text

4VTQFOTF Throw a Promise if the resource doesn’t have a cache data

Slide 14

Slide 14 text

3FBDUMB[ZXJUI 4VTQFOTF w $PEF4QMJUUJOHXJUI%ZOBNJD*NQPSU 4UBHF

Slide 15

Slide 15 text

5JNFTMJDJOH User Blocking Normal Priority

Slide 16

Slide 16 text

5JNFTMJDJOH w 8PSLJOHPOTUBOEBSEJ[JOHUIFTDIFEVMJOH NFDIBOJTNXJUIB$ISPNF5FBN w IUUQTHJUIVCDPNTQBOJDLFSNBJOUISFBE TDIFEVMJOH w 8IBUBCPVU8FC8PSLFSTʁ

Slide 17

Slide 17 text

/FX1SPpMFS

Slide 18

Slide 18 text

69GPSBMMVTFST w 4VTQFOTFMB[Z w 'PSVTFSTJOIJHITQFFEOFUXPSLBOETMPX OFUXPSL w 5JNFTMJDJOHMB[Z w 'PSVTFSTVTJOHIJHIQPXFSEFWJDFTBOEMPX QPXFSEFWJDFT w 1SFMPBE1SFSFOEFS

Slide 19

Slide 19 text

https://medium.com/@addyosmani/the-cost-of-javascript-in-2018-7d8950fbb5d4

Slide 20

Slide 20 text

'VUVSF

Slide 21

Slide 21 text

3FMFBTF1MBOTGPS4UBCMF w 3FBDUMB[ZXJUI4VTQFOTF w 3FBDU)PPLT 2 w $PODVSSFOU.PEF 2 w %BUBGFUDIJOHXJUI4VTQFOTF NJE w 4FSWFS3FOEFSFSGPS4VTQFOTF w .PEFSOJ[JOH3FBDU%0. w Now

Slide 22

Slide 22 text

1SFQBSFGPSUIFGVUVSF w :PVDBOVTFOFXGFBUVSFTJODSFNFOUBMMZXJUIPVU CSFBLJOHDIBOHFT w 6TF3FBDU4USJDU.PEF$PNQPOFOU w 'JYXBSOJOHTJO4USJDU.PEFʜ4USJDU.PEF

Slide 23

Slide 23 text

-JWF$PEJOH https://github.com/koba04/react-hacker-news-stories

Slide 24

Slide 24 text

5IBOLZPV speakerdeck.com/koba04