React Batching от создания (v0.4.0) до React 18

[@ПавелВоробьёв-ю2ы]

Пожалуйста, не убирайте субтитры, т.к. я слабслышащийся, другого способа воспринять инфу у меня нет, даже если это корявые сабы! Так держать, спасибо!

[@it-sin9k]

Привет :) Постараюсь вернуть субтитры ко всем видео и на будущее буду еще просматривать корявые субтитры в видео и править, где коряво переведено :) Так как я теперь знаю, что это кому то нужно) спасибо за комментарий!

[@sphardegod5451]

Кстати, по сути можно сделать скрипт, воспринимающий все аудио и за счёт какой-то либы выводящий тебе текст

[@gritsienkooleg3447]

Ребята, вы делаете большое дело) Реально, раскрывая на широкую публику такие важные механики реакта, вы просто конкретно улучшаете среду разработчиков, глубину их знаний, понимание, заинтересованность.. Просто хочу ещё поблагодарить за ваш труд! Продолжайте, пожалуйста))

[@it-sin9k]

Спасибо!) будем продолжать в таком же духе)

[@vegeman8954]

Огонь! Посмотрел на одном дыхании, Дима интересно рассказывает

[@serhiimaliuha69]

ПО БОЛЬШЕМУ СЧЕТУ спасибо за доклад!

[@holaamigogringoz]

Синяк ты лучший!)

[@it-sin9k]

спасибо!) очень приятно)

[@КириллОмаров-ш8ч]

Хороший доклад

[@gritsienkooleg3447]

Очень круто, спасибо большое!!!

[@BlueCell]

Спасибо, было интересно

[@Ramosok]

Новый выпуск, новый праздник) спасибо!

[@it-sin9k]

С Наступающим Новым Годом)

[@AttackHelicopter64]

вместо flushSync можно использовать requestAnimationFrame не трогаем все setState, а после них будет requestAnimationFrame(() => refFields[type]?.focus())

[@ilikecola378]

Классное видео. Не могу разобрать слово на 26:10, где все описано =) в ливе, либе, лире подскажите пожалуйста.

[@arswarog]

Спасибо большое!

[@ДмитрийХомиченко]

Было очень интересно послушать. Спасибо!

[@alexeysvetlenko2217]

Класс, спасибо.

[@ЕвгенийНекрасов-ч8ж]

С самого начала доклада ошибка. Изменение пропс не влечёт за собой изменение состояния. Измените пропс это всего лишь последствия изменения стейта у родителя

[@ЕвгенийТяка-ч4х]

Круто, спасибо!

[@dimitro.cardellini]

ух і перехвилювався мій теска ... успіхів йому з наступними доповідями

[@zhenia14]

Ну так чё там? разобрался что передаётся по ссылке, а что по значению? видос про это будет?

[@it-sin9k]

не) не будет) В интернете и так полно ресурсов на эту тему)

[@orucqarayev4759]

Классный спикер!

[@ilyaprotsenko1023]

Вопрос: решались ли Вы уже стартовать какой-нибудь коммерческий проект на 18-ой версии? Если да, то объясните почему, и если нет, то тоже интересно мнение. Спасибо)

[@it-sin9k]

Привет :) Мы буквально 2-3 месяца назад, мигрировали огромный сложный проект на React 18, вроде особых проблем не увидели

[@husky_ya]

Привет. Реакт 18 уже не будет такой предсказуемый для разработчика, как 17. Это сулит трудностями не в создании страниц, а в реализации желаемого поведения. Посмотрите сами, как теперь стало неочевидно триггерить фокус на инпуте, хотя казалось бы. Разрабатываю проект, тяжеловесный, многие модули которого очень завязаны на логике с рефами. (здесь очевидно нужен был другой инструмент, точно не реакт, однако выбрали его из-за простоты) Из-за непредсказуемых рендеров DOM в 18 реакте, и следовательно, как сказал докладчик, всегда отложенной инициализации рефов, от апгрейда до 18 решили отказаться. Нам возможности типа Offscreen, не нужны, частные ситуации этого юзкейса решаем руками. А useEvent, про который автор канала рассказывал недавно, на стеке mobx+react не нужен: любой колбэк (являющийся экшеном) уже является физически одной и той же ссылкой и не меняется. Это кстати и к изменяемым объектам тоже относится. Проблему перфоманса JS, в частности батчинга, решаем стандартными средствами mobx + аккуратной расстановкой key + ... нелюбимым в официальной прессе React.memo. Звучит это всё непрозрачно. Однако проблема решается - путём взятия рендеринга под свой контроль, там это можно, все инструменты для этого на вышеупомянутом стеке есть. Реакт17 = всё ещё шаблонизатор, не более. Для нового проекта (который у меня пока не предвидится), использовать react@18 или он же в яркой обёртке next@13 - побоялся бы, считаю что "не выстрелит" из-за проблем с рефами, всё-таки их не только ради focus() и скролла юзают. Там есть ещё проблема одна - закадровые рендеры (startTransition, и возможно не только) теперь в проде!, но с этим разработчики живут ещё со времён StrictMode и вроде как даже привыкли. Для нового проекта, с учетом зрелости 17.0.2 уже можно начать искать другие реакт-подобные либы. А какие вы знаете альтернативы реакту?

[@valentynkuriato605]

найс,по факту-спасибо

[@romandeveloper7720]

огонь!

[@multtanker6365]

Очуменный конечно канал)

[@chum2470]

Хотим видео про эффектор!

[@testchannel3265]

с языка снял

[@bjol_Dg]

хотим видео про видео как снималось видео 😅

[@it-sin9k]

Есть такое в планах, но позже)

[@skeelo3157]

Какой большой у него счет

[@lionstar3189]

отличная лекция. У меня возник не большой вопрос про перерендер в реакте(перерендер в дом браузера имею ввиду). В реакте же только одна вещь вызывает перерендер - это изменение стейта, с помощью useState, useReducer, useContext(в этом случае меняется контекст и перерендриться только тот компонент в котором поменялся контекст). Да пропсы тоже влияют, но для этого у родителя нужно поменять стейт, что бы его дочерние компоненты у которых изменился пропс так же перерендрился и это влияет только на PureComponent-ах только. В обычных без PureComponent перерендер будет всегда, не смотря что стало с пропсами если обновляется родитель. Или это не так? Просто глянул лекцию кое где и поплыл...

[@it-sin9k]

Если компонент начал рендериться по какой-либо причине, то все его дети так же будут рендериться, за исключением тех, кто является PureComponent. У этих будут сравниваться props и будет приниматься решение рендерить или нет на основнании результатов сравнения.

[@АдамБайсаров-ш2с]

У меня было собеседование с ним)

[@it-sin9k]

Насколько мир мал))

[@Bjatta]

По большому счёту...

[@npo51ema]

я тут задался серьезным вопросом, как мы знаем браузер генерит рендер дерево и после вызывает layout() для того чтобы определить расположение нод. Собственно layout не бесплатная операция и требует определенных ресурсов cpu и я задумался вот над чем, что происходит когда мы в реакте пишем что-то типа {isOpened && } получается мы маунтим Модалку в дерево и браузер должен будет вызвать layout? Почему бы не использовать вместо этого display: none и изменять только этот стиль когда нам нужно будет показать модалку, в таком случае браузеру достаточно будет вызвать paint(). Или может реакт под капотом так и работает, в любом случае интересно мнение автора данного канала. Видос супер!

[@it-sin9k]

Спасибо за комментарий! display none к сожалению это не серебряная пуля, так как на одном экране может быть 10-ки тултипов, поповеров и попапов и все они должны в таком случае отрисоваться и быть скритыми с помощью display: none. Хотя может не один из них пользователю так и не понадобится. Это выглядит не рационально. С другой стороны, вы тоже правы, что не хотелось бы постоянно отрисовывать и потом удалять попап из дерева. React команда тоже об этом думала и по этому поводу создала отдельный компонент Offscreen. Я записал видео про него: kzbin.info/www/bejne/ooC4pK1mnMx3qc0

[@snowsnowy677]

круто, но было бы неплохо еще на код глянуть, есть ссылка??

[@edwardfreedom]

дока

[@it-sin9k]

пну автора, мб подготовит ссылки :)

[@ДмитрийГрош-м1щ]

привет, youtube почему удалял коменты когда я пытался оставить ссылки, вообщем исходники из презы лежат на гите, можешь поискать по этому пользователю DmitriyGrosh. Репозитории называются react4 для 4 версии, react-batching-17v2 для 17 версии и react-batching-18 для 18 версии

[@it-sin9k]

Добавил ссылки в описание, Спасибо Диме за ссылки!)

[@pavlof]

есть крутое видео про работу реакта, в данном видео спикер создает самую малую часть реакта, по сути это просто функция которая рендерит то что в нее передали, но видео тем не менее очень крутое и дает небольшое представление, вам можно сделать что-то подробное но добавить часть про reconciliation. либо можно сделать серию видео про создание "своего" реакта. вот ссылка на видео kzbin.info/www/bejne/nGPQfoKfeLida8U

[@it-sin9k]

есть видео и про reconciliation: kzbin.info/www/bejne/d2G6Y6Folt97a9U и более широко раскрытый доклад, на эту же тему: kzbin.info/www/bejne/hIG7e6GBrtl4iJY

[@pavlof]

@@it-sin9k спасибо

[@fedordostoevskiy4209]

Половина разработчиков думали что это новая фича? Это они собеседования проводят? 😂😂😂 Возьмите меня в штат. Я сеньор сразу тогда 🥳

[@nikto1851]

Выносить в стэйт-мэнеджер лодинги и логику модальных окон это через чюр.. Мусор в проекте и жесткая привязка ui к стэйт-мэнеджеру..

[@popuguytheparrot_]

Растешь в контенте.

[@lesters]

блин мне больше заходит слово мердж, что логичнее :) реакт просто мерджит однотипные сетстейты, в разных частях кода

[@mzpizote]

В принципе по большому щету автор прыгает не туда