๐ DOM(Document Object Model)
๊ฐ์ฒด๋ก ๋ฌธ์ ๊ตฌ์กฐ๋ฅผ ํํํ๋ ๋ฐฉ๋ฒ์ผ๋ก XML์ด๋ HTML๋ก ์์ฑํฉ๋๋ค.
์น ๋ธ๋ผ์ฐ์ ๋ DOM์ ํ์ฉํ์ฌ ๊ฐ์ฒด์ javascript์ css๋ฅผ ์ ์ฉํฉ๋๋ค.
DOM์ ํธ๋ฆฌ ํํ๋ผ์ ํน์ ๋
ธ๋๋ฅผ ์ฐพ๊ฑฐ๋ ์์ ํ๊ฑฐ๋ ์ ๊ฑฐํ๊ฑฐ๋ ์ํ๋ ๊ณณ์ ์ฝ์
ํ ์ ์์ต๋๋ค.
๐ Virtual DOM
Virtual DOM์ ์ฌ์ฉํ๋ฉด ์ค์ DOM์ ์ ๊ทผํ์ฌ ์กฐ์ํ๋ ๋์ , ์ด๋ฅผ ์ถ์ํํ ์๋ฐ์คํฌ๋ฆฝํธ ๊ฐ์ฒด๋ฅผ ๊ตฌ์ฑํ์ฌ ์ฌ์ฉํฉ๋๋ค.
๋ฆฌ์กํธ์์ ๋ฐ์ดํฐ๊ฐ ๋ณํ์ฌ ์น ๋ธ๋ผ์ฐ์ ์ ์ค์ DOM์ ์ ๋ฐ์ดํธํ ๋๋ ๋ค์ ์ธ ๊ฐ์ง ์ ์ฐจ๋ฅผ ๋ฐ์ต๋๋ค.
- ๋ฐ์ดํฐ๋ฅผ ์ ๋ฐ์ดํธํ๋ฉด ์ ์ฒด UI๋ฅผ Virtual DOM์ ๋ฆฌ๋ ๋๋งํฉ๋๋ค.
- ์ด์ Virtual DOM์ ์๋ ๋ด์ฉ๊ณผ ํ์ฌ ๋ด์ฉ์ ๋น๊ตํฉ๋๋ค.
- ๋ฐ๋ ๋ถ๋ถ๋ง ์ค์ DOM์ ์ ์ฉํฉ๋๋ค.
๐ ๊ธฐํ ํน์ง
์ผ๋ถ ์น ํ๋ ์์ํฌ๊ฐ MVC ๋๋ MVW ๋ฑ์ ๊ตฌ์กฐ๋ฅผ ์งํฅํ๋ ๊ฒ๊ณผ ๋ฌ๋ฆฌ ๋ฆฌ์กํธ๋ ์ค์ง ๋ทฐ๋ง ๋ด๋นํฉ๋๋ค.
๊ทธ๋ฆฌ๊ณ ๋ฆฌ์กํธ๋ ํ๋ ์์ํฌ๊ฐ ์๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ด๊ธฐ ๋๋ฌธ์ ๋ค๋ฅธ ์น ํ๋ ์์ํฌ๊ฐ Ajax, ๋ฐ์ดํฐ ๋ชจ๋ธ๋ง, ๋ผ์ฐํ
๋ฑ๊ณผ ๊ฐ์ ๊ธฐ๋ฅ์ ๋ด์ฅํ๊ณ ์๋ ๋ฐ๋ฉด, ๋ฆฌ์กํธ๋ ์ ๋ง ๋ทฐ๋ง ์ ๊ฒฝ์ฐ๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ด๋ฏ๋ก ๊ธฐํ ๊ธฐ๋ฅ์ ์ง์ ๊ตฌํ
ํด์ ์ฌ์ฉํด์ผ ํฉ๋๋ค.
๋ ๋ฆฌ์กํธ๋ ๋ค๋ฅธ ์น ํ๋ ์์ํฌ๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ํผ์ฉํ ์๋ ์์ต๋๋ค.