https://stackblitz.com/edit/react-hooks-demo-eeg4g6
В демо Абрамова всё это есть :(
Спасибо!
Виталий
Mikhail
я смотрю этот stackblitz хорошо работает с хуками, добавил , [], а он его игнорирует
Vadim
вы похоже не сохраняете изменения)
Danila
Советую попробовать codesandbox, провереное решение.
Илья
Верно. Глюк сэкблица был.
Поэтому прежде чем брать на слабо, надо удостовериться в том, что пишешь.
Виталий
Поэтому прежде чем брать на слабо, надо удостовериться в том, что пишешь.
Согласен. Мой косяк.
Илья
Советую попробовать codesandbox, провереное решение.
Он тоже иногда тупит и не отображает изменений. И кроме F5 ничего не помогает.
Mikhail
я имею ввиду код в песочнице
ну я добавил этот [], посмотрел что нифига не изменилось, подумал, что код не обновился, добавил width: {width} в рендер, изменения появились на экране, но [] в хук все равно не передавался
Vadim
Mikhail
песочница кривая
Danila
Он тоже иногда тупит и не отображает изменений. И кроме F5 ничего не помогает.
Да, но такой жести себе не позволяет
Andrew
Привет ребята :3
Это нормальная практика в реакте оборачивать по дефолту все компоненты в React.memo/PureComponent?
Vladimir
Привет ребята :3
Это нормальная практика в реакте оборачивать по дефолту все компоненты в React.memo/PureComponent?
Дэнчик Абрамов говорит, что так надо делать только если уже тормозит. А изначально делать без них
Misha
А почему нет?
Andrew
Bogdan
Дэнчик Абрамов говорит, что так надо делать только если уже тормозит. А изначально делать без них
А ты сначала определи, тормозит ли
Bogdan
А почему нет?
Потому что бывает, что проще перерендерить, чем сравнить пропсы, внутри у него сравнение по ключу
from
А почему нет?
И ещё дежурное "зависит от приложения"
Если при ререндерах как правило данные меняются (а это свойственно динамическим приложениям), то получишь только больше вычислений. К вычислениям ререндеров просто добавишь вычисления по диффам пропсов.
Bogdan
Или тесты писать поидее, ну если их нету, то пристальным взглядом смотреть
Bogdan
понял, спасибо
А что ты понял с его ответа? Я ничего не увидел, касательно вопроса, просто набор слов
from
from
Ну ты же действительно не ответил, почему это плохо или хорошо)
ответил
если ты не понял то всё ок, переспроси
Bogdan
ответил
если ты не понял то всё ок, переспроси
Я из ответа ничего не понял, как ты определил, что вот тут тебе мемо помог, в сейчас не помог и почему
from
если при сравнении пропсов выяснилось, что они изменились, то ты просто потратил время на сравнение
from
По умолчанию конечно считается, что чаще тебя это выручает, чем наоборот
Но у нас например был приложение где много данных и по определению по сокетам прилетают только обновившиеся данные. Т.е. заранее известно, что сравнивать ни к чему, ререндерить надо
Bogdan
По умолчанию конечно считается, что чаще тебя это выручает, чем наоборот
Но у нас например был приложение где много данных и по определению по сокетам прилетают только обновившиеся данные. Т.е. заранее известно, что сравнивать ни к чему, ререндерить надо
Ну это чаще всего зарание не известно, не могу сразу пример придумать подходящий
from
Ну это чаще всего зарание не известно, не могу сразу пример придумать подходящий
да в принципе и идея языка, где все функции по дефолту мемоизированные, имеет право на жизнь
Bogdan
да в принципе и идея языка, где все функции по дефолту мемоизированные, имеет право на жизнь
Ну бывает ещё так, что сравнить пропсы дольше, чем сделать перерендер
from
Ну бывает ещё так, что сравнить пропсы дольше, чем сделать перерендер
Да. А особенно обидно, если после дорогого сравнения пропсов выяснится, что ререндер делать всё-таки нужно
from
Но у мемо вряд ли дорогое сравнение будет, там shallow equality проверяется
Viktor
Viktor
дефолтная мемоизация в моем понимании тоже выглядит безобидно)
Bogdan
Но у мемо вряд ли дорогое сравнение будет, там shallow equality проверяется
Ну каждый ключ объекта берет и сравнивает, это тоже не мало в сумме
Viktor
дефолтная мемоизация в моем понимании тоже выглядит безобидно)
с другой стороны кто-то может сайд эффектов поналожить в рендер-функцию
Viktor
вон они в твиттере говорили нечто в стиле "наша задача научить комьюнити, что рендер-функции должны быть чистыми"
Viktor
https://github.com/reactjs/rfcs/pull/108
https://github.com/reactjs/rfcs/pull/108#issuecomment-468670590 вон тут говорят, что в продакшен app ни одного React.memo вообще нет, и все ок
Viktor
а вот вам ответ от Дена
https://twitter.com/dan_abramov/status/1083897065263034368
Viktor
честно говоря, там довольно слабые доводы, как мне показалось
раз мемоизации по умолчанию нет в internal api, то она и не нужна особо прямо везде
Lzhedmitry
всем привет, кто может подсказать подводные камни этого кода?
componentDidMount() {
this.setState({
...this.state,
});
}
Aleksandr
Как минимум он бессмысленный?)
Aleksandr
Пардоньте если не прав
Dmytro
Прав
Lzhedmitry
ну а может например зацикливания быть? при разных ситуациях, например state поменялся и опять вызывается componentDidMount() и так войти в бесконечный цикл?
Aleksandr
Этот метод срабатывает только один раз
Lzhedmitry
при mouting
Lzhedmitry
а если например юзать componentWillMount()?
Aleksandr
Вот если в componentDidUpdate то там может что-то ужасное произойти)
Ruslan
а если например юзать componentWillMount()?
этот метод вообще не подходит для таких вещей, лучше про него забыть, он уже практически устарел в новом реакте
Lzhedmitry
это понятно, лучше бы вообще на хуки перейти, но есть проекты, в которых есть такой код) и там еще в консоль реакт не спамит про lifecycle deprecated
Юра
Это какая-то фича в новой версии Реакта?
Ruslan
это понятно, лучше бы вообще на хуки перейти, но есть проекты, в которых есть такой код) и там еще в консоль реакт не спамит про lifecycle deprecated
может потому что реакт версия там ниже
Aleksandr
а если например юзать componentWillMount()?
Он хоть и устарел, тоже 1 раз вызывается
Проблемы могут быть в жизненных циклах обновлений
Dmitry
этот метод вообще не подходит для таких вещей, лучше про него забыть, он уже практически устарел в новом реакте
Он остался для тех же целей что и был.
Новый реакт.
Ruslan
Он остался для тех же целей что и был.
Новый реакт.
Он уже официально считается устаревшим, этот метод жизненного цикла, и скорее всего скоро выпилят его
Dmitry
Он уже официально считается устаревшим, этот метод жизненного цикла, и скорее всего скоро выпилят его
Ага. И классы выпилят.
Там помеченные методы которые хотят выпилить. Но не по причине устаревания
Oleg
Кто нибудь покидайте сюда открытые git проекты сделанные на современном реакте
Lzhedmitry
Кто нибудь покидайте сюда открытые git проекты сделанные на современном реакте
А зайти в гитхаб и в поиске написать интересующую версию реакта?
Lzhedmitry
Там так можно?
Ну прям фильтра такого нет, но можно в строке поиска "react": "версия"
Roman
Всем привет, есть вопрос от новичка) Пробую применить css modules к stateless component, но ничего не изменяется. Где почитать, как это делается?
Oleg
Roman
SearchBar.js - компонент, App.css - стили. В файле App.js делаю так:
<div>
<SearchBar id={'id'} />
</div>
Oleg
SearchBar.js - компонент, App.css - стили. В файле App.js делаю так:
<div>
<SearchBar id={'id'} />
</div>
Название должно быть app.module.css. Делаешь import styles from “app.module.css” и используешь через styles.название
Roman
название так решает?
Danila
import style from './styles.css';
<div class={styles.className}></div>
Kirill
Что можете в плане изучения HTML+CSS, если всю жизнь на WYSIWYG?
HTML Academy не помог разобраться в другой парадигме 🙁
Oleg
Да вроде и не надо было никогда
У меня только с module приставкой работает. Раньше надо было модули вручную включать в вебпаке. А сейчас там настроено так что он сам понимает если есть приставка module значит это модуль
Roman
import style from './styles.css';
<div class={styles.className}></div>
а как вообще оно работает? Меняет как-то названия?