Svelte 5에 대한 첫인상 그리고 개인적인 생각들

<Svelte 5에 대한 첫인상 그리고 개인적인 생각들> 저도 이번 업데이트의 방향성에 대해서는 계속 생각해보고 있는 중이고 경험하지 않은 상태에서의 의견이라는 점 이해 부탁드립니다. 1 우선 Svelte는 "컴파일 방식"이라고 하는 것이 가장 큰 차별화 요소입니다. 이를 통해서 훨씬 더 vanilla javascript와 유사한 단순한 문법을 사용해도 Reactivity와 Performace를 확보할 수 있게 됩니다. React에서 값의 변경을 전달하기 위해서(Reactivity) setState(count => count + 1)라고 하는 함수를 쓸 수 밖에 없지만 Svelte는 count = count + 1 과 같이 익숙한 자바스크립트 구문을 사용해도 count값의 변경사항을 전파할 수 있게 됩니다. 2 그렇지만 이전 Svelte의 한계점은 이러한 컴파일방식은 .svelte 파일에만 적용이 된다는 점입니다. svelte 컴포넌트의 크기가 커지면서 일부 로직들을 js/ts 로 모듈을 만들게 되면 이러한 magical syntax는 더 이상 쓸수가 없게 됩니다. 결국 module을 분리하게 되면 결국 svelte/store를 써야만 Reactivity를 구현할 수 있게 되기에 덩치가 큰 프로젝트를 하다보면 Svelte의 <script>의 구문적 이점이 많이 퇴색이 됩니다. 3 저 역시 이러한 부분을 경험했기에 어느 순간 개발방식을 svelte에서의 코딩을 최소화하고 js/ts를 rxjs기반으로 Reactivity한 State를 관리하는 방향으로 바꾸었습니다. 그럼에도 svelte가 가져다주는 단순함과 성능, 적은 코드의 사용이라고 하는 부분은 여전히 매력적이긴 합니다. Svelte만으로는 빠르게 프로토타이핑을 하고 나중에 모듈로 바꾸는 과정이 번거롭긴 하지만 그런식으로 개발을 할 수 있다는 것 또한 장점이긴 합니다만 svelte에서 사용하던 코드를 js에서 그대로 쓸 수 없다는 점은 상당히 아쉬운 부분이었습니다. 4 이번에 Svelte 5에서 공개된 Rune 이라고 하는 것은 이렇게 Svelte에서 작성된 구문을 그대로 js/ts 에서는 사용되지 못하는 부분들을 자신들의 장점인 "컴파일" 이라고 하는 부분으로 풀어가되, 간결한 문법을 그대로 유지하려고 하는 setCount(1) (X) count = 1 (O) 의지가 결합된 형태라고 볼 수 있습니다. 이제 $state, $effect, $derived, $props등의 새로운 구문을 통해서 svelte에서만 쓸 수 있는 Reactivity하면서 단순한 문법을 js/ts에서도 동일한 형태로 개발을 할 수 있게 된다는 의미입니다. 5 이건 사실 대단히 특별한 건 아닙니다. 이미 React에서 useState() 등으로 감싸고 있던 코드들을 그대로 코드를 복사해서 useCustomHook으로 만들어 낼 수 있는 것과 같은 것입니다. 이전 Svelte에서는 그게 되지 않았고 이제 Svelte에서는 svlete와 js에서 사용하는 구문이 같아지기에 모듈화에 더 용이해지게 되었습니다. 그러면서도 기존의 store보다도 더 단순한 구문을 사용할 수 있고 React의 hook보다도 더 사용하기 쉬운 방식이 될거라고 생각합니다. (React는 deps를 적거나, 순서의 유지를 위한 조건문 사용의 제한, 비동기 처리 등의 문제들이 여전히 남아있습니다.) 6 Svelte의 독창적인 구문에서 어느정도 현대 프레임워크들과 구문적으로 유사해지고 있다는 얘기들도 있으나 아직 공개되지 않은 만큼 나왔을 때 얼마나 DX를 유지하면서도 svelte 특유의 코드를 적게 쓸 수 있다는 장점이 발휘가 될 수 있을지 기대가 됩니다. 7 다만 걱정이 되는 부분이 있다면, 프레임워크들의 등장으로 인해서 Web 라이브러리가 아니라 특정 프레임워크 전용 라이브러리로 만들어지게 되는데 특히 React의 불만세력이 주장하는 useState를 사용하게 되면 React에서 밖에 돌아갈 수 없는 라이브러리가 만들어져서 불균형을 만들고 있다라는 부분과 크게 달라지지 않는 모양새가 되버린게 아쉽습니다. Rune을 쓴다는 것은 Svelte에서만 돌아가는 코드를 작성하게 된다는 의미가 될테니까요. 8 Svelte 5의 방향이 Svelte 자체를 더 강력하게 만들어내는 방향일거라고 생각했는데 - 가령 성능, 인라인 컴포넌트나 forward:class forward:event 와 같은 더 나은 유틸리티 기능들... - 핵심 엔진을 바꾸는 방식이라는 점이 흥미롭습니다. 그런데 그것이 뭔가 독창적이라기보다는 vue3의 compoisition API와 상당히 유사하다는 점에서도 React나 Solid 느낌이 나는 것도 어떻게 받아들여질지 궁금하네요.