핵심 요약

Solid 2.0이 새 컴파일러와 partial hydration으로 더 강해졌다. RSC는 Next.js 16·Remix 3로 자리를 굳혔다. 동일 대시보드(45 컴포넌트)를 양쪽으로 구현해본 결과, 클라이언트 인터랙션 비중이 70% 이상이면 Solid, 데이터 페칭·SEO 비중이 크면 RSC 우세. JS 번들은 Solid가 3.2배 작다.

1. 모델 차이

	Solid 2.0	RSC (Next.js 16)
반응성	fine-grained signal	서버 렌더 + 클라 캐시
번들	매우 작음	RSC payload만
데이터 페칭	create-resource	async server component
학습 곡선	React 경험 → 빠름	경계 모델 적응 필요

2. 번들 사이즈

동일 대시보드: Solid 28KB(gzip), Next 16 RSC 92KB. RSC는 서버 컴포넌트가 컸지만 클라 hydration은 적음. 모바일 3G에서 Solid가 TTI 1.2s, RSC 2.4s.

3. 데이터 페칭 패턴

// Solid 2.0
const [data] = createResource(() => params().id, fetchUser);

// RSC
async function UserPage({id}) {
  const user = await fetchUser(id);
  return <UserCard user={user}/>;
}

4. SEO·LCP

RSC는 서버 렌더가 기본이라 LCP가 항상 좋다. Solid도 SolidStart 1.5로 SSR 가능하지만 데이터 페칭 패턴이 RSC만큼 깔끔하지 않다. SEO 우선 콘텐츠 사이트라면 RSC.

5. 인터랙션 성능

Solid signal은 컴포넌트 재렌더 없이 DOM 직접 갱신. 대량 셀 업데이트(주식 시세 같은) 워크로드에서 React 대비 fps 2배 이상 안정. RSC는 클라 컴포넌트가 결국 React라 동일 한계.

6. 생태계

React 생태계의 압도적 우세는 여전. shadcn/ui, TanStack, Auth.js 같은 자산이 큰 결정 요인. Solid Kobalte·SolidStart Auth 등이 좋아졌지만 카탈로그 깊이 차이가 크다.

7. 결정 가이드

SEO·콘텐츠 사이트·검색 사용자 많음 → RSC
대시보드·차트·실시간 UI 비중 큼 → Solid
팀 React 경험 강하고 학습 비용 부담 → RSC
모바일 저성능 디바이스 타깃 → Solid

자주 묻는 질문

Q. Svelte 5 runes는? Solid와 모델은 비슷하지만 SolidStart vs SvelteKit으로 메타 프레임워크가 결국 좌우. 별도 글에서 다룸.

Solid 2.0 vs RSC — fine-grained vs 스트리밍, 결정 가이드