Size: a a a

2020 March 26

A

Arushwl in Svelte [svelt]
Pavel 🦇 Malyshev
Привет!
Уже в эту пятницу в 19:00 поговорим онлайн про фреймворки — Svelte, Ember.js, Vue.js. В гостях будут Саша Кануников, Паша Малышев, Рома Пятаков. Присоединяйтесь послушать на нашем канале: https://www.youtube.com/piterjs
👀
источник

ДБ

Дмитрий Беляев in Svelte [svelt]
Nick Golub
Вот Вы все так говорите, а конкретные моменты, почему и что не нравится в одном и почему во втором лучше? почему свелт уже готов к продакшину? Что делать разработчику, который пришёл во фронтенд через svelte, но вакансий под свелте очень мало и все сразу хотят минимум мидла, а лучше синьёра, который научит команду обезьян, как правильно писать на svelte?
если это не сочтут за оффтоп, могу поделиться своим мнением
правда про реакт может быть неактуально, я с ним последний раз работал гдето в 17 году
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
Дмитрий Беляев
если это не сочтут за оффтоп, могу поделиться своим мнением
правда про реакт может быть неактуально, я с ним последний раз работал гдето в 17 году
вполне по теме
источник

IF

Infant Frontender in Svelte [svelt]
Дмитрий Беляев
если это не сочтут за оффтоп, могу поделиться своим мнением
правда про реакт может быть неактуально, я с ним последний раз работал гдето в 17 году
Не волнуйся, не сочтем) В любом случае интересно мнение людей, перешедших с одного фреймворка на другой.
источник

NG

Nick Golub in Svelte [svelt]
Дмитрий Беляев
если это не сочтут за оффтоп, могу поделиться своим мнением
правда про реакт может быть неактуально, я с ним последний раз работал гдето в 17 году
ну можно ретроспективно, что и как реализовать на каком фреймворке, и какой профит от применения одного фреймворка в отличии от других, а что является минусом?
источник

DS

Dmitry Semenov in Svelte [svelt]
Pavel 🦇 Malyshev
в том смысле что в саппер загрузку данных стоит делать через preload, чтобы не потерять изоморфность
Ну вот я об этом и думал. Если загрузил данные из прелоада и их показываешь то как потом перейти на данные стора
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
Dmitry Semenov
Ну вот я об этом и думал. Если загрузил данные из прелоада и их показываешь то как потом перейти на данные стора
а зачем?
источник

DD

Dmitry Dead in Svelte [svelt]
Pavel 🦇 Malyshev
не, давайте не будем это воспринимать как холивар. Цель просто показать как наиболее общие вещи реализуются на каждом из фреймворков
Работу с АПИ как выстраивать в свелте, хотелось бы услышать 🙂
источник

A

Arushwl in Svelte [svelt]
Я с сервера пишу дату в сторы синхроненные с локалстораджом и оттуда манипулирую ими в приложении. Запросы к апи в отдельном файле хендлерами сразу пишут в стор.
источник

ДБ

Дмитрий Беляев in Svelte [svelt]
Infant Frontender
Не волнуйся, не сочтем) В любом случае интересно мнение людей, перешедших с одного фреймворка на другой.
реакт...
С jsx можно смириться, даже воспринимаешь его как нечто удобное... проблемы вроде замен атрибутов class= -> className= и for= -> htmlFor= вполне решаются регулярками... Хотя что со вью, что со свелт мне удалось просто научить верстальщика верстать сразу в компоненты, а с jsx это вызывает кучу проблем...
Больших преимуществ над ванила DOM вообще не вижу, да можно выплюнуть пачку vDOM и реакт все сам как то разрулит, но на деле борешься с тормозами из-за лишними перерендерами на каждый чих.
Ну и вот вроде простое - друг хорошего, и подход все есть пропсы (они заменяют и слоты, и события и еще кучу вещей), да только апдейт пропсов это опять тупой ререндер...

вью...
после реакта с его отвратительным DX оно реально как глоток свежего воздуха, но...
до недавнего времени было 2 типа слотов (scoped и не scoped), сейчас по сути объединили все как scoped, но старый код никуда не денешь.
сильная завязаность на свою инфраструктуру (vuex, vue-roater и т.д.), прикрутить что-то стороннее - боль и костыли
vuex - это отдельная песня, начиная с того, что бизнес логика не типизируется (typescript? можешь выкинуть если в проекте есть vuex, один фиг все скатится в any), а ведь это место где по идее должны быть бизнес логика
Система реактивности иногда преподносит неприятные сюрпризы. Начиная от своей непредсказуемости (можно писать так: this.field = value если field уже в системе реактивности, но если его там нет, то нужно писать Vue.set(this, 'field', value), хотя не всегда, есть кейсы где вью все таки сообразит, что ты от него хочешь), ну и если у тебя v-for который рендерит много чего нибудь из vuex, что меняется со временем (в частности удаляется из массива), то ты попал, тормоза не вылечить ничем, потому что отписка от ненужных зависимостей под капотом у вью выглядит примерно так:
for(const dep of depsForRemove) {
 const i = allDeps.indexOf(dep);
 if(i !== -1) allDeps.splice(i, 1);
}
Сами подумайте, какие могут быть тормоза, если массив из 200 элементов запросто генерит 80к подписок к vuex

svelte
главная претензия - сыроват, встречаются досадные баги... Сильно заметно, что его тестят только в продакшн компиляции и без ts... Ибо больше всего у меня проблем было именно с типами и с дев компиляцией...
и да, в сами компоненты ts не затащить никак, но вокруг прекрасно живет код на ts и это даже способствует делать UI слой тоньше
сторы - как по мне это вообще киллер фича свелта. Они гибки и изящны и в то же время весьма просты. А главное - это интерфейс, под который еще и rxjs почти подходит (если 1 next выдать в поток синхронно, то проблем нет, иначе чекай, что subscribe колбэк не был вызван). После них redux примитивен, mobx сильно замудрен и "magic", а vuex ущербен и избыточен
ну и вторая киллер фича как по мне - use:function - больше не надо парится, что ref может быть не отрендерен в определенные моменты времени, а значит можно сосредоточится на задаче, а не на борьбе с фреймворком и отслеживанием во-сколько v-if завернут твой ref
источник

A

Arushwl in Svelte [svelt]
Arushwl
Я с сервера пишу дату в сторы синхроненные с локалстораджом и оттуда манипулирую ими в приложении. Запросы к апи в отдельном файле хендлерами сразу пишут в стор.
Есть Варик от @PaulMaly использовать ридбл сторы для данных, как неизменчемые. Пока не дошёл до этой оптимизации.
источник

DK

Dmitry Kutran in Svelte [svelt]
Дмитрий Беляев
реакт...
С jsx можно смириться, даже воспринимаешь его как нечто удобное... проблемы вроде замен атрибутов class= -> className= и for= -> htmlFor= вполне решаются регулярками... Хотя что со вью, что со свелт мне удалось просто научить верстальщика верстать сразу в компоненты, а с jsx это вызывает кучу проблем...
Больших преимуществ над ванила DOM вообще не вижу, да можно выплюнуть пачку vDOM и реакт все сам как то разрулит, но на деле борешься с тормозами из-за лишними перерендерами на каждый чих.
Ну и вот вроде простое - друг хорошего, и подход все есть пропсы (они заменяют и слоты, и события и еще кучу вещей), да только апдейт пропсов это опять тупой ререндер...

вью...
после реакта с его отвратительным DX оно реально как глоток свежего воздуха, но...
до недавнего времени было 2 типа слотов (scoped и не scoped), сейчас по сути объединили все как scoped, но старый код никуда не денешь.
сильная завязаность на свою инфраструктуру (vuex, vue-roater и т.д.), прикрутить что-то стороннее - боль и костыли
vuex - это отдельная песня, начиная с того, что бизнес логика не типизируется (typescript? можешь выкинуть если в проекте есть vuex, один фиг все скатится в any), а ведь это место где по идее должны быть бизнес логика
Система реактивности иногда преподносит неприятные сюрпризы. Начиная от своей непредсказуемости (можно писать так: this.field = value если field уже в системе реактивности, но если его там нет, то нужно писать Vue.set(this, 'field', value), хотя не всегда, есть кейсы где вью все таки сообразит, что ты от него хочешь), ну и если у тебя v-for который рендерит много чего нибудь из vuex, что меняется со временем (в частности удаляется из массива), то ты попал, тормоза не вылечить ничем, потому что отписка от ненужных зависимостей под капотом у вью выглядит примерно так:
for(const dep of depsForRemove) {
 const i = allDeps.indexOf(dep);
 if(i !== -1) allDeps.splice(i, 1);
}
Сами подумайте, какие могут быть тормоза, если массив из 200 элементов запросто генерит 80к подписок к vuex

svelte
главная претензия - сыроват, встречаются досадные баги... Сильно заметно, что его тестят только в продакшн компиляции и без ts... Ибо больше всего у меня проблем было именно с типами и с дев компиляцией...
и да, в сами компоненты ts не затащить никак, но вокруг прекрасно живет код на ts и это даже способствует делать UI слой тоньше
сторы - как по мне это вообще киллер фича свелта. Они гибки и изящны и в то же время весьма просты. А главное - это интерфейс, под который еще и rxjs почти подходит (если 1 next выдать в поток синхронно, то проблем нет, иначе чекай, что subscribe колбэк не был вызван). После них redux примитивен, mobx сильно замудрен и "magic", а vuex ущербен и избыточен
ну и вторая киллер фича как по мне - use:function - больше не надо парится, что ref может быть не отрендерен в определенные моменты времени, а значит можно сосредоточится на задаче, а не на борьбе с фреймворком и отслеживанием во-сколько v-if завернут твой ref
С хуками в реакте все покрасивше сейчас все-же)
источник

ДБ

Дмитрий Беляев in Svelte [svelt]
Dmitry Kutran
С хуками в реакте все покрасивше сейчас все-же)
ну я не пробовал, как уже сказал, последний раз нормально с реактом работал в 17, а хуки вроде в 19 появились
источник

DV

Default Voiceб 🔥 in Svelte [svelt]
Дмитрий Беляев
реакт...
С jsx можно смириться, даже воспринимаешь его как нечто удобное... проблемы вроде замен атрибутов class= -> className= и for= -> htmlFor= вполне решаются регулярками... Хотя что со вью, что со свелт мне удалось просто научить верстальщика верстать сразу в компоненты, а с jsx это вызывает кучу проблем...
Больших преимуществ над ванила DOM вообще не вижу, да можно выплюнуть пачку vDOM и реакт все сам как то разрулит, но на деле борешься с тормозами из-за лишними перерендерами на каждый чих.
Ну и вот вроде простое - друг хорошего, и подход все есть пропсы (они заменяют и слоты, и события и еще кучу вещей), да только апдейт пропсов это опять тупой ререндер...

вью...
после реакта с его отвратительным DX оно реально как глоток свежего воздуха, но...
до недавнего времени было 2 типа слотов (scoped и не scoped), сейчас по сути объединили все как scoped, но старый код никуда не денешь.
сильная завязаность на свою инфраструктуру (vuex, vue-roater и т.д.), прикрутить что-то стороннее - боль и костыли
vuex - это отдельная песня, начиная с того, что бизнес логика не типизируется (typescript? можешь выкинуть если в проекте есть vuex, один фиг все скатится в any), а ведь это место где по идее должны быть бизнес логика
Система реактивности иногда преподносит неприятные сюрпризы. Начиная от своей непредсказуемости (можно писать так: this.field = value если field уже в системе реактивности, но если его там нет, то нужно писать Vue.set(this, 'field', value), хотя не всегда, есть кейсы где вью все таки сообразит, что ты от него хочешь), ну и если у тебя v-for который рендерит много чего нибудь из vuex, что меняется со временем (в частности удаляется из массива), то ты попал, тормоза не вылечить ничем, потому что отписка от ненужных зависимостей под капотом у вью выглядит примерно так:
for(const dep of depsForRemove) {
 const i = allDeps.indexOf(dep);
 if(i !== -1) allDeps.splice(i, 1);
}
Сами подумайте, какие могут быть тормоза, если массив из 200 элементов запросто генерит 80к подписок к vuex

svelte
главная претензия - сыроват, встречаются досадные баги... Сильно заметно, что его тестят только в продакшн компиляции и без ts... Ибо больше всего у меня проблем было именно с типами и с дев компиляцией...
и да, в сами компоненты ts не затащить никак, но вокруг прекрасно живет код на ts и это даже способствует делать UI слой тоньше
сторы - как по мне это вообще киллер фича свелта. Они гибки и изящны и в то же время весьма просты. А главное - это интерфейс, под который еще и rxjs почти подходит (если 1 next выдать в поток синхронно, то проблем нет, иначе чекай, что subscribe колбэк не был вызван). После них redux примитивен, mobx сильно замудрен и "magic", а vuex ущербен и избыточен
ну и вторая киллер фича как по мне - use:function - больше не надо парится, что ref может быть не отрендерен в определенные моменты времени, а значит можно сосредоточится на задаче, а не на борьбе с фреймворком и отслеживанием во-сколько v-if завернут твой ref
Добавлю, что если свелтовских сторов недостаточно, то сверху идеально ложится effector
источник

ДБ

Дмитрий Беляев in Svelte [svelt]
Default Voiceб 🔥
Добавлю, что если свелтовских сторов недостаточно, то сверху идеально ложится effector
смотрел его, но не пробовал...
что самое интересное, у меня не возникало еще, что сторов не достаточно. Засчет того, что это интерфейс их вообще во что угодно превратить можно
источник

DV

Default Voiceб 🔥 in Svelte [svelt]
Дмитрий Беляев
смотрел его, но не пробовал...
что самое интересное, у меня не возникало еще, что сторов не достаточно. Засчет того, что это интерфейс их вообще во что угодно превратить можно
Ну у меня несколько иной подход, Я вообще всю бизнес-логику стараюсь держать отдельно от UI
источник

DV

Default Voiceб 🔥 in Svelte [svelt]
Поэтому мне важно, чтобы стм был достаточно мощным для большинства возникающих кейсов
источник

ДБ

Дмитрий Беляев in Svelte [svelt]
Default Voiceб 🔥
Ну у меня несколько иной подход, Я вообще всю бизнес-логику стараюсь держать отдельно от UI
ну так это вроде как правильный подход
источник

ДБ

Дмитрий Беляев in Svelte [svelt]
Default Voiceб 🔥
Поэтому мне важно, чтобы стм был достаточно мощным для большинства возникающих кейсов
а можно пример где "мощности" свелт сторов не хватает?
источник

DV

Default Voiceб 🔥 in Svelte [svelt]
Дмитрий Беляев
а можно пример где "мощности" свелт сторов не хватает?
Ну например самый часто встречающийся - повтор запроса при таймауте/фейле и чтобы он не трогал состояние. В эффекторе это разруливается на уровне его самого
источник