Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Deep Dive into React Stream/Serialize

Deep Dive into React Stream/Serialize

Hajime Mugishima

April 30, 2024
Tweet

More Decks by Hajime Mugishima

Other Decks in Programming

Transcript

  1. 5BH w σʔλͷछผऔΓѻ͍ํΛද͢ w * ) 5 & % 8

    3 1ͳͲଟ͕͘ଘࡏ w ଟ͘͸಄จࣈʢ**NQPSU %%FCVHͳͲ  w ແ͍৔߹͸3FBDUπϦʔؔ࿈͔୯७ͳσʔλ ίʔυ্Ͱ͸l.PEFMzͱݺ͹ΕΔ 4USFBNσʔλͷجૅ஌ࣝ
  2. 5ˠ5FYU w CZUFΑΓେ͖͍จࣈྻ͸ผͷ$IVOLͱͳΔ w 5ͷ௚ޙʹ͸αΠζ͕ਐ਺஋Ͱ෇༩͞ΕΔ w ˣ͸QBE4UBSU  BCDEF Λ1SPQTʹ౉ͨ͠৔߹ͷྫ

    8:T7d0,abcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeab cdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdea bcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeabcdeabcde....(লུ) ※"7d0" → 2000
  3. ;FSP$IVOLΛ೷͍ͯΈΔ [ "Hd4i-EanmGD0JpIffHyHC", [ [ [ "", { "children": ["sample",

    { "children": ["__PAGE__", {}] }] }, "$undefined", "$undefined", true ], [ "", { "children": [ "sample", { "children": ["__PAGE__", {}, ["$L1", "$L2", null]] }, [ "$", "$L3", null, { ... ˞ՄಡੑͷͨΊ੔ܗͨ͠΋ͷ
  4. [ "Hd4i-EanmGD0JpIffHyHC", [ [ [ "", { "children": ["sample", {

    "children": ["__PAGE__", {}] }] }, "$undefined", "$undefined", true ], [ "", { "children": [ "sample", { "children": ["__PAGE__", {}, ["$L1", "$L2", null]] }, [ "$", "$L3", null, { ... w શମ͸+40/4USJOH ;FSP$IVOLΛ೷͍ͯΈΔ
  5. [ "Hd4i-EanmGD0JpIffHyHC", [ [ [ "", { "children": ["sample", {

    "children": ["__PAGE__", {}] }] }, "$undefined", "$undefined", true ], [ "", { "children": [ "sample", { "children": ["__PAGE__", {}, ["$L1", "$L2", null]] }, [ "$", "$L3", null, { ... #VJME*% w Ϗϧυ͝ͱͷ*% w ݱࡏͷϏϧυͱࠩҟ͕͋Δ৔߹ɺ .1"φϏήʔγϣϯʹ੾ΓସΘΔ ;FSP$IVOLΛ೷͍ͯΈΔ
  6. [ "Hd4i-EanmGD0JpIffHyHC", [ [ [ "", { "children": ["sample", {

    "children": ["__PAGE__", {}] }] }, "$undefined", "$undefined", true ], [ "", { "children": [ "sample", { "children": ["__PAGE__", {}, ["$L1", "$L2", null]] }, [ "$", "$L3", null, { ... w จࣈྻͰ͔Β࢝·Δ΋ͷ͸ ಛघͳ4FSJBMJ[F%FTFSJBMJ[F͕ඞཁͳ΋ͷ ;FSP$IVOLΛ೷͍ͯΈΔ
  7. 3FBDU&MFNFOU w 3FBDU&MFNFOU͸5VQMFͷܗʹ4FSJBMJ[F͞ΕΔ w ઌ಄ཁૉ͕ͷΈͷ5VQMF͕3FBDU&MFNFOUͱ൑அ͞ΕΔ w 5VQMF಺͸ɺˠ5ZQFˠ,FZˠ1SPQTͷॱং [ "$", "$L7",

    "key-1", { "description": "abcde", "date": "$D2024-04-24T15:01:40.265Z", "promise": "$@8" } ] Ͱݻఆ EJWͳͲͷ5ZQFPS *NQPSU$IVOL΁ͷࢀর Ϧετඳը࣌ͳͲͷLFZ 1SPQT
  8. Ұ෦ͷݻఆ஋ w +BWB4DSJQUݻ༗ͷ஋Ͱ+40/ͰදݱͰ͖ͳ͍΋ͷ $Infinity $-Infinity $NaN $-0 $undefined Infinity -Infinity

    NaN -0 undefined ˞ ͪͳΈʹɺϩδοΫ্Ͱ͸ͷ࣍ͷ̍จࣈͰ൑ఆ͞Ε͓ͯΓɺ ্هͷ৔߹*/Vͷ࣌఺Ͱॲཧ͕෼ذ͍ͯ͠Δɻ
  9. $POTPMFͷ4FSWFSˠ$MJFOUϦϨʔ w <'MJHIU>*OTUSVNFOUUIF$POTPMFJOUIF34$&OWJSPONFOUBOE3FQMBZ -PHTPOUIF$MJFOU  🔗IUUQTHJUIVCDPNGBDFCPPLSFBDUQVMM w FOBCMF4FSWFS$PNQPOFOU-PHTϑϥά͕ඞཁͰ͋Γɺ /FYUKTW࣌఺Ͱ͸ඇαϙʔτ w

    ։ൃ࣌ͷརศੑ޲্ͷͨΊͷػೳ w 4FSWFSଆͰͷDPOTPMF࣮ߦ࣌ʹ4USFBNܦ༝Ͱ$MJFOUଆʹྲྀ͢ ˠ$MJFOUଆͰಉ͡DPOTPMFͷϝιουΛ࣮ߦ͠ϩάΛग़ྗ͢Δ w 4USFBN5BH͸8ʢ$͡Όͳ͍ͷʜʁʣ
  10. 3FBEBCMF4USFBN"TZOD*UFSBUPSͷ4FSJBMJ[F w <'MJHIU>&ODPEF3FBEBCMF4USFBNBOE"TZOD*UFSBCMFT  🔗IUUQTHJUIVCDPNGBDFCPPLSFBDUQVMM w FOBCMF'MJHIU3FBEBCMF4USFBNϑϥά͕ඞཁͰ͋Γɺ /FYUKTW࣌఺Ͱ͸ඇαϙʔτ w 4USFBN5BHʹ3

    S 9 Y $͕௥Ճ͞Ε͍ͯΔ w 3 9͸4USFBNͷ։࢝ S Y͸#:0#4USFBNͷαϙʔτ࣌  $͸4USFBNͷऴྃΛද͢ w 4FSWFS$PNQPOFOU΍4FSWFS"DUJPOͰ 4USFBNΛऔΓճͤΔΑ͏ʹͳΔ͔΋ʁ