๊ฐ€์ƒ ๋”๊ณผ ์ง„์งœ ๋” ์ฐจ์ด

ยท React
Virtual DOM React ๋Š” UI ์ƒํƒœ๋ฅผ ์ถ”์ ํ•˜๊ณ  ๋ณ€ํ™”๊ฐ€ ์ผ์–ด๋‚œ ์š”์†Œ๋“ค์„ ๋น ๋ฅด๊ฒŒ ์—…๋ฐ์ดํŠธ ํ•  ์ˆ˜ ์žˆ๋„๋ก Virtual DOM ์ด๋ผ๋Š” ๊ฐ€์ƒ์˜ DOM ๊ฐ์ฒด๋ฅผ ํ™œ์šฉํ•ฉ๋‹ˆ๋‹ค. ์ด๋Š” ์‹ค์ œ DOM ์‚ฌ๋ณธ ๊ฐ™์€ ๊ฐœ๋…์œผ๋กœ, React ๋Š” ์‹ค์ œ DOM๊ฐ์ฒด์— ์ ‘๊ทผํ•˜์—ฌ ์กฐ์ž‘ํ•˜๋Š” ๋Œ€์‹  ์ด ๊ฐ€์ƒ์˜ DOM ๊ฐ์ฒด์— ์ ‘๊ทผํ•˜์—ฌ ๋ณ€ํ™” ์ „๊ณผ ๋ณ€ํ™” ํ›„๋ฅผ ๋น„๊ตํ•˜๊ณ  ๋ฐ”๋€ ๋ถ€๋ถ„์„ ์ ์šฉํ•ฉ๋‹ˆ๋‹ค DOM์€ ๊ณ„์ธต์  ํ˜•ํƒœ์˜ ํŠธ๋ฆฌ ๊ตฌ์กฐ๋กœ ๊ตฌ์„ฑ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค. ์ž๋ฃŒ๊ตฌ์กฐ ์ค‘์—์„œ๋„ ํŠนํžˆ ํŠธ๋ฆฌ๋Š” “๋ฐ์ดํ„ฐ ์ €์žฅ”์˜ ์˜๋ฏธ๋ณด๋‹ค๋Š” “์ €์žฅ๋œ ๋ฐ์ดํ„ฐ๋ฅผ ๋” ํšจ๊ณผ์ ์œผ๋กœ ํƒ์ƒ‰” ํ•˜๊ธฐ ์œ„ํ•ด ์‚ฌ์šฉ๋˜๋ฏ€๋กœ, ๋น ๋ฅธ ์ž๋ฃŒ ํƒ์ƒ‰ ์„ฑ๋Šฅ์ด ์žฅ์ ์ธ ์ž๋ฃŒ๊ตฌ์กฐ๋ผ๊ณ  ๋ณผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๊ทธ๋Ÿฌ๋‚˜ DOM ์ด ๋ณ€๊ฒฝ๋˜๊ณ  ์—…๋ฐ์ดํŠธ ๋œ๋‹ค๋Š” ๊ฒƒ์€ ๊ฒฐ๊ตญ ๋ธŒ๋ผ์šฐ์ €์˜ ๋ Œ๋”๋ง ์—”์ง„ ๋˜ํ•œ ๋ฆฌํ”Œ๋กœ์šฐ(reflow) ํ•œ๋‹ค๋Š” ๊ฒƒ์„ ..
becky(์ง€์€)
'๊ฐ€์ƒ ๋”๊ณผ ์ง„์งœ ๋” ์ฐจ์ด' ํƒœ๊ทธ์˜ ๊ธ€ ๋ชฉ๋ก