Подскажите, кстати, пожалуйста, вот редакс весит типа килобайт 10, но вроде как одним им не обойтись, мой любимый mobx 50, какие есть альтернативы для мобикса, чтобы просто на проксях и без бойлерплейта, ибо редукс сильно напрягает при прототипировании и эксперементировании в пет-проектах, а почему мобх весит в пять раз больше редукса я не понимаю

от транспайлинга до минификации

Погугли что такое rollup и статьи про него.

react-konva всерьёз кто-то юзал? выглядит занятно

Погугли что такое rollup и статьи про него.

окей

Подскажите, кстати, пожалуйста, вот редакс весит типа килобайт 10, но вроде как одним им не обойтись, мой любимый mobx 50, какие есть альтернативы для мобикса, чтобы просто на проксях и без бойлерплейта, ибо редукс сильно напрягает при прототипировании и эксперементировании в пет-проектах, а почему мобх весит в пять раз больше редукса я не понимаю

при прототипировании достаточно контекста

Подскажите, кстати, пожалуйста, вот редакс весит типа килобайт 10, но вроде как одним им не обойтись, мой любимый mobx 50, какие есть альтернативы для мобикса, чтобы просто на проксях и без бойлерплейта, ибо редукс сильно напрягает при прототипировании и эксперементировании в пет-проектах, а почему мобх весит в пять раз больше редукса я не понимаю

потому что mobx это как реакт только для данных) а ридакс больше концепция

Подскажите, кстати, пожалуйста, вот редакс весит типа килобайт 10, но вроде как одним им не обойтись, мой любимый mobx 50, какие есть альтернативы для мобикса, чтобы просто на проксях и без бойлерплейта, ибо редукс сильно напрягает при прототипировании и эксперементировании в пет-проектах, а почему мобх весит в пять раз больше редукса я не понимаю

саги подойдут?

react-konva всерьёз кто-то юзал? выглядит занятно

выглядит да, но перфоманс будет с болью

выглядит да, но перфоманс будет с болью

почему?

саги подойдут?

Они от редукса независимы?

потому что mobx это как реакт только для данных) а ридакс больше концепция

Шта?

Подскажите, кстати, пожалуйста, вот редакс весит типа килобайт 10, но вроде как одним им не обойтись, мой любимый mobx 50, какие есть альтернативы для мобикса, чтобы просто на проксях и без бойлерплейта, ибо редукс сильно напрягает при прототипировании и эксперементировании в пет-проектах, а почему мобх весит в пять раз больше редукса я не понимаю

Вопрос в чем?

выглядит да, но перфоманс будет с болью

канвас сам по себе шустрый, а это ж тупо обвязка

Они от редукса независимы?

зависимы

Шта?

ну в чем-то он прав

почему?

лишняя абстракция, причем достаточно не простая, канвас это не интерфейс, можно и без реакта, реакт для другого

Вопрос в чем?

В том, что сейчас есть ещё из сингл-стейт-либ чтобы просто, как в мобикс и весило мало, как редукс :)

В том, что сейчас есть ещё из сингл-стейт-либ чтобы просто, как в мобикс и весило мало, как редукс :)

Effector

Шта?

Реактивный стм - это как раз модель + ее виртуальная копия в обсерваблах

лишняя абстракция, причем достаточно не простая, канвас это не интерфейс, можно и без реакта, реакт для другого

на реакте приятнее и привычнее описывать иерархические структуры

В том, что сейчас есть ещё из сингл-стейт-либ чтобы просто, как в мобикс и весило мало, как редукс :)

Для прототипирования лучше всего grammarly/focal. Effector тоже норм

Там сама либа большая даже без зависимостей

ну да. Я просто думаю в своей ui либе некоторые компоненты мигрировать на открытые, вот и ищу. И сильно удивился такой зависимости.

Шта?

это не моя фраза если честно, но она мне крайне нравится)

при прототипировании достаточно контекста

тоже норм

Effector

Ой, спасибо, но выглядит как пабсаб на стероидах

Попробую

Кстати, не помните что там мемчанский использовал для нахождения путей резолва обзерваблов?

Кстати, не помните что там мемчанский использовал для нахождения путей резолва обзерваблов?

спроси в https://t.me/effector_ru

тоже норм

Угу, тоже посмотрю, что-то смотрел, показалось, что он не подходит для этого

Угу, тоже посмотрю, что-то смотрел, показалось, что он не подходит для этого

Вот пример, если что https://codesandbox.io/s/n3rn49jzz0 Посмотри, лучше, grammarly/focal

И ещё тогда такой вопрос - какое отношение к preact/inferno у реактеров нынче? Использовать можно? При билде реакт заменять? 8кб, как-никак.

inferno, вроде как, помер уже. Преакт вполне живет

Вот пример, если что https://codesandbox.io/s/n3rn49jzz0 Посмотри, лучше, grammarly/focal

Всё гляну. Мобикс зависимость вызывает, гад, своими @inject и @observable, кроме которых ничего и не нужно

Ребят, подскажите по поводу передачи обработчиков. Сейчас многие пишут, что не стоит создавать анонимную функцию в рендере компонента. Окай, я передаю ссылку на функцию череp this, но если мне нужно передать какой-то параметр в обработчик, вот так ведь работать не будет: onClick={this.onSetSomething(id)} Всё сломается, т.к. у нас здесь вызов происходит сразу при рендере, а не при клике. А вот так работать будет: onClick={(id) => onSetSomething(id)} Так как правильно то передавать аргумент? Получается, в моём случае я делаю единственный верный вариант?

Ребят, подскажите по поводу передачи обработчиков. Сейчас многие пишут, что не стоит создавать анонимную функцию в рендере компонента. Окай, я передаю ссылку на функцию череp this, но если мне нужно передать какой-то параметр в обработчик, вот так ведь работать не будет: onClick={this.onSetSomething(id)} Всё сломается, т.к. у нас здесь вызов происходит сразу при рендере, а не при клике. А вот так работать будет: onClick={(id) => onSetSomething(id)} Так как правильно то передавать аргумент? Получается, в моём случае я делаю единственный верный вариант?

Я испольую каррирование, но, возможно, мне ща по голове дадут за такое

?

Я испольую каррирование, но, возможно, мне ща по голове дадут за такое

там тоже функция всегда создается)

я делаю по старинке this.onSomething = this.onSmething.bind(this)

но вопрос в другом

Ребят, подскажите по поводу передачи обработчиков. Сейчас многие пишут, что не стоит создавать анонимную функцию в рендере компонента. Окай, я передаю ссылку на функцию череp this, но если мне нужно передать какой-то параметр в обработчик, вот так ведь работать не будет: onClick={this.onSetSomething(id)} Всё сломается, т.к. у нас здесь вызов происходит сразу при рендере, а не при клике. А вот так работать будет: onClick={(id) => onSetSomething(id)} Так как правильно то передавать аргумент? Получается, в моём случае я делаю единственный верный вариант?

onClick={(event) => onSetSomething(event, id)}

onClick={this.setSomething} setSomething = e => {}

ок. не думал что это будет воспринято как флуд. добро, извиняюсь.

onClick={this.setSomething} setSomething = e => {}

не понял тебя, ты просто скопировал мой пример, но без аргументов и тела функции?

onClick={(event) => onSetSomething(event, id)}

Вроде речь-то и шла о том, чтобы в рендере не создавать анонимов

в смысле метод как arrow function

и передаешь его в onClick без вызова

onClick={(event) => onSetSomething(event, id)}

Создай промежуточный компонент.

там тоже функция всегда создается)

Но не в рендере же, а при вызове, не?

Вроде речь-то и шла о том, чтобы в рендере не создавать анонимов

по-другому не передать аргумент

А, в рендере тоже, сорри

по-другому не передать аргумент

видимо вот ответ, пасиб

по-другому не передать аргумент

(или преедать?)

(или преедать?)

Через стор ?

по-другому не передать аргумент

Передать.

Не, вроде, никак

вот в этой статейе в самом конце примерчик интеерсный https://m.habr.com/company/ruvds/blog/426053/

Через стор ?

но это уже совсем другая история )

опечатка на хабре? странно..

через .bind() можно передать аргумент

{this.props.list.map(listItem => <li key={listItem.text}> <Button onClick={this.getClickHandler(listItem.text)} /> </li> )}

не понимаю как это может работать)

{this.props.list.map(listItem => <li key={listItem.text}> <Button onClick={this.getClickHandler(listItem.text)} /> </li> )}

В чём, собсно, проблема?

ну через байнд понятно что будет работать

{this.props.list.map(listItem => <li key={listItem.text}> <Button onClick={this.getClickHandler(listItem.text)} /> </li> )}

только если твой метод возвращает функцию

тогда будет работать

ERROR: S client not available

Не, вроде, никак

class Foo { f = () => this.props.onClick(this.props.id); render() { return <Foo1 onClick=f /> } <Foo onClick={a} id={id} />

потому что онклик ждет функцию аргументом

Кеширование на уровне реакта через промежуточный компонент.

class Foo { f = () => this.props.onClick(this.props.id); render() { return <Foo1 onClick=f /> } <Foo onClick={a} id={id} />

Не оч понятно, в чём отличие

Не оч понятно, в чём отличие

У тебя не пересоздаётся компонент при каждом вызове.

какой в топку промежуточный компонент, что вы усложняее

Подумай.

У тебя не пересоздаётся компонент при каждом вызове.

И аргументы через пропсы?

вон сверху ответили, что метод должен функцию возвращать, тогда сработает

И аргументы через пропсы?

Да.

Что вообще происходит

вон сверху ответили, что метод должен функцию возвращать, тогда сработает

Каррирование и есть

ну

вон сверху ответили, что метод должен функцию возвращать, тогда сработает

У тебя при каждом рендере будет новая функция. А у меня нет.

Но оно так или иначе создаст функцию

Но оно так или иначе создаст функцию

А теперь посмотри что будет при втором рендере, если функция и id не изменились.

onSomething(id){ return event => {//effect(event, id)}} <div onClick={this.onSomething(id)}></div>

А теперь посмотри что будет при втором рендере, если функция и id не изменились.

можешь заспойлерить?

Ето что касается каррирования

можешь заспойлерить?

Компонент не будет перерендериваться так как пропсы не изменились.

() => {} !== () => {}

Компонент не будет перерендериваться так как пропсы не изменились.

Сложна. Всё равно не оч ясно, ну вот маплю я массив, вывожу список из 20 дивов, каждый при клике должен в обработчик передать свой ид

() => {} !== () => {}

ну да) логично

Сложна. Всё равно не оч ясно, ну вот маплю я массив, вывожу список из 20 дивов, каждый при клике должен в обработчик передать свой ид

И?

Познакомить с понятием хок?)

хок - антипаттерн)

Познакомить с понятием хок?)

Было б норм, потому что в доках нифига не понятно и выглядит как усложнение, но не буду :)

Было б норм, потому что в доках нифига не понятно и выглядит как усложнение, но не буду :)

Изучи что такое декоратор.

всем похера на () =>

ну будет лишний ререндер

тут все уже на рендер пропах и тд

хотя они конечно не в циклах