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

20190130 - React - displayName - Lightning Talk

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Glenn 'devalias' Grant Glenn 'devalias' Grant
January 30, 2019
Technology
14
0

20190130 - React - displayName - Lightning Talk

A lightning talk I gave in 2019 on React displayName usage.

Avatar for Glenn 'devalias' Grant

Glenn 'devalias' Grant

January 30, 2019

More Decks by Glenn 'devalias' Grant

See All by Glenn 'devalias' Grant
Bug Bounty Hunting on Steroids [DEF CON 26]
Avatar for Glenn 'devalias' Grant 0xdevalias
0
300
Gophers, whales and.. clouds? Oh my!
Avatar for Glenn 'devalias' Grant 0xdevalias
0
470
Hack FaaSter: Leveraging Docker and OpenFaaS for fun and offensive (security) profit
Avatar for Glenn 'devalias' Grant 0xdevalias
0
290

Other Decks in Technology

See All in Technology
ACE-Step-1.5で見る 音楽生成AIのしくみと“破綻だけ直す”Retake機能の開発【zennfes spring 2026 登壇資料】
Avatar for asap personabb
1
450
非エンジニアがClaudeと挑んだ「1ヶ月間プロダクト30本ノック」
Avatar for kinako askokc
0
500
なぜ Platform Engineering の土台に Kubernetes を選ぶのか
Avatar for Ray r4ynode
2
640
アンオフィシャルな､オフィシャルからのお願い
Avatar for wataru yamazaki (DevRel) wyamazak_devrel
0
110
Claude Codeをどのように キャッチアップしているか
Avatar for Oikon oikon48
12
8k
Chainlitで作るお手軽チャットUI
Avatar for tomo ynt0485
0
240
Kiroで書いた 設計書 が AI レビューの 採点基準 になる
Avatar for shinji ezaki ezaki
0
110
脆弱性対応、どこで線を引くか
Avatar for ryoji miyamoto rymiyamoto
1
390
エラーバジェットのアラートのタイミングを考える.pdf
Avatar for KairiM kairim0
0
150
白金鉱業Meetup_Vol.24_「AIエージェントは分けるほど良い」は本当か？ / Is it true that “the more you divide AI agents, the better”?
Avatar for BrainPad brainpadpr
1
370
フィジカル版Github Onshapeの紹介
Avatar for shiba_8ro shiba_8ro
0
220
【Snowflake Summit 2026 Recap!!】Snowflake Summit Deep Dive: Security & Governance
Avatar for Civitaspo civitaspo
0
170

Featured

See All Featured
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
32
3.4k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
6
1.2k
Google's AI Overviews - The New Search
Avatar for Barry Adams badams
0
1k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
183
10k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
225
10k
Building the Perfect Custom Keyboard
Avatar for Naoto Takai takai
2
790
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
160
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
29
4.3k
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
1
2k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9.4k
Technical Leadership for Architectural Decision Making
Avatar for Kenny Baas-Schwegler baasie
3
410
The SEO identity crisis: Don't let AI make you average
Avatar for Varn varn
0
490

Transcript

  1. React: displayName Because trying to debug a nest of Unknown

    components is kind of meh..

  2. Functional Components

  3. React 16.6 https://reactjs.org/blog/2018/10/23/react-v-16-6.html

  4. React.memo Like React.PureComponent, but functional! https://reactjs.org/docs/react-api.html#reactmemo

  5. Memoized Functional Components

  6. React Developer Tools

  7. Memo -> Memo -> Unknown -> WTF?

  8. displayName? https://reactjs.org/docs/react-component.html#displayname

  9. Maybe not..? ES6 ‘Fat Arrow’ anonymous function Named function

  10. Wrapping Display Name https://reactjs.org/docs/higher-order-components.html#convention-wrap-the-display-name-fo r-easy-debugging

  11. memoWithDisplayName app/javascript/src/shared/react-helpers.js

  12. memoWithDisplayName

  13. Components.. withDisplayName(s)!

  14. But how do I know when I need it?

  15. But how do I know when I need it?

  16. But how do I know when I need it? ESLint

  17. ESLint: react/display-name https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/display-name.md

  18. Thank you!