Скорее всего это сделано, чтобы имеющийся туллинг для Javascript был готов из коробки, например подсветка синтаксиса на Хабре.
Кроме того — реактивные выражения в Svelte — это не обязательно только присваивание. Можно сделать реактивным любое выражение и даже целый блок:
let varA = 0;
$: {
console.log(varA);
console.log(varA*2);
}
// В консоли будут показываться новые значения, всякий раз, когда изменится varA
Не совсем то же самое. $: просто назначает следующее за ним выражение быть реактивным — по сути это destiny operator. Кроме него есть ещё переменные стейта let somevar;. Тут вообще ничего не надо делать, чтобы при изменении через присваивание их значения отображались на вьюшке. А this.setState вы обязаны вызывать каждый раз, когда собираетесь изменить данные.
А если не только начали и работаете в команде? Какой код будет более понятен без чтения доп мануалов?
Вы совершенно правы. Можно назвать это Sveltescrypt. С $ это просто сахар, который легко запомнить и использовать. Но синтаксис сам по себе — всё еще валидный JS, и шаблоны проектирования остаются те же. Хотите переменную стейта — просто пишите let var — как вы делаете для создания обычных переменных Javascript, а не используете "чужеродную конструкцию" для этого.
Насколько я видел, кто работает со Svelte предпочитают решать эту проблему явным присваиванием. Например array.push(3) пишут как array = [...array,3]. Но я не вижу причин, почему бы не использовать ImmutableJS для этого, если кому-то так удобнее.
Автор не ставил целью сравнить все фреймворки в очередной раз. Автор пытался объяснить механизм работы реактивности в Svelte — что для неё не нужны какие-либо чужеродные конструкции, а только то, что есть в самом Javascript.
К слову, я бы с удовольствием почитал статью, где сравнивался бы не Svelte с Vue, а Vue со Svelte, например.
Я не считаю, что она проседает — поверхностна, да. Но цели углубляться в эту тему в этой статье не было. Для меня структура компонентов Svelte3 сильно лаконичнее и понятнее, чем у любого другого фреймворка. Вот интересно, если бы отписался кто-нибудь, кто не трогал ещё ни Svelte, ни другие топовые фреймворки, со времён JQuery. Какой код ему понятнее?
Если хотите прямо фактов — напишите свой канонически верный вариант на React и посчитаем символы, а не строки. Всё равно букв у вас будет больше, как ни старайтесь. Но, что это докажет вам или мне?
Прошлые статьи автора были в том числе и про React. Теперь попробовал Svelte. Так что автор не голословен, что-то для себя нашёл в Svelte, раз написал такую длинную статью.
Аргументация про реактивное программирование проседает?
Все ж про более понятный код компонентов Svelte, тут в достаточно утрированном виде, для обывателей рассказано. Можно опять начать спорить, но вся конкретика уже была в упомянутой выше статье и там каждый остался при своём мнении.
К сожалению, все кто пытаются рассказывать про Svelte, в той или иной степени опираются на сравнение с традиционными фреймворками. Иначе просто не ответить на вопрос — "А зачем нам ещё один фреймворк?" То, что сравнивают в основном с React, лишь говорит о его популярности и известности. По-моему, заголовок статьи вполне хорошо раскрыт и без излишних оскорблений React в этой области.
В данной статье эти пара абзацев про разное количество строк кода отнюдь не главная мысль. Похоливарить на эту тему можно в предыдущей статье авторства Rich Harris.
Благодарю за критику, замечу, что это всё же перевод. Вам не нравится сам стиль речи автора и моего перевода, или то, что опять часть статьи посвящена противопоставлению Svelte и React?
Во-первых, исчезающие фреймфорки — это если бы фрейморки для js перестали существовать, это какой-то кликбейт.
А во вторых, «магически исчезающий» такого понятия нет и это выглядит как бред.
Это понятие уже неоднократно встречалось как в сети в целом, так и на хабре в частности. Правда, почти всегда речь шла о Svelte v1-v2.
А в третьих, называть компиляцию исчезновением, такой же бред как называть языки, которые можно скомпилировать в машинный код, исчезающими.
Фреймворк — это средство и инструменты для унификации, стандартизации, ускорения разработки приложения. При компиляции эти средства и инструменты пропадают, остаётся только ванильный JS, который мы могли бы написать и без фреймворка, но без всего вышеперчисленного. Традиционным фреймворкам все эти средства приходится тащить в рантайм, иначе не работает.
Можно назвать магически исчезающей типизацией процесс транпcиляции typescript->javascript. Это просто красивые слова.
Кто-то(Александр Федотов?) уже достаточно давно проводил исследование, что размер JS бандла Свелта сравняется с размером JS бандла Реакта примерно при 600 компонентах. Но врятли кто-то будет доводить до такого количества компонентов на одной вьюшке — тут явно будет сплиттинг кода — а тут у Svelte преиумущество — ему не надо рантайм прицеплять к каждому из этих кусочков.
В бандле код не дублируется — всё что переиспользуется, конечно, оптимизируется. Так что, о совсем нулевом рантайме Свелт, говорить — лукавство. Но в каждый бандл идёт только то, что реально используется, поэтому всё очень компактненько. Пруф
Я человек простой — не вижу плашки «перевод» — считаю это оригиналом. Но да, теперь вот прочитал внимательно
Я засылал в Песочницу и там то ли не было выбора "Статья/Перевод/Новость", то ли я был крайне невнимателен (публиковал во время 13 часовой поездки сидячим поездом Псков-Петрозаводск). В любом случае, сейчас уже не исправить.
Я имел ввиду не весь сам код фреймворка который загружается в память в не зависимости нужны ли его части или нет(отсутсвие оного, тоже несомненный плюс Svelte, безусловно).
Я хотел сказать, что runtime предполагает обязательные ритуальные действия, например как у помянул Rich в этой статье для Vue:
Т.е. нельзя просто импортировать компонент и сразу вставить его в разметку. Нужно зарегистрировать его, чтобы он попал в рантайм. Т.е. лишние шаблонные действия.
Скорее всего это сделано, чтобы имеющийся туллинг для Javascript был готов из коробки, например подсветка синтаксиса на Хабре.
Кроме того — реактивные выражения в Svelte — это не обязательно только присваивание. Можно сделать реактивным любое выражение и даже целый блок:
JS не валидный, синтаксис валидный.
Не совсем то же самое.
$:просто назначает следующее за ним выражение быть реактивным — по сути это destiny operator. Кроме него есть ещё переменные стейтаlet somevar;. Тут вообще ничего не надо делать, чтобы при изменении через присваивание их значения отображались на вьюшке. Аthis.setStateвы обязаны вызывать каждый раз, когда собираетесь изменить данные.А если команда работает на JQuery, а не на React?
Вы совершенно правы. Можно назвать это Sveltescrypt. С
$это просто сахар, который легко запомнить и использовать. Но синтаксис сам по себе — всё еще валидный JS, и шаблоны проектирования остаются те же. Хотите переменную стейта — просто пишитеlet var— как вы делаете для создания обычных переменных Javascript, а не используете "чужеродную конструкцию" для этого.Так ведь суть ImmutableJS — что он предлагает неизменяемые объекты? Т.е. все преобразования выдают новый объект, который уже можно присвоить через
=.Насколько я видел, кто работает со Svelte предпочитают решать эту проблему явным присваиванием. Например
array.push(3)пишут какarray = [...array,3]. Но я не вижу причин, почему бы не использовать ImmutableJS для этого, если кому-то так удобнее.Что-то на эту тему делается силами сообщества потихоньку.
Совсем не так. В прошлой статье было сравнение и с Vue тоже. Да и на Youtube есть пара видео.
Автор не ставил целью сравнить все фреймворки в очередной раз. Автор пытался объяснить механизм работы реактивности в Svelte — что для неё не нужны какие-либо чужеродные конструкции, а только то, что есть в самом Javascript.
К слову, я бы с удовольствием почитал статью, где сравнивался бы не Svelte с Vue, а Vue со Svelte, например.
Я не считаю, что она проседает — поверхностна, да. Но цели углубляться в эту тему в этой статье не было. Для меня структура компонентов Svelte3 сильно лаконичнее и понятнее, чем у любого другого фреймворка. Вот интересно, если бы отписался кто-нибудь, кто не трогал ещё ни Svelte, ни другие топовые фреймворки, со времён JQuery. Какой код ему понятнее?
Если хотите прямо фактов — напишите свой канонически верный вариант на React и посчитаем символы, а не строки. Всё равно букв у вас будет больше, как ни старайтесь. Но, что это докажет вам или мне?
Прошлые статьи автора были в том числе и про React. Теперь попробовал Svelte. Так что автор не голословен, что-то для себя нашёл в Svelte, раз написал такую длинную статью.
Аргументация про реактивное программирование проседает?
Все ж про более понятный код компонентов Svelte, тут в достаточно утрированном виде, для обывателей рассказано. Можно опять начать спорить, но вся конкретика уже была в упомянутой выше статье и там каждый остался при своём мнении.
К сожалению, все кто пытаются рассказывать про Svelte, в той или иной степени опираются на сравнение с традиционными фреймворками. Иначе просто не ответить на вопрос — "А зачем нам ещё один фреймворк?" То, что сравнивают в основном с React, лишь говорит о его популярности и известности. По-моему, заголовок статьи вполне хорошо раскрыт и без излишних оскорблений React в этой области.
В данной статье эти пара абзацев про разное количество строк кода отнюдь не главная мысль. Похоливарить на эту тему можно в предыдущей статье авторства Rich Harris.
Благодарю за критику, замечу, что это всё же перевод. Вам не нравится сам стиль речи автора и моего перевода, или то, что опять часть статьи посвящена противопоставлению Svelte и React?
По-моему, от него отказались ещё между v1 и v2
Уточню, что если ячейки — это инстансы одного и того же компонента — то это, конечно, считается за 1 компонент.
Это понятие уже неоднократно встречалось как в сети в целом, так и на хабре в частности. Правда, почти всегда речь шла о Svelte v1-v2.
Фреймворк — это средство и инструменты для унификации, стандартизации, ускорения разработки приложения. При компиляции эти средства и инструменты пропадают, остаётся только ванильный JS, который мы могли бы написать и без фреймворка, но без всего вышеперчисленного. Традиционным фреймворкам все эти средства приходится тащить в рантайм, иначе не работает.
Можно назвать магически исчезающей типизацией процесс транпcиляции typescript->javascript. Это просто красивые слова.
Кто-то(Александр Федотов?) уже достаточно давно проводил исследование, что размер JS бандла Свелта сравняется с размером JS бандла Реакта примерно при 600 компонентах. Но врятли кто-то будет доводить до такого количества компонентов на одной вьюшке — тут явно будет сплиттинг кода — а тут у Svelte преиумущество — ему не надо рантайм прицеплять к каждому из этих кусочков.
В бандле код не дублируется — всё что переиспользуется, конечно, оптимизируется. Так что, о совсем нулевом рантайме Свелт, говорить — лукавство. Но в каждый бандл идёт только то, что реально используется, поэтому всё очень компактненько.
Пруф
Я засылал в Песочницу и там то ли не было выбора "Статья/Перевод/Новость", то ли я был крайне невнимателен (публиковал во время 13 часовой поездки сидячим поездом Псков-Петрозаводск). В любом случае, сейчас уже не исправить.
Я имел ввиду не весь сам код фреймворка который загружается в память в не зависимости нужны ли его части или нет(отсутсвие оного, тоже несомненный плюс Svelte, безусловно).
Я хотел сказать, что runtime предполагает обязательные ритуальные действия, например как у помянул Rich в этой статье для Vue:
Т.е. нельзя просто импортировать компонент и сразу вставить его в разметку. Нужно зарегистрировать его, чтобы он попал в рантайм. Т.е. лишние шаблонные действия.