「jsconf.eu 報告会 Performance Empathy 編」 @ノード学園34時限目

Transcript

1. JSConfEU XࢀՃใࠂ 2019.06.27 ∁ڮ ஌੒ Performance Empathyฤ NodeֶԂ34࣌ݶ໨
2. w "JSγϑτͱ͍͏ϓϩμΫτͰಇ͍͍ͯ·͢
   w ݸਓతʹؔ৺ͷ͋Δٕज़
   w ࠓճ͕ॳͷւ֎ςοΫΧϯϑΝϨϯεࢀՃͰͨ͠ ∁ڮ ஌੒ (GitHub: tomonari-t)
3. +4$POGͷτʔΫ಺༰ w +4ͷ৽ύοέʔδϚωʔδϟʔ
   w 8FC"TTFNCMZ
   w 4UFODJMKT ٕज़த৺ͷτʔΫ͚ͩͰͳ͘
   ৭ʑͳλΠϓͷτʔΫ͕͋ͬͨΧϯϑΝϨϯ εͰͨ͠ɻ
   w ଟ໘ମ
   w #BCZ
   %SJWFO
   %FWFMPQNFOU
   w 4IBQF
   PG
   8FC ͨ͘͞Μ঺հ͍ͨ͠ͷ͋Δ͚Ͳɾɾɾ
   
4. ʮళ௕͞Μͷ൑அҎ֎ͷ࣌ؒΛ̌ʹʯ
   "JSγϑτ
5. ύϑΥʔϚϯεͷݱঢ় ͳͥύϑΥʔϚϯε͸େࣄͳͷ͔ ྫ͑͹
   .#
   ίϯςϯπ͕දࣔ͞ΕΔ·Ͱ
   ਺ඵ͔͔Δ͜ͱ΋  ཭୤
    ৴པײΛଛͳ͏
    Ϣʔβʔମݧʹ௚݁͢Δ $43
   
6. ύϑΥʔϚϯεͷݱঢ় ͳͥύϑΥʔϚϯε͸େࣄͳͷ͔ ྫ͑͹
   .#
   ίϯςϯπ͕දࣔ͞ΕΔ·Ͱ
   ਺ඵ͔͔Δ͜ͱ΋  ݟΔલʹ཭୤
    ৴པײΛଛͳ͏
    ࢖͍ʹ͍͘ Ҏ্ͷαΠτ͕.#Ҏ্ͷ+4Λಧ͚͍ͯΔ CJUMZCZUFTKTRVFSZ
    
   PSJHJOT ࣌఺Ͱͷ3FBDU
   "OHVMBS
   7VFΛ࢖͍ͬͯΔͷϞόΠϧαΠτͷ͢΂ͯͷεΫϦϓτ
   
   GSPN
   )551
   "SDIJWF
7. ύϑΥʔϚϯε͸̍൪ͷ༏ઌ ࣄ߲ͱͳ͍ͬͯͳ͍ ྫ͑͹̎ͭͷγφϦΦ
    ͋Δ೔ΞΠσΟΞΛࢥ͍ͭ͘
    ࣮ݱํ๏ʹ͍ͭͯ͠Β΂Δ
    ࡞Γ࢝ΊΔ  ৽νʔϜʹࢀՃ
    νʔϜͷίʔυΛಡΈղ͘
    ύονλεΫΛ࣮૷͢Δ
8. ύϑΥʔϚϯε͸̍൪ͷ༏ઌ ࣄ߲ͱͳ͍ͬͯͳ͍ ྫ͑͹̎ͭͷγφϦΦ
    ৽νʔϜʹࢀՃ
    νʔϜͷίʔυΛಡΈղ͘
    ύονλεΫΛ࣮૷͢Δ ࠷খͷ࿑ྗͰ͢͹΍͘࡞Δ͔͕
   ༏ઌࣄ߲
9. ύϑΥʔϚϯε͸̍൪ͷ༏ઌ ࣄ߲ͱͳ͍ͬͯͳ͍ ྫ͑͹̎ͭͷγφϦΦ
   ࠷খͷ࿑ྗͰ͢͹΍͘࡞Δ͔͕
   ༏ઌࣄ߲ ࠷ॳͷίϛοτ͕ͲΕ΄Ͳ
   ύϑΥʔϚϯεʹ౰ͯΔ͔
   ߟ͑ͳ͍
10. ύϑΥʔϚϯε͸̍൪ͷ༏ઌ ࣄ߲ͱͳ͍ͬͯͳ͍ ࠷খͷ࿑ྗͰ͢͹΍͘࡞Δ͔ ࠷ॳͷύον͕ͲΕ΄Ͳ
    ύϑΥʔϚϯεʹ౰ͯΔ͔
    ߟ͑ΒΕͯΔʁ ྫ͑͹̎ͭͷγφϦΦ
    ϓϩμΫτ͕੒௕͍ͯ͘͠தͰ ։ൃελʔτ Yճ໨ͷϦϦʔε ύϑΥʔϚϯε͸ޙճ͠
    ໰୊ʹؾͮ͘ͷ͕ࣄޙ
11. ݱঢ়Λվળ͢ΔͨΊʹ w σϑΥϧτͳ΋ͷΛ࢖͏ʢ%FGBVMUʣ
    w ύϑΥʔϚϯεόδΣοτΛӡ༻͢Δʢ(VBSE
    3BJMTʣ
    w ύϑΥʔϚϯεφϨοδΛ֫ಘ͢Δ
12. σϑΥϧτʢσϑΝΫτʣ
    πʔϧΛ࢖͏
13. σϑΥϧτͷ"1* ϒϥ΢β͕σϑΥϧτͰ΍ͬͯ͘ΕΔʢΑ͏ʹʣͳΔ͜ͱ -B[Z
    MPBEJOH ը૾ɺJGSBNFΛඞཁʹͳͬͨͱ͖ʹಡΈࠐΉ ஗ԆಡΈࠐΈ දࣔྖҬ
14. σϑΥϧτͷ"1* ϒϥ΢β͕σϑΥϧτͰ΍ͬͯ͘ΕΔʢΑ͏ʹʣͳΔ͜ͱ WJSUVBMTDSPMMFS
     ඞཁͳ෦෼͚ͩϨϯμϦϯά
15. ύϑΥʔϚϯεόδΣοτΛ ӡ༻͢Δ Α͋͘Δͷ͕ վળͯ͠͠͹Β͘͢Δͱ ػೳ௥ՃʹΑΓ؇΍͔ʹѱԽ
16. ύϑΥʔϚϯεόδΣοτΛ ӡ༻͢Δ ύϑΥʔϚϯεόδΣοτ ύϑΥʔϚϯεʹؔ࿈ͨ͠ج४Λઃఆ͠
    z஌Βͳ͍͏ͪʹѱԽzΛ๷͝͏ʢΨʔυʣ
17. ύϑΥʔϚϯε όδΣοτ • ύϑΥʔϚϯε͕डೖՄೳ͔Λ൑அ͢Δج४ IUUQTNFEJVNDPN!BEEZPTNBOJNFBTVSFPQUJNJ[FNPOJUPSFF • Ұఆͷൣғɺᮢ஋ʹ͓͞·͍ͬͯΔʢNJMFTUPOFʣ • ڝ߹ɾաڈൺֱͰѱԽ܏޲ʹͳ͍͔ʢSVMFTʣ • ύϑΥʔϚϯεείΞʢSVMFTʣ • ϖʔδͷαΠζʢ2VBOUJUZʣ IUUQTBEEZPTNBOJDPNCMPHQFSGPSNBODFCVEHFUT !T@BSBJ͞Μ͔Β͓आΓ͠·ͨ͠
18. ύϑΥʔϚϯε όδΣοτʢࢀߟ̍ʣ ͷ͜Γʢ,#ʣ ػೳ#ͷ௥Ճʹඞཁʢ,#ʣ ػೳ"Ͱར༻͍ͯ͠Δʢ,#ʣ ༧ࢉશମʢ,#ʣ  શମ ,#ͷ༧ࢉ  ػೳ"
    ͷͨΊʹ ,#ར༻  ػೳ#
    ࣮ݱͷͨΊ ,#
    ඞཁ ,#Λࢧग़ͯ͠Ϣʔβʔମݧʹม͑Δ  ༧ࢉͷ࢒Γ ,#
    ͔Β ,#
    ࢖ͬͯػೳ#Λ࣮૷  ༧ࢉͷ࢒Γ͸ ,# !T@BSBJ͞Μ͔Β͓आΓ͠·ͨ͠
19. ύϑΥʔϚϯε όδΣοτʢࢀߟ̎ʣ ͷ͜Γʢ,#ʣ ػೳ#
    Ͱར༻தʢ,#ʣ ػೳ"Ͱར༻தʢ,#ʣ ༧ࢉશମʢ,#ʣ  શମ ,#ͷ༧ࢉ  ػೳ$ ͷ௥Ճʹ ,#
    ඞཁ  ༧ࢉͷ࢒Γ͸,#ͳͷͰ ,# ෆ଍͍ͯ͠Δ • ػೳ"
    Λ΍Ίͯ༧ࢉΛ֬อ͢Δ • ·ͨ͸࠷దԽͯ͠ར༻αΠζΛݮΒ ͯ͠,#
    ֬อ͢Δ • ·ͨ͸ ,#
    ෛ࠴ͱ࣮ͯ͠૷ • ·ͨ͸ ஗ԆಡΈࠐΈ͢Δ !T@BSBJ͞Μ͔Β͓आΓ͠·ͨ͠
20. https://web.dev/performance-budgets-101 ෳ਺ͷࢦඪΛઃఆ͢Δ
21. ྫ͑͹  ύϑΥʔϚϯεόδΣοτΛ,#ͱઃఆ
     ػೳ"ͷͨΊʹ,#
     ػೳ#ͷͨΊʹ,#
     ৽ػೳ௥ՃͰ,#ඞཁ ༧ࢉ,#௒ա " ύϑΥʔϚϯεվળΛͯ͠,#೧ग़
    # ػೳ#Λ΍Ίͯ৽ػೳΛ͍ΕΔ
    $ ෛ࠴ͱͯ͠৽ػೳΛ͍ΕΔ ػೳ"
    ,# ػೳ#
    ,# ࢒,# -JHIUIPVTF
22. φϨοδΛ֫ಘ͢Δ Ϟμϯͳ8FCΛߏங͢ΔͨΊ ͷυΩϡϝϯτ͕·ͱ·͍ͬͯ Δ  3FBDUͰ଎͍"QQΛߏங͢ Δํ๏
     ΞΫηαϏϦςΟ
     ύϑΥʔϚϯεόδΣοτ ͷಋೖํ๏
23. φϨοδΛ֫ಘ͢Δ IUUQTHJUIVCDPN(PPHMF$ISPNFMJHIUIPVTFTUBDLQBDLT 4UBDL
    1BDL -JHIUIPVTF͕ɺͲΜͳٕज़ ελοΫͰ࡞ΒΕ͍ͯΔ͔Λ ݕ஌ͦ͠Εʹదͨ͠۩ମతͳ ղܾํ๏Λఏࣔͯ͘͠ΕΔ 8PSE1SFTT͕ 3FBDU
    ".1͕
24. ·ͱΊ w σϑΥϧτͳ΋ͷΛ࢖͏
    w ΨΠυͱͳΔࢦඪʢόδΣοτʣΛܾΊͯӡ༻͢Δ
    w ۩ମతͳ)PX͸zXFCEFWzͳͲΛ೷͍ͯΈΑ͏
    w ύϑΥʔϚϯεʹରͯ͠ͷʮ৘ใൃ৴ΛڧΊ͍ͯͧ͘ʂʯ ͱͷ͜ͱͩͬͨͷͰzXFCEFWzͳͲΛ͜Ε͔Β஫ࢹͯ͠ ͍͘ͱ৘ใ͕ॆ࣮͍͖ͯͦ͠͏
25. ࢀՃͨ͠ײ૝ w +4$POG&6͸ྑ͔ͬͨʂʢདྷ೥͸͓ٳΈͳͷ͕࢒೦ʣ
    w μΠόʔγςΟʔ΁ͷҙ͕ࣝͱͯ΋ߴ͔ͬͨ
    w ొஃऀ΍ࢀՃऀͱͷڑ཭͕͔ۙͬͨ
26. JSConfEU XࢀՃใࠂ 2019.06.27 ∁ڮ ஌੒ Performance Empathyฤ ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ JSConfEU XࢀՃใࠂ Performance Empathyฤ NodeֶԂ34࣌ݶ໨