Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
hatena-engineer-seminar-10
Search
tkzwtks
May 23, 2018
0
2.4k
hatena-engineer-seminar-10
Hatena Engineer Seminar #10 でお話した資料です
tkzwtks
May 23, 2018
Tweet
Share
More Decks by tkzwtks
See All by tkzwtks
データマイグレーションの成功戦略~サービスリニューアルで失敗しないための実践ガイド~
tkzwtks
10
2.8k
ちょっぴりDiveDeepするAWSの時間 AWS Dev Day 2023 Tokyo 延長戦 実践データ移行 〜はてなダイアリーや魔法のiらんどの事例と共に〜
tkzwtks
1
170
はてなスターにおける静的ファイル配信の話
tkzwtks
0
150
YAPC::Kyoto 2023 LT Perlブートキャンプご紹介
tkzwtks
0
1.3k
Hatena Engineer Seminar #14 魔法のiらんど データ移行編 〜新旧システム間のデータマイグレーション時に我々が考えること〜 / hatena-engineer-seminer-number-14-data-migration
tkzwtks
0
2.7k
レガシーシステムからのデータマイグレーションあれこれ
tkzwtks
4
1.7k
Featured
See All Featured
Why You Should Never Use an ORM
jnunemaker
PRO
56
9.4k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
6
690
Designing Experiences People Love
moore
142
24k
Building an army of robots
kneath
306
45k
Code Review Best Practice
trishagee
68
18k
The Language of Interfaces
destraynor
158
25k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
32
5.9k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
47
2.8k
Typedesign – Prime Four
hannesfritz
42
2.7k
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.5k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
Transcript
ͯͳͱ WebϚϯΨαʔϏεͷ าΈ Hatena Engineer Seminar #10 id:tkzwtks ʢ୍ᖒ ਸʣ
ࣗݾհ id:tkzwtks ୍ᖒ ਸ • 201611݄ೖࣾ • ୲αʔϏε • ϚϯΨαʔϏεશൠ
• ΧΫϤϜʢKADOKAWA༷ʣ
ຊ͓͢͠Δ͜ͱ
ຊ͓͢͠Δ͜ͱ • ͯͳͰ։ൃɾఏڙ͍ͯ͠ΔϚϯΨϏϡʔϫʔ ʮGigaViewerʯΛத৺ͱͨ͠ɺͯͳͱWebϚϯΨαʔϏε ͷาΈ • ͯͳͰWebϚϯΨαʔϏεΛ࡞Δ࣌ʹɺΤϯδχΞͱͯ͠ ߟ͍͑ͯΔ͜ͱ
GigaViewerͱ
GigaViewerͱ • ͯͳͰ։ൃͨ͠ɺWebαΠτͰͷ ϚϯΨӾཡʹಛԽ͠ɺϢʔβʔ͕շ దʹϚϯΨ࡞Λָ͠ΉͨΊͷػೳ Λඋ͑ͨϚϯΨϏϡʔϫɺίϯς ϯπొฤཧ༻ͷཧը໘ͳ ͲؚΊͨWebϚϯΨ৴αʔϏε • Viewerͱ͍͏໊લ͕ͩϚϯΨΛಡ
ΉϏϡʔϫʔ͚ͩΛࢦ͍ͯ͠ΔΘ ͚Ͱͳ͍
ࢦ͍ͯ͠Δͷ
GigaViewer͕ࢦ͍ͯ͠Δͷ • ͱʹ͔͘շదʹWebϚϯΨΛָ͠ΊΔΑ͏ͳϏϡʔϫʔͷ։ ൃ • ॎಡΈɾGIFΞχϝʔγϣϯը૾ɺWebϚϯΨͳΒͰ ͷ৽͍͠දݱରԠ • αʔϏεఏڙऀͷӡ༻ίετݮ •
গ͠Ͱӡ༻࡞ۀָ͕ʹͳΔΑ͏ʹ • ϚωλΠζ
GigaViewerҎલ • 20149݄ • গδϟϯϓϧʔΩʔʢݱʮδϟϯϓϧʔΩʔʂʯʣ • 20159݄ • ͋ͨ͠ͷϠϯάδϟϯϓ •
20163݄ • ͱͳΓͷϠϯάδϟϯϓ Ϗϡʔϫʔఏڙ
δϟϯϓʴ Web൛ ϦχϡʔΞϧ 20171݄
δϟϯϓʴWeb൛ϦχϡʔΞϧ • ࠷ॳͷGigaViewerಋೖࣄྫ • δϟϯϓϧʔΩʔʂ / ͋ͨ͠ͷϠϯάδϟϯϓͰಘͨݟ ΛݩʹɺGigaViewerΛ։ൃ • ͦΕ·ͰͷWeb൛ΛϦχϡʔΞϧ
• ϚϯΨΛಡΈʹ͖͍ͯΔී௨ͷϢʔβʔ͚ͷػೳ͚ͩͰ ͳ͘ɺʮWebϚϯΨαʔϏεΛӡӦ͢ΔͨΊʹඞཁͳ ΈʯΛ։ൃ
δϟϯϓʴWeb൛ϦχϡʔΞϧ • ͯͳʹɺϚϯΨ৴४උͷʑͷӡ༻ʹؔ͢Δࣝ ΄ͱΜͲͳ͔ͬͨ • ӡ༻͍͍͍ͯͨͩͯ͠Δձࣾͷํʑͱࡉ͔͘ίϛϡχέ ʔγϣϯΛऔΔ • GigaViewerͰʮδϟϯϓʴWeb൛ʯΛӡ༻ՄೳʹͰ͖Δ Α͏ͳػೳΛ࣮͍ͯ͘͠
δϟϯϓʴWeb൛ϦχϡʔΞϧ • ࡞ͬͨͷ·ͣ৮͍ͬͯͨͩ͘ • ʮͪ͜Β͕ఆ͍ͯ͠ͳ͍ΘΕํʯΛग़ͯ͠Β͏ͨΊ • গͮͭ͠ϑΟʔυόοΫΛ͖ɺվળ͢Δͱ͍͏͜ͱΛ܁ Γฦ͢ • ࠷ॳ͔Βᘳͳঢ়ଶʹ͢ΔͷͰͳ͘ɺঃʑʹվળ͍ͯ͘͠
δϟϯϓʴWeb൛ϦχϡʔΞϧ • ͯͳͰ͜Ε·Ͱओʹ͖ͬͯͨUGCαʔϏεͰͳ͘ɺ ʮެࣜͷWebϚϯΨαʔϏεʯ • αΠτΦʔϓϯͱಉ࣌ʹେྔͷίϯςϯπΛ४උ͢Δඞཁ ͕͋ͬͨ • ϦϦʔεલɺ४උͭͭ͠طଘͷαΠτͱฒߦӡ༻
δϟϯϓʴWeb൛ϦχϡʔΞϧ • ެࣜαΠτͳͷͰɺࣦഊͰ͖ͳ͍ۓுײ͕͋ͬͨ • ۓுײָ͕͋ͬͨ͠Έ͋ͬͨ • δϟϯϓʴWebͷϦχϡʔΞϧͰʮެࣜͷWebϚϯΨαʔϏ εΛӡӦ্͍ͯ͘͠Ͱඞཁͳ͜ͱʯͷݟΛͨΊ͍ͯ͘
ͱͳΓͷ Ϡϯάδϟϯϓ ϦχϡʔΞϧ 201710݄
ͱͳΓͷϠϯάδϟϯϓϦχϡʔΞϧ • GigaViewerͷ2ྫͷ࠾༻ • ΞϓϦέʔγϣϯΛϚϧνςφϯτԽ • gifը૾ͷೖߘʹରԠ • δϟϯϓʴͰͷݟΛͱʹӡ༻πʔϧΛվྑ •
मਖ਼ࣗମδϟϯϓʴʹؐݩ͞ΕΔΑ͏ͳܗʹ • ӡ༻͍͍͍ͯͨͩͯ͠ΔํʑͷཁΛฉ͍͍ͯ͘
ϚΨδϯϙέοτ Web൛ ϦχϡʔΞϧ 201710݄
ϚΨϙέWebϦχϡʔΞϧ • 3ྫͷ࠾༻ • ΞϓϦέʔγϣϯͷϚϧνςφϯτԽʹΑΓɺૉૣ͘ϦϦʔ εޭ • ʮ࿈ࡌҰཡϖʔδʯɺ͜Ε·Ͱʹ࣮͖ͯͨ͠ػೳʢࢿ ࢈ʣΛར༻Մೳ
ϚϧνςφϯτܕΞʔΩςΫνϟಋೖ • ҰͭͷΞϓϦέʔγϣϯͰɺෳͷαΠτΛαʔϏεͰ͖Δ Α͏ʹ • ෳαΠτͰɺҰͭͷDBΛڞ༗ • ϚϯΨը૾ࣗମαΠτຖʹཧ • ։ൃॳݕ౼͍͕ͯͨ͠ɺ࠷ॳݟૹ͍ͬͯͨ
ϚϧνςφϯτܕΞʔΩςΫνϟಋೖ • ෳͷαΠτΛҰͭͷΞϓϦέʔγϣϯ্Ͱӡ༻Ͱ͖ΔΑ͏ ʹͯ͠ɺͰ͖Δ͚ͩૉૣ͘αʔϏε͕։࢝Ͱ͖ΔΑ͏ʹ͢Δ • ҰॠͰαΠτΛ૿ͤΔͱ͍͏͜ͱͰͳ͘ɺΛݮ ͢Δɺͱ͍͏ҙຯ
ϚϧνςφϯτܕΞʔΩςΫνϟಋೖ • ػೳΛՃͰଞͷαΠτͰར༻͢Δ͜ͱ͕ՄೳʹͳΔ • ࿈ࡌҰཡ / Ӿཡཤྺอ࣋ / ϒϩάύʔπ •
αΠτ͝ͱͷΧελϚΠζՄೳ • ͱͳΓͷϠϯάδϟϯϓͷʮίϚετϦʔϜʯʢτοϓϖ ʔδ্෦ͷϚϯΨͷίϚ෦ʣͷΑ͏ͳઐ༻ͷػೳͷ࣮
ίϛοΫDAYS ϦϦʔε 20182݄
ίϛοΫDAYS • 4ྫͷ࠾༻ • ʮແྉͷWebϚϯΨʯ͚ͩͰͳ͘ɺ༗ྉϚϯΨ૿͑ͨͨ ΊɺϚϯΨΛചΔͨΊͷػೳΛՃ͍ͯ͘͠ • ϢʔβʔΞΧϯτ / ϙΠϯτͰͷϚϯΨߪೖ
/ ܾࡁ etc... • ࣮͖͢ػೳ͕Ұؾʹ૿͑Δ
ϚΠΫϩαʔϏε vs ϞϊϦγοΫ খ͞ͳαʔϏεͱͯ͠৽نػೳΛ࣮͍͖ͯ͠ɺଞͷαΠτͰ ͑ΔΑ͏ʹͰ͖ΔΑ͍ͷͰͳ͍͔ʁ • খ͞ͳαʔϏεͱͯ͠࡞͓͚ͬͯϝϯς͍͢͠ͷͰʁ
ϚΠΫϩαʔϏε vs ϞϊϦγοΫ ݁ہݟૹͬͨ • ࠓޙͦ͏͍͏αΠτ͕ଞʹग़ͯ͘Δ͔Ͳ͏͔Θ͔Βͳ ͍ɺ ະདྷͷ͜ͱΘ͔Βͳ͍ • ࠷ॳ͔Βׂ͢ΔΑΓɺϞϊϦγοΫʹ࣮ͭͭ͠ɺޙ͔Β
গׂͮͭ͢͠Δ΄͏ׂ͕͍͢͠ʢͣʣ
ίϛοΫDAYS • ʮίϛοΫDAYSͰͷϢʔεέʔεʯͷΈʹϑΥʔΧεͯ͠ඞ ཁͳػೳΛׂ͠ɺ࣮͍ͯ͘͠ • ଞͷαΠτͰ͏ࣄʹͳͬͨ߹ʹ͏Ұݟ͢ɺͱ ͍͏લఏ • ͦΕҎ֎ࠓ·ͰͰطʹ࣮ࡁΈͩͬͨͷΛར༻ •
νʔϜͱܾͯ͠ࡁؔ࿈ػೳॳΊͯͷઓ͕ͩͬͨɺ༧ఆ ௨ΓϦϦʔεͰ͖ͨ
͘Β͛όϯν ϦχϡʔΞϧ 20184݄
͘Β͛όϯν • 5ྫͷ࠾༻ • ৽ػೳՃͭͭ͠ɺ1ϲ݄ఔͰϦϦʔεͰ͖ͨ • ͜Ε·Ͱͷࢿ࢈Λར༻Մೳ • ΛͰ͖Δ͚ͩݮΒͯ͠ૉૣ͘ϦϦʔε
ٕज़తʹͲ͏͍͏ઓུΛͱ͖͔ͬͯͨ 1ΛৼΓฦͬͯΈΔ • ඞཁͳػೳΛগͮͭ͠૿͍ͯ͘͠ • ະདྷͷ͜ͱ૾Ͱ͖ͳ͍ • ඞཁͷແͦ͞͏ͳ࡞ΓࠐΈ͠ͳ͍ • ୯७ʹʮࠓ͜ΕΒͳ͍ʯΈ͍ͨʹఘΊΔ
• Ͱ͖Δ͚ͩૉૣ͘ɺ࣮֬ʹϦϦʔε͢Δ
ٕज़తʹͲ͏͍͏ઓུΛͱ͖͔ͬͯͨ • ৽ػೳΛ૿͢ʁ or طଘͷͷ͕͑Δʁ • मਖ਼͢ΕଞͷαΠτͰར༻ՄೳͳΒमਖ਼͢Δͷ͕ૣ͍ • ϞϊϦγοΫ /
ϚϧνςφϯτͳΞʔΩςΫνϟ • ݱ࣌Ͱ͏·͍͍ͬͯ͘Δ • ػೳΛԣల։͍͢͠ͷͰɺଘࡏ͢ΔػೳΛར༻Ͱ͖Ε ΛݮΒͭͭ͠αΠτΛΦʔϓϯՄೳ
WebϚϯΨαʔϏεΛ࡞Δ࣌ʹҰ؏͠ ͯߟ͍͑ͯΔ͜ͱ • ʮ͓٬༷Λࣗͨͪͷٕज़Ͱॿ͚ΔʯʮҰॹʹαʔϏεΛ࡞ ͍ͬͯ͘ʯͱ͍͏ؾ࣋ͪ • slackΛར༻ͯ͠ίϛϡχέʔγϣϯີʹ͢Δ • େྔͷίϯςϯπͷΠϯϙʔτɺӡ༻ͰͷࠔΓࣄΛαϙ ʔτ
• ίϯςϯπΛͱʹ͔͘େࣄʹ͢Δ
WebϚϯΨαʔϏεΛ࡞Δ࣌ʹҰ؏͠ ͯߟ͍͑ͯΔ͜ͱ • ࣗͨͪͷઓߟ͑Δ • ৽͍͜͠ͱʹઓͯ͠ɺ͕ࣗͨͪͰ͖Δ͜ͱΛ૿͢ • ৽͍͠ઓʹ͍͓ͭͯ٬༷ʹఏҊ͢Δ
GigaViewerΛগͮͭ͠ ਐา͍͖ͤͯ͞ɺWebϚ ϯΨαʔϏεΛ͞Βʹൃ ల͍͖ͤͯ͞·͢