Описание тега svelte
Svelte - это компонентный фреймворк, такой как React или Vue, но с важным отличием. Традиционные фреймворки позволяют писать декларативный код, управляемый состоянием, но есть штраф: браузер должен делать дополнительную работу для преобразования этих декларативных структур в операции DOM. Вместо этого Svelte запускается во время сборки, преобразуя ваши компоненты в высокоэффективный императивный код. В результате вы можете писать приложения с отличной производительностью.
Svelte - это радикально новый подход к созданию пользовательских интерфейсов. В то время как традиционные фреймворки, такие как React и Vue, выполняют большую часть своей работы в браузере, Svelte переводит эту работу на этап компиляции, который происходит при сборке приложения.
Вместо использования таких приемов, как виртуальное сравнение DOM, Svelte пишет код, который хирургическим путем обновляет DOM при изменении состояния вашего приложения.
Реактивность
Поскольку Svelte является компилятором, состояние можно обновить, просто присвоив ему новое значение.
function handleClick() {
count++;
}
Простой пример
Поиграйте с этим здесь или посмотрите другие примеры здесь.
<script>
let count = 0;
function handleClick() {
count++;
}
</script>
<button on:click={handleClick}>
Clicked {count} {count === 1 ? 'time' : 'times'}
</button>
<style>
button {
background: white;
color: blue;
}
</style>
связанные проекты
- Sapper (в разработке): конструктор прогрессивных веб-приложений, вдохновленный next.js
- Плагин Eslint для Svelte 3