React.memo 렌더링 최적화

const PlatformsForm = (props) => {
	const Ranking = () => {
		return TSX
    }
    
    const Following = () => {
    	return TSX
    }
    return isFollowing ? <Ranking /> : <Following />
}

React.memo는 Higher-Order Components(HOC)이다.
(HOC란 컴포넌트를 인자로 받아서 새로운 컴포넌트를 return해주는 구조의 함수)

React.memo(()=>{}, (prev, next) => 비교조건)

이런식으로 쓰면 된다.

그래서

const Ranking = React.memo(({props}) => {
	return TSX
}, (prev, next) => prev.조건 === next.조건)
// 비교조건이 같을 경우 memoization 된 데이터를 사용
    
const Following = () => {
    return TSX
}
const PlatformsForm = (props) => {
	
    return isFollowing ? <Ranking props={props}/> : <Following />
}

이렇게 바꿔줬따