[React] 불필요한 렌더링 줄이기

1. component props에 고정 객체 넘겨줄 경우, 객체를 컴포넌트 밖으로 빼내 상수 변수로 관리하자
   why? 객체 자체를 넘겨주게 되면 객체이 내용이 변경되지 않아도 렌더링 될때마다 새로 객체를 생성하기 때문
2. component props에 연산에 따라 객체가 변할 수 있는 경우, useMemo를 감싸주자 (복잡한 연산이 필요할 경우에만 useMemo를 쓰자. 안그러면 메모리 낭비된다고 함)

// bad
return{
 <Hello users={users.filter(user => user.is)}/>
};

// good
const users = useMemo(() => users.filter(user => user.is),[]);

return{
 <Hello users={users}/>
};