--- id: P-REINFORCE-AUTO-92BBDE category: "10_Wiki/๐Ÿ’ก Topics/Programming & Language" confidence_score: 0.90 tags: [auto-reinforced] last_reinforced: 2026-04-20 github_commit: "[P-Reinforce] Continuous Worker - Throttling Debouncing" --- # [[Throttling Debouncing|Throttling Debouncing]] ## ๐Ÿ“Œ ํ•œ ์ค„ ํ†ต์ฐฐ (The Karpathy Summary) > ์Šคํฌ๋กค, ํ™”๋ฉด ํฌ๊ธฐ ์กฐ์ ˆ(Resize), ํƒ€์ดํ•‘ ๋“ฑ ์งง์€ ์‹œ๊ฐ„ ๋™์•ˆ ๊ณผ๋„ํ•˜๊ฒŒ ๋ฐœ์ƒํ•˜๋Š” ์‚ฌ์šฉ์ž ์ด๋ฒคํŠธ์˜ ์‹คํ–‰ ๋นˆ๋„๋ฅผ ์ œ์–ดํ•˜์—ฌ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์˜ ์„ฑ๋Šฅ ๋ณ‘๋ชฉ ํ˜„์ƒ์„ ๋ฐฉ์ง€ํ•˜๋Š” ์ตœ์ ํ™” ๊ธฐ๋ฒ•์ž…๋‹ˆ๋‹ค. ## ๐Ÿ“– ๊ตฌ์กฐํ™”๋œ ์ง€์‹ (Synthesized Content) **1. ํ•„์š”์„ฑ ๋ฐ ์„ฑ๋Šฅ ์˜ํ–ฅ** ์‚ฌ์šฉ์ž์˜ ํ™”๋ฉด ํฌ๊ธฐ ์กฐ์ ˆ, ํ‚ค๋ณด๋“œ ํƒ€์ดํ•‘, ๋งˆ์šฐ์Šค ์Šคํฌ๋กค ๊ฐ™์€ ์ด๋ฒคํŠธ๋Š” ์•„์ฃผ ์งง์€ ์‹œ๊ฐ„์— ์ˆ˜์‹ญ~์ˆ˜๋ฐฑ ๋ฒˆ์”ฉ ์—ฐ์†์ ์œผ๋กœ ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค. ์ด ์ด๋ฒคํŠธ๋งˆ๋‹ค ๋ฌด๊ฑฐ์šด ์—ฐ์‚ฐ์ด๋‚˜ React์˜ ์ƒํƒœ ์—…๋ฐ์ดํŠธ๋ฅผ ์ˆ˜ํ–‰ํ•˜๋ฉด ๋งค ํ‹ฑ(tick)๋งˆ๋‹ค ๋ถˆํ•„์š”ํ•œ ๋ฆฌ๋ Œ๋”๋ง์ด๋‚˜ ์žฌ๊ณ„์‚ฐ์ด ๋ฐœ์ƒํ•˜์—ฌ ์‹ฌ๊ฐํ•œ ์„ฑ๋Šฅ ๋ณ‘๋ชฉ(Bottleneck) ํ˜„์ƒ์„ ์ดˆ๋ž˜ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. **2. ๋””๋ฐ”์šด์‹ฑ (Debouncing)** ์—ฐ์ด์–ด ๋ฐœ์ƒํ•˜๋Š” ์ด๋ฒคํŠธ๋ฅผ ํ•˜๋‚˜๋กœ ๋ฌถ์–ด, ํŠน์ • ์‹œ๊ฐ„ ๋™์•ˆ ์ถ”๊ฐ€์ ์ธ ์ด๋ฒคํŠธ๊ฐ€ ๋ฐœ์ƒํ•˜์ง€ ์•Š์„ ๋•Œ ๋งˆ์ง€๋ง‰์— ๋‹จ ํ•œ ๋ฒˆ๋งŒ ์ด๋ฒคํŠธ ํ•ธ๋“ค๋Ÿฌ๋ฅผ ์‹คํ–‰ํ•˜๋Š” ๊ธฐ๋ฒ•์ž…๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด `lodash` ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์˜ `debounce` ํ•จ์ˆ˜๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์‚ฌ์šฉ์ž๊ฐ€ ์ฐฝ ํฌ๊ธฐ ์กฐ์ ˆ์„ ๋ฉˆ์ถ˜ ๋’ค 200ms๊ฐ€ ์ง€๋‚ฌ์„ ๋•Œ๋งŒ ๋ฆฌ์‚ฌ์ด์ฆˆ ๋กœ์ง์ด ์ฒ˜๋ฆฌ๋˜๋„๋ก ์ œํ•œํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. **3. ์Šค๋กœํ‹€๋ง (Throttling)** ์ด๋ฒคํŠธ๊ฐ€ ์—ฐ์†ํ•ด์„œ ๋ฐœ์ƒํ•˜๋”๋ผ๋„ ์ •ํ•ด์ง„ ์‹œ๊ฐ„ ๊ฐ„๊ฒฉ ๋‹น ์ตœ๋Œ€ ํ•œ ๋ฒˆ์”ฉ๋งŒ ํ•จ์ˆ˜๊ฐ€ ์‹คํ–‰๋˜๋„๋ก ๋ณด์žฅํ•˜๋Š” ๊ธฐ๋ฒ•์ž…๋‹ˆ๋‹ค. (์ด์ „ ๋Œ€ํ™” ์ฐธ๊ณ : Web Worker๋กœ ๋งˆ์šฐ์Šค์˜ ์œ„์น˜๋ฅผ ์ง€์†์ ์œผ๋กœ ํฌ์›Œ๋”ฉํ•  ๋•Œ, ๋ฉ”์‹œ์ง€ ํ์— ๊ณผ๋ถ€ํ•˜๊ฐ€ ๊ฑธ๋ฆฌ์ง€ ์•Š๋„๋ก ์ฃผ๊ธฐ๋ฅผ ์กฐ์ ˆํ•˜๋Š” ๋ฐ ์œ ์šฉํ•˜๊ฒŒ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค.) **4. ๊ตฌํ˜„ ์‹œ ๋ฒˆ๋“ค ์ตœ์ ํ™” (Tree Shaking) ์ฃผ์˜์‚ฌํ•ญ** ์ด๋Ÿฌํ•œ ๊ธฐ๋ฒ•์„ ์ ์šฉํ•˜๊ธฐ ์œ„ํ•ด `lodash`์™€ ๊ฐ™์€ ์™ธ๋ถ€ ์œ ํ‹ธ๋ฆฌํ‹ฐ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์‚ฌ์šฉํ•  ๋•Œ๋Š” ๋ฒˆ๋“ค ํฌ๊ธฐ ์ตœ์ ํ™”์— ์ฃผ์˜ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. `import _ from 'lodash';`์™€ ๊ฐ™์ด ์ „์ฒด ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ๋ถˆ๋Ÿฌ์˜ค๋ฉด ๋ฒˆ๋“ค ํฌ๊ธฐ๊ฐ€ ํฌ๊ฒŒ ์ฆ๊ฐ€ํ•˜๋ฏ€๋กœ, `import { debounce } from 'lodash-es';` ๋˜๋Š” `import debounce from 'lodash-es/debounce';` ํ˜•ํƒœ๋กœ ํ•„์š”ํ•œ ๊ฐœ๋ณ„ ํ•จ์ˆ˜๋งŒ ๊ฐ€์ ธ์™€ ํŠธ๋ฆฌ ์‰์ดํ‚น(Tree Shaking)์ด ์™„๋ฒฝํžˆ ์ ์šฉ๋˜๋„๋ก ์ž‘์„ฑํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. ## โš ๏ธ ๋ชจ์ˆœ ๋ฐ ์—…๋ฐ์ดํŠธ (Contradictions & RL Update) - **๊ณผ๊ฑฐ ๋ฐ์ดํ„ฐ์™€์˜ ์ถฉ๋Œ:** ์ž๋™ํ™” ์—”์ง„์— ์˜ํ•ด ๋งคํ•‘๋œ ์ง€์‹์œผ๋กœ, ์ถ”ํ›„ ์ •๋ฐ€ ๊ฒ€์ฆ ํ•„์š”. - **์ •์ฑ… ๋ณ€ํ™”:** Programming & Language ๋ถ„์•ผ์˜ ์ž๋™ ์ž์‚ฐํ™” ์ˆ˜ํ–‰. ## ๐Ÿ”— ์ง€์‹ ์—ฐ๊ฒฐ (Graph) - **Related Topics:** [[React Performance Optimization|React Performance Optimization]], [[Tree Shaking (แ„‡แ…ฅแ†ซแ„ƒแ…ณแ†ฏ แ„แ…ณแ„€แ…ต แ„Žแ…ฌแ„Œแ…ฅแ†จแ„’แ…ช)|Tree Shaking (๋ฒˆ๋“ค ํฌ๊ธฐ ์ตœ์ ํ™”)]], [[แ„‹แ…ตแ„‡แ…ฆแ†ซแ„แ…ณ แ„‘แ…ฉแ„‹แ…ฏแ„ƒแ…ตแ†ผ(Event Forwarding)|์ด๋ฒคํŠธ ํฌ์›Œ๋”ฉ (Event Forwarding)]], [[แ„‡แ…ฎแ†ฏแ„‘แ…ตแ†ฏแ„‹แ…ญแ„’แ…กแ†ซ แ„…แ…ตแ„…แ…ฆแ†ซแ„ƒแ…ฅแ„…แ…ตแ†ผ แ„‡แ…กแ†ผแ„Œแ…ต|๋ถˆํ•„์š”ํ•œ ๋ฆฌ๋ Œ๋”๋ง ๋ฐฉ์ง€]] - **Projects/Contexts:** ์‹ค์‹œ๊ฐ„ ๊ฒ€์ƒ‰ ์ž…๋ ฅ(Typing) ์ง€์—ฐ ์ฒ˜๋ฆฌ, [[แ„‡แ…กแ†ซแ„‹แ…ณแ†ผแ„’แ…งแ†ผ แ„‹แ…ฑแ†ซแ„ƒแ…ฉแ„‹แ…ฎ แ„…แ…ตแ„‰แ…กแ„‹แ…ตแ„Œแ…ณ(Resize) แ„‹แ…ตแ„‡แ…ฆแ†ซแ„แ…ณ แ„Žแ…ฅแ„…แ…ต|๋ฐ˜์‘ํ˜• ์œˆ๋„์šฐ ๋ฆฌ์‚ฌ์ด์ฆˆ(Resize) ์ด๋ฒคํŠธ ์ฒ˜๋ฆฌ]], ์›น ์›Œ์ปค ํ†ต์‹  ์ง€์—ฐ ์ตœ์†Œํ™” - **Contradictions/Notes:** ์Šค๋กœํ‹€๋ง๊ณผ ๋””๋ฐ”์šด์‹ฑ์€ ๋ฌด๊ฑฐ์šด ์—ฐ์‚ฐ์„ ์ค„์ด๊ณ  ํ”„๋ ˆ์ž„ ๋“œ๋ž์„ ๋ง‰์•„์ฃผ์ง€๋งŒ, ์„ค์ •ํ•œ ๋Œ€๊ธฐ ์‹œ๊ฐ„์ด ๋„ˆ๋ฌด ๊ธธ๋ฉด ํ™”๋ฉด ์—…๋ฐ์ดํŠธ๊ฐ€ ๋Šฆ์–ด์ ธ ์‚ฌ์šฉ์ž์—๊ฒŒ ๋Š๊ธฐ๋Š” ๋А๋‚Œ์„ ์ค„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋”ฐ๋ผ์„œ ์ž‘์—…์˜ ์„ฑ๊ฒฉ(์˜ˆ: ์ฆ‰๊ฐ ๋ฐ˜์‘์ด ํ•„์š”ํ•œ ๋“œ๋ž˜๊ทธ, ๋ฉˆ์ถ˜ ํ›„ ๋ฐ˜์‘ํ•ด๋„ ๋˜๋Š” ์œˆ๋„์šฐ ๋ฆฌ์‚ฌ์ด์ฆˆ)์— ๋งž์ถ”์–ด ์ ์ ˆํ•œ ์ง€์—ฐ ์‹œ๊ฐ„์„ ํƒ€ํ˜‘ํ•˜๋Š” ๊ฒƒ์ด ์ค‘์š”ํ•ฉ๋‹ˆ๋‹ค. --- _Last updated: 2026-04-14_ - Raw Source: 00_Raw/2026-04-20/Throttling & Debouncing.md ---