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
うわっ…リスト表示重すぎ… Reactのパフォーマンス改善の処方箋/react-list-p...
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
pentla
August 25, 2021
Programming
3
870
うわっ…リスト表示重すぎ… Reactのパフォーマンス改善の処方箋/react-list-performance-improvement
pentla
August 25, 2021
Tweet
Share
Other Decks in Programming
See All in Programming
Combinatorial Interview Problems with Backtracking Solutions - From Imperative Procedural Programming to Declarative Functional Programming - Part 2
philipschwarz
PRO
0
150
そのAIレビュー、レビューしてますか? / Are you reviewing those AI reviews?
rkaga
5
4.2k
Unicodeどうしてる? PHPから見たUnicode対応と他言語での対応についてのお伺い
youkidearitai
PRO
0
970
実は歴史的なアップデートだと思う AWS Interconnect - multicloud
maroon1st
0
350
例外処理とどう使い分ける?Result型を使ったエラー設計 #burikaigi
kajitack
16
5.8k
Graviton と Nitro と私
maroon1st
0
170
CSC307 Lecture 06
javiergs
PRO
0
660
Fragmented Architectures
denyspoltorak
0
140
AtCoder Conference 2025
shindannin
0
990
ThorVG Viewer In VS Code
nors
0
750
Architectural Extensions
denyspoltorak
0
240
AI前提で考えるiOSアプリのモダナイズ設計
yuukiw00w
0
220
Featured
See All Featured
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
11
800
Reflections from 52 weeks, 52 projects
jeffersonlam
356
21k
Tips & Tricks on How to Get Your First Job In Tech
honzajavorek
0
420
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.3k
4 Signs Your Business is Dying
shpigford
187
22k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.3k
Odyssey Design
rkendrick25
PRO
0
470
Ten Tips & Tricks for a 🌱 transition
stuffmc
0
57
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.3k
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
400
Balancing Empowerment & Direction
lara
5
850
Digital Ethics as a Driver of Design Innovation
axbom
PRO
1
150
Transcript
͏ΘͬʜϦετදࣔॏ͗͢ʜ 3FBDUͷύϑΥʔϚϯεվળͷॲํᝦ
2,ݱঢ়ੳͱ ࣗݾհ ɾ!QFOUMB ลҰً ɾ'"45"-&35νʔϜ ɾϑϩϯτ݉όοΫΤϯυΤϯδχΞ ɾ"QFY3VTUಡॻ
2,ݱঢ়ੳͱ 5XFFU%FDL࡞ͬͯʂ ͬͯݴΘΕͨΒɺͲ͏͠·͢ʁ ૣ
2,ݱঢ়ੳͱ ͋Δఔͨ͠ͱͯ͠ ɾͱΓ͋͑ͣ3FBDUͰ ɾ"1*ͱͷܨ͗ࠐΈͳΜͱ͔ྃʂ ɾσʔλ͕දࣔͰ͖ΔΑ͏ʹͳΓ·ͨ͠
2,ݱঢ়ੳͱ ͨͩ͠ɻɻɻ͜ͷΑ͏ͳཁ͕݅དྷͯ͠·͍·ͨ͠ ɾ৽͍͠λΠϜϥΠϯ͕࣍ʑͱདྷΔ͔Βදࣔͯ͠Ͷʂ ɾԼʹεΫϩʔϧ͢ΔͱաڈͷλΠϜϥΠϯΛḪΕΔΑ͏ʹͶ ɾը૾ɾಈըΛද͍ࣔͨ͠Ͷ
2,ݱঢ়ੳͱ ॏ͘ͳΔɻ ʷ
2,ݱঢ়ੳͱ ࠓճʮ3FBDUʯͷʮϦετදࣔʯͷΛ͠·͢
2,ݱঢ়ੳͱ Ͳ͏͢Δ͖͔ɿ3FBDUͷυΩϡϝϯτ ʰΞϓϦέʔγϣϯ͕͍σʔλͷϦετʢඦʙઍߦʣΛϨϯμʔ͢Δ߹ɺ ʮΟϯυΠϯάʯͱͯ͠ΒΕΔςΫχοΫΛ͏͜ͱΛ͓͢͢Ί͠·͢ɻ͜ͷςΫχο ΫͰɺ͋Δॠؒ͝ͱʹϦετͷখ͞ͳ෦ू߹ͷΈΛඳը͢Δ͜ͱͰɺੜ͢Δ%0. ϊʔυͷ͓Αͼίϯϙʔωϯτͷ࠶ඳըʹ͔͔Δ࣌ؒΛେ෯ʹݮ͢Δ͜ͱ͕Ͱ͖·͢ɻʱ ʰSFBDUXJOEPXͱSFBDUWJSUVBMJ[FEਓؾ͕͋ΔΟϯυΠϯάॲཧͷϥΠϒϥϦͰ ͢ɻ͜ΕΒϦετɺάϦουɺ͓ΑͼදܗࣜͷσʔλΛදࣔ͢ΔͨΊͷɺ͍͔ͭ͘ͷ࠶ར༻ ՄೳίϯϙʔωϯτΛఏڙ͍ͯ͠·͢ɻΞϓϦέʔγϣϯͷಛఆͷϢʔεέʔεʹ߹Θͤͨ ՃతͳॲཧΛ͢Δ߹ɺ5XJUUFS͕ߦͳ͍ͬͯΔΑ͏ʹɺಠࣗͷΟϯυΠϯάॲཧͷίϯ
ϙʔωϯτΛ࡞͢Δ͜ͱͰ͖·͢ɻʱ
2,ݱঢ়ੳͱ ΟϯυΠϯά XJOEPXJOH ͱ ʰ͜ͷςΫχοΫͰɺ͋Δॠؒ͝ͱʹϦετͷখ͞ͳ ෦ू߹ͷΈΛඳը͢Δ͜ͱͰɺੜ͢Δ%0.ϊʔυͷ ͓Αͼίϯϙʔωϯτͷ࠶ඳըʹ͔͔Δ࣌ؒΛେ෯ʹ ݮ͢Δ͜ͱ͕Ͱ͖·͢ɻʱ ݪҼϢʔβʔ͕Έ͍ͯͳ͍ൣғ·Ͱ ඳըͯ͠͠·͍ͬͯΔ͜ͱ
2,ݱঢ়ੳͱ ਤʹ͢Δͱ͜͏ ɾϦετͷେ෦Կඳը͠ͳ͍ ɾσΟεϓϨΠʹө͍ͬͯΔ෦ͷΈ ඳը͢Δ ɾεΫϩʔϧʹ߹ΘͤͯඳըൣғΛ ௐઅ͢Δ
2,ݱঢ়ੳͱ ͰɺͲ͏࣮ͬͯ͢Δ͔ ɾશମͷߴ͞ΞΠςϜͭͷαΠζʷݸ ɾඳը࢝͠ΊΔߴ͞ݱࡏͷεΫϩʔϧҐஔ ͔ΒσΟεϓϨΠͷߴ͞·Ͱ
2,ݱঢ়ੳͱ SFBDUXJOEPXΛ͑ղܾʁ ϝϞ ɾSFBDUXJOEPXSFBDUWJSUVBMJ[FEͱಉ͡ਓ͕ॻ͍ͨϥΠϒϥϦ ɾαΠζΛݮΒ͠ɺύϑΥʔϚϯεΛ্ͤͨ͞ޙܧʹͨΓ·͢ ɾSFBDUXJOEPXL# SFBDUWJSUVBMJ[FE.#
2,ݱঢ়ੳͱ ࠓճ؆ૉͳྫͰ࣮ΛݟͯΈ·͢
2,ݱঢ়ੳͱ 6*ΛݟͯΈΔͱ ؆ૉ
2,ݱঢ়ੳͱ ͜Ε͕
2,ݱঢ়ੳͱ ͜͏ͳΓ·ͨ͠ ɾXJEUI IFJHIU Ϧετશମͷ͞ɺߴ͞ ɾJUFN$PVOU ΞΠςϜશମͷݸ ɾJUFN4J[F ΞΠςϜͭͭͷߴ͞
2,ݱঢ়ੳͱ ॻ͖ํ͕݁ߏҧ͏ ɾ3PXͬͯԿ NBQܗࣜͰهड़Ͱ͖ͳ͍ ɾIFJHIUɺͰࢦఆ͠ͳ͍ͱμϝʁ ɾΞΠςϜͷߴ͞ʁ ݁ߏΫη͕͋ΔΑͶɺͱ͍͏ͷ͕ ࠓճͷຊͰ͢
2,ݱঢ়ੳͱ 6*্͜͏ͳΓ·͢ ͍͍ͱ͜Ζ ɾສ݅දࣔͯ͠ಈ࡞͕͍ܰʂ ࠷ॳͷNBQΛ͏ͱສ݅͋ͨΓ͕ݶք ඍົͳͱ͜Ζ ɾԼ͕༨ͬͯΔ ߴ͕͞ʹͰ͖͍ͯͳ͍
ɾݸʑͷΞΠςϜͷߴ͞Λݻఆ͢Δඞཁ͕͋Δ
ٙᶃ 23PXͬͯԿ NBQܗࣜͰ هड़Ͱ͖ͳ͍ͷʁ "*UFNΛҰݸͣͭϨϯμϦϯά͢ΔͷͰͳ ͘ɺඞཁͳݸ͚ͩϨϯμϦϯά͢Δɻ શ෦ϨϯμϦϯά͠ͳ͍ͷͰɺ3PXྻͭ ͋ͨΓͷ༰Ͱ͋Δඞཁ͕͋Δɻ
2,ݱঢ়ੳͱ ͰɺͲ͏࣮ͬͯ͢Δ͔ ͓͞Β͍ ɾશମͷߴ͞ΞΠςϜͭͷαΠζʷݸ ɾඳը࢝͠ΊΔߴ͞ݱࡏͷεΫϩʔϧҐஔ ͔ΒσΟεϓϨΠͷߴ͞·Ͱ
2,ݱঢ়ੳͱ ٙᶄ 2IFJHIUɺͰࢦఆ͠ͳ͍ͱ μϝʁ "SFBDUWJSUVBMJ[FEBVUPTJ[FSΛ͑ େৎ
2,ݱঢ়ੳͱ ٙᶄ 2IFJHIUɺͰࢦఆ͠ͳ͍ͱ μϝʁ "SFBDUWJSUVBMJ[FEBVUPTJ[FSΛ͑ େৎ ࣮ޙͪ͜Β
2,ݱঢ়ੳͱ 2ΞΠςϜͷߴ͞ʁ "શମͷߴ͞Λਪఆͯ͠ɺݱࡏͷεΫϩʔϧ ҐஔΛѲ͢ΔͨΊʹඞਢɻ ͨͩ͠ɺΞΠςϜ͕ՄมαΠζͷ࣌ʹɻɻɻ ٙᶅ
2,ݱঢ়ੳͱ 2ΞΠςϜͷߴ͞ʁ "શମͷߴ͞Λਪఆͯ͠ɺݱࡏͷεΫϩʔϧ ҐஔΛѲ͢ΔͨΊʹඞਢɻ ͨͩ͠ɺΞΠςϜ͕ՄมαΠζͷ࣌ʹɻɻɻ 7BSJBCMF4J[F-JTUΛར༻Ͱ͖Δͷͷɺ ͋Β͔͡Ίߴ͕͞Θ͔͍ͬͯͳ͍ͱ࡞Εͳ͍ ٙᶅ
2,ݱঢ়ੳͱ ಉ͜͡ͱΛ͍͚ͨͩ͠ ͳͷʹʜɻ
2,ݱঢ়ੳͱ ݁ߏ͠ΜͲ͍
2,ݱঢ়ੳͱ ݁ແཧͯ͠͏͜ͱͳ͍ ɾϓϩδΣΫτͷ࠷ॳͦΕͦ͜NBQͷ࣮Ͱे ɾগ͠ॏ͍ఔͰ͋Εɺը૾ͷ-B[ZMPBEJOHɾඳըΛ ݮΒ͢ͳͲͰରԠ ɾͦΕͰඳը͕ʹͳͬͯ͠·ͬͨ߹ͷΞϓϩʔν
2,ݱঢ়ੳͱ ผղSFBDUWJSUVPTP ಉ͜͡ͱ͕Ͱ͖ͯɺ ݁ߏγϯϓϧ 4UBSL 4J[F.#
2,ݱঢ়ੳͱ ผΞϓϩʔνฤDPOUFOUWJTJCJMJUZ $44ͰͰ͖ΔͷͰൺֱత͓खܰɻ ରϒϥβ͕$ISPNJVNܥ $ISPNF 0QFSB &EHF ʹߜͬͯ Α͚Ε͋Γ
2,ݱঢ়ੳͱ ࠷ޙʹ ʰ೦ͳ͕Βɺ؆୯ͳमਖ਼͚ͭͩͰ͋Γ·ͤΜɻύϑΥʔϚϯεɺ վળ͢ΔྖҬΛࢹ͓Αͼଌఆ͢ΔܧଓతͳήʔϜͰ͢ɻʱ ࠓճͷΛखࡳͷͭͱ͍͚ͯͬͯͨͩͨ͠Β ͱࢥ͍·͢ʂ
ࢀߟจݙ ʮύϑΥʔϚϯε࠷దԽʯIUUQTKBSFBDUKTPSHEPDTPQUJNJ[JOHQFSGPSNBODFIUNMWJSUVBMJ[FMPOHMJTUT ʮ5XJUUFS-JUFBOE)JHI1FSGPSNBODF3FBDU1SPHSFTTJWF8FC"QQTBU4DBMFʯ IUUQTNFEJVNDPN!QBVMBSNTUSPOHUXJUUFSMJUFBOEIJHIQFSGPSNBODFSFBDUQSPHSFTTJWF XFCBQQTBUTDBMFEBFB ʮSFBDUXJOEPXʯIUUQTHJUIVCDPNCWBVHIOSFBDUXJOEPXIPXJTSFBDUXJOEPX EJ ff FSFOUGSPNSFBDUWJSUVBMJ[FE͔Βҙ༁ ʮSFBDUWJSUVBMJ[FEOQNʯIUUQTXXXOQNKTDPNQBDLBHFSFBDUWJSUVBMJ[FE
ʮSFBDUXJOEPXOQNʯIUUQTXXXOQNKTDPNQBDLBHFSFBDUXJOEPX ʮ࠲ΔೣͷΠϥετʯIUUQTXXXJSBTVUPZBDPNCMPHQPTU@IUNM ʮDPOUFOUWJTJCJMJUZʯIUUQTXFCEFWDPOUFOUWJTJCJMJUZ
Thank you!