Svelte는 React나 Vue 같은 라이브러리 보다는 컴파일러에 가까운 프레임워크 입니다.
가령 기존 자바스크립트 라이브러리(React)는 해당 라이브러리 코드(React)를 다운(런타임 라이브러리) 받아서 실행을 했어야 했습니다.
그렇지만 Svelte는 Svelte 코드를 다운로드 하지 않습니다. 이미 Svelte에서 Vanilla JavaScript 코드로 빌드(컴파일) 해주기 때문이죠.
이러한 이유 때문에 Svelte로 작성한 코드는 번들 용량이 매우 작습니다.
Svelte는 다음과 같은 특성이 있습니다.
1. React나 Vue에 비해 훨씬 적은 코드로 동일한 결과물을 만들어 낼 수 있습니다.
훨씬 적은 코드는 곧 생산성과 가독성의 향상을 의미하는데요.
React 함수 컴포넌트에서 상태를 사용하기 위해서는 useState 훅을 사용해야 하지만 Svelte는 변수 할당 키워드인 let 을 사용하면 됩니다.
이벤트를 바인딩 해주려면 DOM 태그에 bind 메서드만 입력해주면 양방향 데이터 바인딩이 지원되어 별도의 상태를 변경해주는 함수를 만들지 않아도 됩니다.
2. 가상 돔을 사용하지 않습니다.
React나 Vue는 가상 돔 객체를 통해서 변경사항 만을 감지하여 실제 돔을 업데이트하는 방식을 사용하고 있는데요. Svelte는 이 과정을 생략하고 컴파일 시점에 최적화된 코드를 반영하여 실제 돔을 변경합니다. 그렇지만 무조건 가상 돔을 사용하지 않는 것이 좋은 것만은 아닙니다. 가상 돔을 사용하면서 Svelte 보다 빠른 라이브러리(Inferno)도 존재하기 때문입니다
Svelte는 아직 많이 대중화되지는 않아서 에러 메시지 부족, 개발자 도구 부재, 검색 결과 부족 등의 단점이 있습니다. 다만 더 가볍고 빠르면서 동시에 생산성도 높은 웹 애플리케이션을 만드는 데 도움을 줄 수 있습니다.