Slide 1

Slide 1 text

AbemaTV ৽ଔ1೥໨ΤϯδχΞ࣮࿥ Frontrend × Bonfire Frontend on 15th April 2019 @nodaguti from AbemaTV, Inc.

Slide 2

Slide 2 text

Who am I? • Tadahiro Noguchi (໺ޱ ௚׮) • @nodaguti • גࣜձࣾαΠόʔΤʔδΣϯτ 2018೥৽ଔೖࣾ • AbemaTV ։ൃຊ෦ WebνʔϜॴଐ

Slide 3

Slide 3 text

Contents ೥໨ΤϯδχΞ࣮࿥ ೥໨ʹ޲͚ͯ

Slide 4

Slide 4 text

ɹɹɹ೥໨ΤϯδχΞ࣮࿥

Slide 5

Slide 5 text

Contributions ഑ଐ͔Β1೥ऑͰ
 ໿560 PR
 = 1೔2PR͘Β͍? ໿10ສߦ = 1೔400ߦ͘Β͍?

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

2018/03: ಺ఆऀΞϧόΠτ (5೔ؒ)

Slide 8

Slide 8 text

2018/04-05: ৽ଔݚम

Slide 9

Slide 9 text

https://speakerdeck.com/nodaguti/ html-5-conference-2018-sponsors-lt ৽ଔݚमͰςετΧόϨοδ 99%Λୡ੒ͨ͠࿩ HTML5 Conference 2018 on 25th Nov 2018 Tadahiro Noguchi from CyberAgent, Inc.

Slide 10

Slide 10 text

2018/05/21: AbemaTV ΁഑ଐ

Slide 11

Slide 11 text

2018/05-06: খ͞ͳػೳͷ࣮૷

Slide 12

Slide 12 text

2018/05-06: খ͞ͳػೳͷ࣮૷

Slide 13

Slide 13 text

2018/05-06: খ͞ͳػೳͷ࣮૷ • ίϛοτɾPR ͷཻ౓΍ϨϏϡʔ΁ͷରԠํ๏ͳͲ͕Θ ͔ΔΑ͏ʹͳ͖ͬͯͨ • ࣗ෼͕୲౰ͨ͠ྖҬʹ͓͍ͯ͸ɼϨϏϡʔΛ͢Δଆʹ ΋ͳΔ͜ͱ͕Ͱ͖ͨ • 1-2 sprints ͰऴΘΔλεΫΛࣗྗͰ͜ͳͤΔঢ়ଶ

Slide 14

Slide 14 text

2018/06-07: Ϧίϝϯσʔγϣϯػೳ

Slide 15

Slide 15 text

2018/06-07: Ϧίϝϯσʔγϣϯػೳ

Slide 16

Slide 16 text

2018/06-07: Ϧίϝϯσʔγϣϯػೳ • Abema-way ͳ Flux ͷσʔλϑϩʔΛҰ௨Γ࡞ΔॳΊ ͯͷܦݧ • ൚༻ੑͷߴ͍࢓૊Έͮ͘Γ • ଞՕॴ΁ల։Մೳͳσʔλϑϩʔɾίϯϙʔωϯτ • Intersection Observer Λ༻͍ͨ impression ܭଌ • ಛघͳ෦෼ʢಈըपΓͳͲʣΛআ͚͹௨ৗͷػೳ͸ಠ ྗͰ࣮૷Ͱ͖ͦ͏ͱ͍͏ؾ࣋ͪʹ

Slide 17

Slide 17 text

2018/08-10: Abema ϏσΦ ϞόΠϧϒϥ΢β͔Βͷ ࢹௌରԠ

Slide 18

Slide 18 text

2018/08-10: Abema ϏσΦ ϞόΠϧࢹௌରԠ

Slide 19

Slide 19 text

2018/08-10: Abema ϏσΦ ϞόΠϧࢹௌରԠ • ࢓༷͕͋Δఔ౓ݻ·͍ͬͯΔେ͖ͳҊ݅ʹ͍ͭͯɼλ εΫ෼ղͯ͠ݟੵ΋ΓΛߦ͍ɼεέδϡʔϧ௨Γਐߦ͢ ΔྗΛཆ͑ͨ • ϞόΠϧϒϥ΢β΁ͷ஌ݟ͕ਂ·ͬͨ • Ͱ͖͍ͯͳ͔ͬͨ͜ͱ • ෆ֬ఆͳ͜ͱ΁ͷରԠɾଞηΫγϣϯͱͷ࿈ܞ • ࢓༷͸͢Ͱʹݻ·͍ͬͯͨ • ٕज़ݕূ͸ଞͷϝϯόʔ͕ߦͳ͍ͬͯͨ

Slide 20

Slide 20 text

2018/11: ݟಀ͠ࢹௌͷϞόΠϧରԠ

Slide 21

Slide 21 text

• ࣮૷ࣗମ͸ϏσΦͱ΄ͱΜͲมΘΒͳ͍ͨΊۤ࿑ͤͣ • ίΞͳ෦෼͸1೔Ͱ࣮૷Ͱ͖ͨ • ϞόΠϧϒϥ΢βΛͲ͏ϓϩμΫτͱͯ͠৳͹͔͢ʁ • ࠶ੜ͕࢝·Δલʹ཭୤ͯ͠͠·͏ϢʔβʔΛݮΒ͠ ͍ͨ • ࠷ऴతʹ͸ΞϓϦϢʔβʔʹͳͬͯ΋Β͍͍ͨ • ݪҼͱࢪࡦΛߟ͑ɼ࣮૷͢ΔαΠΫϧΛ࢝Ίͨ 2018/11: ݟಀ͠ࢹௌͷϞόΠϧରԠ

Slide 22

Slide 22 text

2018/11: Chrome Dev Summit ࢀՃ DISPNFEFWTVNNJUCSJFpOHTFTTJPO 'SPOUSFOE7PMPO%FDUI 5BEBIJSP/PHVDIJ !OPEBHVUJ $ISPNFνʔϜͷਪ͢ ͜Ε͔Β͘Δ৽͍͠8FC"1* https://speakerdeck.com/nodaguti/upcoming- web-apis-advocated-by-the-chrome-team

Slide 23

Slide 23 text

2018/12: ϞόΠϧࢹௌͷվળλεΫ Prettier ಋೖ ෛ࠴ฦࡁ

Slide 24

Slide 24 text

2019/01-04: ͱ͋ΔେܕҊ݅

Slide 25

Slide 25 text

2019/01-04: ͱ͋ΔେܕҊ݅ • Ҋ݅ͷಛ௃ • ࢓༷͕ᐆດ • σΟϨΫλʔɾଞσόΠεͷΤϯδχΞʹώΞ Ϧϯά • ϞόΠϧϒϥ΢βʹ߹͏࢓༷΁ͷམͱ͠ࠐΈ • σΟϨΫλʔɾσβΠφʔͱ౎౓૬ஊ • ಛఆͷλΠϛϯάͰαʔόʔʹϦΫΤετ͕ूத • αʔόʔαΠυΤϯδχΞͱ͢Γ߹Θͤ • ֤ॴͱ࿈ܞͯ͠࢓༷ΛݻΊɼϦϦʔε·Ͱ͍͚࣋ͬͯͨ

Slide 26

Slide 26 text

ɹɹɹɹ೥໨ʹ޲͚ͯ

Slide 27

Slide 27 text

ৼΓฦΓ • ʮֶੜΤϯδχΞʯ͔ΒʮࣄۀϓϩμΫτΛ࡞Δϓϩͷ ΤϯδχΞʯͱͯ͠੒௕͢Δ͜ͱ͕Ͱ͖ͨ ɹখ͞ͳ୯ػೳͷ࣮૷ →࢓༷͕ܾ·͍ͬͯΔେ͖ͳػೳͷ࣮૷ →࢓༷͕ᐆດͳେ͖ͳػೳͷ࣮૷ • ػೳ։ൃΛ2ͭͷࢹ఺͔Βଊ͑ΒΕΔΑ͏ʹͳͬͨ • Ͳ͏ UX ʹӨڹ͢Δ͔ʁ • Ͳ͏ KPI ʹӨڹ͢Δ͔ʁ

Slide 28

Slide 28 text

͔͜͜Βɺ͔͜͜Β • ࠓͷͱ͜Ζߟ͍͑ͯΔΩϟϦΞύε͸ςοΫϦʔυ • Ϧʔμʔγοϓ • ʮνʔϜͰ࡞Δʯͱ͍͏͜ͱʹର͢Δܦݧ • ઐ໳ੑ • High performance website • ʮٕज़͔ΒࣄۀʹߩݙͰ͖ΔΤϯδχΞʯ

Slide 29

Slide 29 text

Thank you!