
1. jsonplaceholder.typicode.com/posts에서 post 더미 데이터를 받아와 아래와 같은 화면을 만든다. 2. 화면 구성은 똑같이 구성하되 A 컴포넌트는 한번에 작성, B 컴포넌트는 이렇게 컴포넌트 단위로 쪼개서 작성하였다. 크롬 확장팩인 React Dev Tools의 Profiler기능을 이용하여 같은 내용 다른 코드의 두 컴포넌트가 어떤 성능 차이를 보이는지 비교해보았다. 인풋창에 hello를 적어보았다. 1번째 h를 타이핑해서 re rendering이 발생했을때 App 컴포넌트는 3ms, A 컴포넌트는 0.6ms, B 컴포넌트는 2.2ms로 A 컴포넌트 렌더링 타임 < B 컴포넌트 렌더링 타임 이라는 결과가 나왔다. 아무래도 리렌더가 발생할때마다 B컴포넌트에서 불러와야 될 ..