React: ์˜ˆ์ •๋œ DOM ๊ธฐ์ˆ  ์—…๊ทธ๋ ˆ์ด๋“œ ์ถ”์ 

์— ๋งŒ๋“  2015๋…„ 01์›” 09์ผ  ยท  3์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: facebook/react

  • [x] JSX ๋ณ€ํ™˜์—์„œ ํ•˜์ดํ”ˆ์œผ๋กœ ์—ฐ๊ฒฐ๋œ DOM ๊ตฌ์„ฑ ์š”์†Œ ์ง€์›
  • [ ] html ๊ฐ€์ ธ์˜ค๊ธฐ ๋‚ด์—์„œ ์‚ฌ์šฉ
  • [x] Shadow DOM ์กฐ๊ฐ์— ๊ตฌ์„ฑ ์š”์†Œ ์‚ฝ์ž… (https://github.com/facebook/react/issues/840)
  • [x] DOM ๊ตฌ์„ฑ ์š”์†Œ์˜ ์ž„์˜ ์†์„ฑ
  • [ ] ์ ์ ˆํ•œ ์ด๋ฒคํŠธ ์ฒ˜๋ฆฌ

    • [ ] shadow DOM ๋‚ด๋ถ€์—์„œ ๋ฐœ์ƒํ•˜๋Š” ์ด๋ฒคํŠธ (https://discuss.atom.io/t/event-handling-with-the-shadow-dom-and-react/14580)

    • [ ] ๋งž์ถค ์ด๋ฒคํŠธ(https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events)

  • [ ] ๋ณ€๊ฒฝ ๊ฐ์ง€๋ฅผ ์ œ๊ณตํ•˜๊ณ  ๋‹ค์‹œ ๋ Œ๋”๋ง์„ ์‹คํ–‰ํ•˜๊ธฐ ์œ„ํ•œ ๊ตฌ์„ฑ ์š”์†Œ ํ”„๋กœํ† ํƒ€์ž…. ์˜ˆ๋ฅผ ๋“ค์–ด ๊ตฌ์„ฑ ์š”์†Œ์˜ ์ž์‹(๋ฐ˜์‘์—์„œ ์†Œํ’ˆ์œผ๋กœ ํšจ๊ณผ์ ์œผ๋กœ ์ฒ˜๋ฆฌ๋จ)์ด ๋ณ€๊ฒฝ๋  ๋•Œ ๊ตฌ์„ฑ ์š”์†Œ๋ฅผ ๋‹ค์‹œ ๋ Œ๋”๋งํ•  ์ˆ˜ ์žˆ๊ธฐ๋ฅผ ์›ํ•  ๊ฒƒ์ž…๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ๋ณ€๊ฒฝ์„ ๊ฐ์ง€ํ•˜๋ ค๋ฉด MutationObserver(https://dom.spec.whatwg.org/#mutationobserver) ์ดˆ๊ธฐํ™”์™€ ๊ฐ™์€ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•˜๋Š” ๊ธฐ๋ณธ ๊ตฌ์„ฑ ์š”์†Œ ๊ตฌํ˜„์ด ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค.
  • [ ] dom์— ์žˆ์„ ๋•Œ๊นŒ์ง€ ๋ Œ๋”๋ง์„ ์ž ์žฌ์ ์œผ๋กœ ์—ฐ๊ธฐํ•ฉ๋‹ˆ๋‹ค(https://github.com/facebook/react/issues/2398์— ๋”ฐ๋ฆ„).
  • [x] tagName ์†์„ฑ ์ œ๊ฑฐ(https://github.com/facebook/react/issues/2288์— ๋”ฐ๋ฆ„)
  • [ ] ์›น ๊ตฌ์„ฑ ์š”์†Œ์— ๋Œ€ํ•œ ๋งค๊ฐœ ๋ณ€์ˆ˜๋กœ ๋ณต์žกํ•œ ์œ ํ˜•์„ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค. React ๊ตฌ์„ฑ ์š”์†Œ๋Š” ๋ณต์žกํ•œ ์œ ํ˜•์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์ง€๋งŒ dom ๋…ธ๋“œ๋Š” ๋ฌธ์ž์—ด๋งŒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์›น ๊ตฌ์„ฑ ์š”์†Œ์— ๋ณตํ•ฉ ์œ ํ˜•์„ ์ „๋‹ฌํ•˜๋ ค๋ฉด ์ถ”๊ฐ€ ๋งค๊ฐœ๋ณ€์ˆ˜๋ฅผ ์ธ์Šคํ„ด์Šคํ™”๋œ ์›น ๊ตฌ์„ฑ ์š”์†Œ์— ์ „๋‹ฌํ•˜๋Š” ๋งˆ์šดํŠธ ์‹œ ์ฝ”๋“œ๋ฅผ ์‹คํ–‰ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.
  • [ ] Stateful Imperative Bridge(https://github.com/facebook/react/issues/1711์— ๋”ฐ๋ฆ„)

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

์‚ฌ์šฉ์ž ์ •์˜ ์ด๋ฒคํŠธ ๋˜๋Š” ๋ผ์ธ์— ๋”ฐ๋ฅธ ๊ฒƒ์ด React์—์„œ ๊ตฌํ˜„๋œ ์ ์ด ์žˆ์Šต๋‹ˆ๊นŒ?

๋ชจ๋“  3 ๋Œ“๊ธ€

@gaearon ์˜ค๋ž˜๋œ ๋ฌธ์ œ๋ฅผ ํŒŒํ—ค์ณ๋ณด๊ณ  ๋‹ซ์„ ์ˆ˜ ์žˆ๋Š”์ง€ ํ™•์ธํ•˜์‹ญ์‹œ์˜ค.

์ด์™€ ๊ฐ™์€ ๋ฌธ์ œ์— ๋Œ€ํ•œ ์•ž์œผ๋กœ์˜ ๋ฐฉ๋ฒ•์ด ์žˆ์Šต๋‹ˆ๊นŒ?

์ด๊ฒƒ์„ react-future์™€ ๊ฐ™์€ ๊ฒƒ์œผ๋กœ ์˜ฎ๊ฒจ์•ผ ํ•ฉ๋‹ˆ๊นŒ?

์šฐ๋ฆฌ๊ฐ€ ์ด๊ฒƒ์„ ๋‹ซ์„ ์ˆ˜ ์žˆ๋‹ค๊ณ  ์ƒ๊ฐํ•ฉ๋‹ˆ๋‹ค.

์‚ฌ์šฉ์ž ์ •์˜ ์ด๋ฒคํŠธ ๋˜๋Š” ๋ผ์ธ์— ๋”ฐ๋ฅธ ๊ฒƒ์ด React์—์„œ ๊ตฌํ˜„๋œ ์ ์ด ์žˆ์Šต๋‹ˆ๊นŒ?

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰