개발자

리액트 프로젝트에 컴포넌트 구조 어떤게 더 나을까요???

2023년 05월 23일조회 158

쟁점은 select component안에 있는 table 요소 내부를 어떤 식으로 react.memo로 component 분리해서 children으로 처리하는게 나을까요?? 아니면 useMemo로 한 컴포넌트 내에서 처리하는게 나을까요??

이 질문이 도움이 되었나요?
'추천해요' 버튼을 누르면 좋은 질문이 더 많은 사람에게 노출될 수 있어요. '보충이 필요해요' 버튼을 누르면 질문자에게 질문 내용 보충을 요청하는 알림이 가요.
profile picture
익명님의 질문

답변 1

커리어리 AI 봇님의 프로필 사진

두 가지 방법 모두 장단점이 있으며, 선택은 개발자의 선호도와 프로젝트 요구사항에 따라 달라집니다. 다음은 두 방법의 차이점과 고려해야 할 사항입니다: 1번 방법: 컴포넌트 분리하기 (React.memo) 장점: -관심사의 분리: 테이블 요소를 별도의 컴포넌트로 분리하여 관심사를 분리할 수 있습니다. SelectTable 컴포넌트는 테이블의 렌더링 로직에만 집중하게 됩니다. -재사용성: SelectTable 컴포넌트를 다른 곳에서도 재사용할 수 있습니다. 단점: -컴포넌트 개수 증가: 여러 개의 컴포넌트로 분리하면 컴포넌트의 개수가 증가하게 됩니다. 이는 관리해야 할 컴포넌트 수를 늘릴 수 있습니다. 2번 방법: useMemo를 이용하여 컴포넌트 내부에서 처리하기 장점: -컴포넌트 수 감소: 테이블 요소를 컴포넌트로 분리하지 않고 한 컴포넌트 내에서 처리할 수 있습니다. 컴포넌트 수가 줄어들어 개발 및 유지보수가 간편해집니다. 단점: -관심사 혼합: Select 컴포넌트 내에서 테이블 렌더링 로직을 처리하므로 관심사가 혼합될 수 있습니다. -재사용성 감소: 테이블 렌더링 로직이 Select 컴포넌트 내에 포함되므로 다른 곳에서 재사용하기 어려울 수 있습니다. 위의 장단점을 고려하여 프로젝트의 요구사항과 개발 편의성에 따라 선택하면 됩니다. 만약 테이블 요소를 여러 곳에서 재사용할 필요가 있다면 1번 방법이 유리할 수 있고, 테이블 요소가 특정 컴포넌트에서만 사용되는 경우 2번 방법을 고려할 수 있습니다.

커리어리 AI 봇의 답변을 평가해 주세요!

지금 가입하면 모든 질문의 답변을 볼 수 있어요!

현직자들의 명쾌한 답변을 얻을 수 있어요.

또는

이미 회원이신가요?

목록으로
키워드로 질문 모아보기

실무, 커리어 고민이 있다면

새로운 질문 올리기

지금 가입하면 모든 질문의 답변을 볼 수 있어요!