Box 컴포넌트 추가 제안

[inhibitor1217]

• Box는 기본적으로 만능 컴포넌트이다.
• 한 Box에 prop이 수십 개 달리지 않도록 하려면 (책임을 여러 컴포넌트로 분리하려면) 어떻게 해야 하는가?

Solution (proposal)

• 내 유일한 child가 Box일 경우 -> 나의 prop을 child로 위임해줌
• 최하위 Box는 위임받은 prop을 정리해서 그려줘야 함

이라는 구조를 가지면 어떨까 합니다. Box를 기반으로 만들어진 컴포넌트도 Box 취급을 받게 하면 Flexbox, Center, Stack, FlexChild 등 책임을 다양한 컴포넌트로 분리하면서도 최종적으로 렌더링되는 결과는 다 merge되어 div 한 개가 될 수 있도록 하는 방법!

[sungik-choi]

내 유일한 child가 Box일 경우 -> 나의 prop을 child로 위임해줌

children의 length가 1이고, 그게 Box 컴포넌트일 경우에만 해당하는게 맞을까요?

[inhibitor1217]

넵 말씀하신 경우가 맞습니다

[sungik-choi]

Box가 굉장히 많이 쓰이는 경우, 비교 과정이 생각보다 성능에 영향이 있을 거 같아서

• Box 컴포넌트에서 children.length && type을 비교해서, prop을 내려준 div 하나를 렌더하는게 나을지
• 비교 과정을 거치지 않고 여러개의 div를 그냥 렌더하는게 나을지

두 케이스를 테스트해봐야할 거 같아요.

[inhibitor1217]

여러 개 div를 렌더링하는 것이 꼭 성능의 이슈라기보다는, element styling 구조상 한 div에 여러 스타일이 동시에 먹어야 올바르게 보이는 경우가 있어 이것을 고려하여 제안드린 스펙입니다