캘린더 라이브러리 제작기 6 - 스타일드 컴포넌트 vs 순수 css 비교

스타일드 컴포넌트에서 CSS로의 마이그레이션!

스타일드 컴포넌트와 CSS의 비교

스타일드 컴포넌트와 CSS는 각각 장단점을 가지고 있다.

스타일드 컴포넌트

• 장점:

  • 자바스크립트를 통해 CSS를 관리할 수 있어 컴포넌트 단위로 스타일을 캡슐화할 수 있다.
  • 동적인 스타일링이 가능하고, props를 통해 스타일을 조건부로 변경할 수 있다.
  • 스타일드 컴포넌트 자체가 라이브러리로 제공되어 사용하기 편리하다.

• 단점:

  • 런타임 성능에 영향을 줄 수 있다. 스타일드 컴포넌트가 런타임에서 스타일을 해석하고 적용하는 과정이 추가로 필요하기 때문에!
  • 빌드 용량이 커질 수 있다. 스타일드 컴포넌트를 사용하기 위해 해당 라이브러리를 추가로 포함해야 하기 때문에!
  • 스타일드 컴포넌트를 배우는 시간과 학습 비용이 필요하다.

CSS

• 장점:

  • 라이브러리나 프레임워크 없이 순수 CSS를 사용하여 빌드 용량을 최소화할 수 있다.
  • 브라우저에 의해 직접 해석되므로 런타임 성능에 미치는 영향이 적다.
  • 일반적으로 큰 프로젝트에서 CSS를 관리하기 위한 체계적인 설계와 주의가 필요하지만, 자유롭게 스타일링할 수 있는 유연성을 제공한다.

• 단점:

  • 복잡한 프로젝트에서 CSS를 관리하기 위해 추가적인 작업과 구조화가 필요하다.
  • JavaScript와의 연동 없이는 동적인 스타일링이 어려울 수 있다.

CSS 선택한 이유

이 캘린더 라이브러리에서는 사용자의 요구에 맞게 자유로운 커스터마이징과 빌드 용량 최소화를 위해 CSS를 선택한 것이다. 사용자가 자유롭게 라이브러리를 사용하고, 커스텀 스타일을 적용하며, 빌드 용량을 최적화할 수 있도록 하기 위함이다.

스타일드 컴포넌트는 많은 장점을 가지고 있지만, 이 라이브러리의 목표는 사용자의 자유도를 높이고 빌드 용량을 줄이는 데에 초점을 맞추었다. 이를 위해 CSS를 선택하였으며, 사용자는 CSS를 직접 사용하여 원하는 스타일을 적용할 수 있다.