๐ ํ๋ก์ ํธ ์ต์ ํ ๋ฐฉ๋ฒ
-> ํ๋ก์ ํธ ๊ท๋ชจ๊ฐ ์ปค์ง์๋ก ์ปดํฌ๋ํธ ๋ฆฌ๋ ๋๋ง ์ต์ ํ๋ฅผ ํ์ง ์์ผ๋ฉด ๋ฆฌ๋ ๋๋ง๋๋ ๊ณผ์ ์์ ๋ฒํผ๋ง์ด ๋ฐ์ํ ์ ์๋ค.
๋ฆฌ์กํธ์์๋ ๋ถ๋ชจ ์ปดํฌ๋ํธ๊ฐ ๋ฆฌ๋ ๋๋ง๋๋ฉด ์์ ์ปดํฌ๋ํธ๋ ๋ฆฌ๋ ๋๋ง ๋จ.
์์ ํ๋ก์ ํธ์์๋ ์๊ด์ด ์์ผ๋, ๊ท๋ชจ๊ฐ ์ปค์ง์๋ก ๋ถํ์ํ ๋ฆฌ๋ ๋๋ง์ ๋ง์์ผ ํจ.
์ฌ๊ธฐ์ ๋ถํ์ํ ๋ฆฌ๋ ๋๋ง์ ์ค์ ์ ์ ์์์ DOM ๋ ๋๋งX, Virtual DOM์์์ ๋ ๋๋ง์ ์๋ฏธ.
HOW? : shouldComponentUpdate๋ก ๋ฐฉ์ง.
shouldComponentUpdate(nextProps, nextState){
return this.props.todos !== nextProps.todos;
}
shouldComponentUpdate(nextProps, nextState){
return this.props.done!==nextProps.done;
}
๐ ์ ๋ฆฌ
- ์ด๋ค ์ํฉ์์ shouldComponentUpdate๋ฅผ ๊ตฌํํด์ผ ํ ๊น?
- ์ปดํฌ๋ํธ ๋ฐฐ์ด์ด ๋ ๋๋ง๋๋ ๋ฆฌ์คํธ ์ปดํฌ๋ํธ์ผ ๋.
- ๋ฆฌ์คํธ ์ปดํฌ๋ํธ ๋ด๋ถ์ ์๋ ์์ดํ ์ปดํฌ๋ํธ์ผ ๋.
- ํ์ ์ปดํฌ๋ํธ ๊ฐ์๊ฐ ๋ง์ผ๋ฉฐ, ๋ฆฌ๋ ๋๋ง๋์ง ๋ง์์ผ ํ ์ํฉ์์๋ ๋ฆฌ๋ ๋๋ง์ด ์งํ๋ ๋.
์ฐธ๊ณ : <๋ฆฌ์กํธ๋ฅผ ๋ค๋ฃจ๋ ๊ธฐ์ >