FE 프레임워크 3대장에게 긴장감을 !
vue와 비슷한 구조를 갖고 직관적이다.
<script>...</script>
<style>...</style>
<html>...</html>
재할당을 진행할 때 리랜더링을 진행한다.
컴파일 될 때 Svelte가 업데이트를 하도록 래핑된다
컴파일 된 코드의 가독성이 매우 좋다
const remove = item => {
// items.push(item)은 리랜더링이 발생하지 않는다.
items = items.filter(i => i !== item);
};
// 컴파일된 코드
const remove = item => {
$$invalidate("items", (items = items.filter(i => i !== item)));
};
CSS도 컴파일 한다.
양방향 바인딩을 할 수 있다.
<input type="checkbox" bind:checked="{item.done}" />