Size: a a a

2020 November 26

PM

Pavel 🦇 Malyshev in Svelte [svelt]
Vladimir
Когда стояла задача на чем это реализовать решил попробовать на svelte и не пожалел😁
да, он хорош и для этого. я где-то выше описывал консерны конкретно для нашего проекта. еще один, который забыл: важно точно понимать как виджеты собираются. если отдельными пайплайнами то есть полностью standalone, то не будет переиспользования кода.
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
Pavel 🦇 Malyshev
Короче история такая. В качестве предыстории, нужно рассказать откуда ноги растут:

Летом пришел проект который можно назвать олдскул легаси (php + куча лапшекода jquery). На поддержке проекта только 2 php-шника. Проще говоря проект чисто классическая серверная аппа из нулевых - начала 10-х. Поддерживать клиентскую часть у php-шников получилось со скрипом, до кучи это уже далеко не первые люди и если на беке они там себе все организовали как надо, то на фронте не брались. Из-за этого и не самые лучшие решения на jquery, много запутанности, куча эйдж-кейсов и багов которые кажется уже невозможно распутать.
вот тут рассказывал почему нам в этом проекте svelte не подошел, хотя изначально конечно же его хотели
источник

V

Vladimir in Svelte [svelt]
Pavel 🦇 Malyshev
да это реально, но свелт не идеальный инструмент для этого, потому что это прежде всего SPA фреймворк.
А на чем можно было б это ещё реализовать? На чистом js? В чем бы я выиграл? Зато со svelte я не парился многими моментами типа перерисовки компонента при изменении состояния, реализовал достаточно быстро (чего требовал бизнес), а по весу не думаю что получилось бы на чистом js заметно легче
источник

IG

Ilya Gladko in Svelte [svelt]
Vladimir
К примеру у меня есть несколько сложных элементов формы которые я реализовал с помощью svelte и использую во многих местах на сайте. Сайт ничего не знает ни про svelte, ни про rollup, он просто использует этим элементы как сторонние модули
Спасибо, теперь выгляжу вполне поняшным
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
Vladimir
А на чем можно было б это ещё реализовать? На чистом js? В чем бы я выиграл? Зато со svelte я не парился многими моментами типа перерисовки компонента при изменении состояния, реализовал достаточно быстро (чего требовал бизнес), а по весу не думаю что получилось бы на чистом js заметно легче
на чисто js конечно не надо. нам нельзя было иметь сборку и зависимость на nodejs и npm. поэтому свелт не подходил. + внешний апи компонента свелт недостаточно функционален, есть только 3 метода и больши ничего. маловато для взаимодействия между виджетами. в итоге мы взяли lit-html для шаблонов и эффективного рендерига и реактивную библиотечку, придумали апи который нам нужен и обвязали это 200 строками кода. получилось вполне рабочее решение
источник

MM

Mikluha Mclay in Svelte [svelt]
вот такая штука не срабатывает, когда input выключается $: value && foo();
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
Mikluha Mclay
вот такая штука не срабатывает, когда input выключается $: value && foo();
выключается?
источник

MM

Mikluha Mclay in Svelte [svelt]
Pavel 🦇 Malyshev
если нужно на изменение чекбокса запускать функцию, то это наиболее верный путь:

$: checked && foo();
ну, value становится === false
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
Mikluha Mclay
ну, value становится === false
так ты посмотри на код то
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
забудем про $:
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
value && foo();
источник

MM

Mikluha Mclay in Svelte [svelt]
ну я понимаю, что и не сработает
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
когда выполнится?
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
я просто думал что кейс - выполнить только если value = true
источник

MM

Mikluha Mclay in Svelte [svelt]
так а как в итоге то запустить функцию на on|off у чекбокса )
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
если во всех случаях, тогда можно так:

$: value, foo();
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
или если значение нужно внутри функции;

$: foo(value);
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
это просто js код и не более того
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
$: лишь добавляет перезапускаемость этого кода при изменении value
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
чтобы лучше понять этот момент, сперва напиши код, который будет правильно работать один раз. а потом просто отметь его меткой $:
источник