Крутая тема, крутое видео! Хуки и реакт вообще больная тема для меня, слишком много ошибок в них делают разработчики, причем любого уровня. Есть еще проблема про меморизацию компонента с children, про это многие забывают. Если передать обычный jsx в children компонента обернутого в memo, то на каждый рендер будет вызываться createElement для этого children, а createElement каждый раз создает новый объект, из-за чего меморизация ломается и добавляет лишний вред для производительности вычислениями меморизации. Еще в контекст многие любят передавать объект, ломая перф всего приложения одной строчкой. Очень круто, что вы поднимаете такие темы.
да, и разбор деталей и погружение в технические моменты, нравится мне изучать React вместе с Еленой и ее эмоциями))) Уникальность и оригинальность чувствуется!
Спасибо за такое видео, я сколько видео посмотрел по useMemo и по useCallback не понял, а тут прям все понятно, и весь ролик я так кайфовал, как будто АСМР смотрю)))
Это было исчерпывающее видео, очень круто что разжевали все подробно и все подводные камни изучили. Прям основательный подход Посреди видео поставил лайк и подписался. Зачет
Спасибо за видео! Первое видео, в котором наглядно и понятно объяснили в чём разница между useMemo, useCallback и React.memo. Особенно между useMemo, useCallback.
Спасибо за объяснение нюансов, ни у кого такого не слышал. Сам не сильно люблю использовать useMemo, так как сложно понять где он нужен а где нет. Но после видео теперь понял, где его можно юзать и как.
Клёво, что умеешь эмоции включать, так милее уроки получаются) буду изучать хуки, а то пока что знаю о таких как UseEffect и UseState, этого явно маловато ;) благодарю милая)
Просто огонь! Просто топ! Как все легко и структурно. Задолбался выковыривать инфу про эти хуки. Везде вроде и по делу и в то же время непонятно, что, когда и где пользовать. Спасибо!
Лена, спасибо за разбор работы мемоизации! Я благодаря ему смог разобрался в реальном проекте с проблемой переключения двух компонентов в табах. У тебя такой ситуации не показано и поэтому я долго исследовал исходник либы Antd и код кастомных табов, у нас на проекте, и не мог понять, почему useMemo не работало. Я и пропсы в компоненты отключил и в useMemo обернул, но они перерисовываются при каждом переключении табов и все тут. Но они же, и спропсами, в ANT'e прекрасно мемоизировались. Т.е. отрабатывали по первому разу, а потом брались из кэша. А проблема была в том, что эти компоненты заменяли друг друга в ДОМ при каждом переключении кастомных табов, т.к. брались из пропса (но это не важно в целом). И решение здесь только одно - монтировать в ДОМ сразу оба компонента (при этом они инициализируются тоже оба), а потом переключать их табами через смену стилей: display: none/block. И тогда они рендерятся заново только при реальной смене их собственных пропсов. Твой же компонент FactorialCalculation один раз монтируется в шаблоне и по нажатию на кнопку не удаляется, и поэтому useMemo для него работает. Но результат для меня очень радостный по итогу :))
А вот если я у родителя обернул onClick в usecallback И передал в дочернюю кнопку (как единсвенный параметр), которая обычная безе memo Она все равно перерендерится? Т.е зачем делать usecallback??? если я не делаю memo??
Учу реакт, но ещё не дошёл до этих хуков, изучаю useState, useEffect, use Context. Не смотря на это Лена рассказала очень понятно про useMemo, useCallback и reactMemo. Спасибо за ценную информацию)
Здрасте, у меня не работает memo в реактнатив. Короче есть Parent.js внутри есть передающее это состояние в дочерний function SearcResult (){ const typeState= useState (null); const root = useRoute() const {from, destination} = props.params //props.params приходит из useRoute. return ( ) } function UberTypes({typeState, }){ //import types from './assets/types.js const [type,setType]= typeState const onClick = (){ setType(type) } // return ( ) } Ну здесь я обернул React.memo( RuoteMap.js )потому что он неизменяется просто показывает картка и какую то анимацию после загрузки один раз и просп Стейт нечего не меняет. А тот UberTypes меняет тип при нажатии на на каждый UberTypesRow. Что я не правильно делаю? Но
Спасибо большое Елена, вчера из-за этой оптимизации провалил свой первый собес, а нужно было всего лишь раньше посмотреть ваш ролик и ответить правильно на собеседовании :(
0:00 Я тоже в свое время плакал когда все это изучал и наконец разобрался... Какими же дегенератами надо быть чтобы все так запутать. Нам рассказывают какой реакт классный и быстрый... Но когда ты сталкиваешься с реальностью на боевых проектах. Когда у тебя нет выхода кроме как поддерживать распиаренные плагины типа formik, в котором на серьезных формах с валидацией начинает тормозить обычный ввод текста в инпут, и ты понимаешь, что ничего сделать не можешь, потому что изначально архитектура этих решений такая...
Привет, а не подскажешь как правильно именовать css модули при импорте их в jsx: import вЭтомМестеКакПравильноИменовать from './КакойТоМодуль.module.css';
Наверное мой ответ уже будет не актуален, но если я правильно поняла, то можешь называть как тебе удобно или как на проекте надо, но часто вижу, что называют просто styles.
Спасибо за видео, как всегда все очень ясно и доступно, но есть один очень большой минус - это очень редкий выход видосов, уж оооочень хотелось бы видеть разные уроки почаще)
А ещё очень бы хотелось увидеть именно в твоей подаче видео по настройке вебпака или tsconfigа. Если будет возможность, сделай пожалуйста, буду ну очень тебе благодарен, та и люди, которые тебя смотрят, наверняка тоже обрадовались бы такому материалу
useMemo - я использовал когда создавал свой кастомный хук связанный с пагинацией (usePagination) т.к. там велись расчёты и возвращались 4 разные значения
Если не хотите перерендеривать компонент не имеющих пропсов вообще (или же они не меняются по ходу программы) - вместо memo лучше вытащить в константу: function FHome() {} export const FhomeComponent = ; И соответственно везде использовать {FhomeComponent} вместо . useCallback и useMemo можно зачастую тоже избегать, просто вытаскивая объявление функции в родительский компонент. Например, есть Child, который часто перерендеривается: function Child(props) { const time = useInterval(100); //типо кастомный хук, из-за которого этот комопент будет перендериваться каждые 100мс. const heavyResult = useCallback(() => heavyCalc(props.foo), [props.foo]); } Вместо useCallback можно разбить его на два компонента: function Parent(props) { const heavyResult = heavyCalc(props.foo); return }
@@webelart Это достаточно легко проверить! В вашем примере вы использовали Home = memo(Fhome). Соответственно, если где-то использовать , он перерендериваться не будет, ведь будет возвращена мемоизированная версия. Однако это можно заменить на следующую конструкцию: создать глобальную константу export const HomeComp = ; Если где-то использовать {HomeComp}? то он точно так же не будет перерендериваться. Почему? Потому что конструкция '' была вызвана только один раз, при объявлении глобально переменной.
@@angelicoctahedron3646 Все компоненты, которые вы задействуете внутри, если они не мемоизированы, будут перерендерены и не важно как вы их импортируете, вынесете или не вынесете.
@@webelart вот простой пример. redraw вызывается только один раз, при маунте компонента. И не вызывается при обновлении родителя. import React from 'react'; function Child() { console.log('redraw'); return Hello } const globalChild = ; export function App(props) { const [count,setCount] = React.useState(0); return (
{count} setCount(count +1)}> {globalChild}
); } Как видите, компонент не пришлось оборачивать его в memo. memo будет полезно когда у компонента меняются пропсы - но для propless компонентов (либо компонентов, чьи пропсы не меняются в ходе программы) его использование не имеет смысла. А магии здесь нет. Конструкция `` транслируется бабелом в createElement(Child). То есть получается, что эта функция будет вызываться каждый раз когда компонент рендерится. Но мы можем этого избежать: если будем передавать компонент через пропы (обычно через children), глобальные переменные, или используя memo.
после слов будем использовать хуки useMemo, useCallback и REACT.MEMO...... REACT.MEMO Карл, реакт мемо - это хук , Карл... захотелось выключить) надеюсь оговорка, щас посмотрим дальше
function sleep(ms) { const timeNow = Date.now(); while (timeNow + ms >= Date.now()); } Такая штука позволяет более наглядно имитировать тяжелые вычисления.
сверх оптимизация...точней что memo требует тоже ресурса а его ресурс так же является память... используем бывает в местах где нет необходимости запоминать.
Я может глупость спрошу, но почему бы не использовать эти хуки для запросов на сервер (fetch, или axios) ? Для некоторых данных не обязательно каждую секунду отправлять запрос на сервер, узнавать как там дела, не изменилось ли что-нибудь. Я к тому, что отправил запрос в бекэнд, получил данные, записал в стейт, и уже с этим стейтом работаешь, не перевызывая запросы на сервер (не говоря уже о том, что от сервера нужно ещё дождаться этих данных). Чем -не ресурсоёмкое- занимающее время выполнение? Почему для этих нужд не используется _useMemo_ ?
Проходил тестовое и была задачка оптимизировать ререндер в 3 компоненте чтоб при вводе в инпут не происходил ререндер, нужно было обернуть ончейнж в 1 компоненте юзколлбеком и 1 компонент обернуть реакт мемо хоком
@@webelart ок спасибо, Елена снимите пожалуйста видео про стадии рендера компонентов в реакт, почему например юзеффект в чилдрене отработет перед таким же в родителе, на собесах на мидла такое спрашивали. И если в див родителя передать коллбек с рефом и консоль логом почему оно срабатывает до рендера чилдрена. Спасибо и развития вам и вашему каналу !
4:07 - хуки useMemo и useReact..... боже.... я понимаю что все могут оговориться, но это не значит что надо оставлять такой материал... новички посмотрят и реально будут искать хук useReact... ну проверяйте свой контент перед тем как выкладывать, это не дело
Максимум, что я пью, курю, дую! Это программирование. 💃 Так что дорогие мои подписчики, давайте вместе под ПРОГРАММИРОВАНИЕ! 😎 ААХАХ или ЗА программирование. 🤭❤🔥
Спасибо за информацию Но режет слух слово проПСЫ Что ещё за псы) Хотя судя по наличию видео урока про галерею с волками, видимо человек как раз любит псов) А я говорю прОпсы
😂😂 Я вообще не пью! Мой эмоциональный импакт этого не требует вообще...😁 Да и настроение разное. Ещё иногда хочется в видео, чтобы барьеры над сложностью материала снимались. Было интересно, весело и дружелюбно. ❤
Кстати и да, ещё хотела написать! Вы тут поаккуратнее с такими комментариями, меня мама смотрит! 😎 В прошлый раз мне пришлось убеждать, что я не под наркотой тут в Лондоне, без присмотра😅😅
@@hasegawataizou5038 Я просто решила пошутить, всё нормально 😂😂 Пишите разные комменты! Я серьёзно, как чувствуете! Это очень КРУТО! А маме я просто передаю привет. Мамуль, если ты это читаешь, люблю тебя безмерно, со мной всё хорошо ❤🙃
Да, ладно вам, не расстраивайтесь! :) Но в тоже время я понимаю вас, мне кажется было бы здорово как-то через профилирование пройти и чтобы конкретные кейсы были и исследование, тогда это было бы огонь. Мне здесь ещё подрасти тоже надо и опыта набраться. Как только нахватаюсь кейсов побольше, уверена сниму ещё видео. ❤
Крутая тема, крутое видео!
Хуки и реакт вообще больная тема для меня, слишком много ошибок в них делают разработчики, причем любого уровня.
Есть еще проблема про меморизацию компонента с children, про это многие забывают. Если передать обычный jsx в children компонента обернутого в memo, то на каждый рендер будет вызываться createElement для этого children, а createElement каждый раз создает новый объект, из-за чего меморизация ломается и добавляет лишний вред для производительности вычислениями меморизации. Еще в контекст многие любят передавать объект, ломая перф всего приложения одной строчкой.
Очень круто, что вы поднимаете такие темы.
Спасибо за комментарий и за дополнение про children. Закрепляю!
Так объект можно в useMemo завернуть) не ломая перф никакой
@@sergeys4732 ага, так и надо. Просто для контекстов про это часто забывают, хотя там эта ошибка будет дорогой
@@Владимир.П-е9о ога, ну или вынести объект за пределы компоненты и угомониться. Потому что тут он константный.
Как у вас лампово и на лайте, никакой душноты, успехов вам)
😘 Спасибо!
да, и разбор деталей и погружение в технические моменты, нравится мне изучать React вместе с Еленой и ее эмоциями))) Уникальность и оригинальность чувствуется!
Какую хорошую вы проделали работу с этим уроком, браво!
Спасибо Елена, заслуженный лайк и подписка)) просмотрел кучу видео на эту тему, но так доходчиво еще никто не объснял
Феминизация слова "компонент" прошла успешно
КомпонентА ❤
ахахахах)мне тоже слух прям режет)
@@АлександрКас-н7з Да нормально, слово общеупотребимое :)
Спасибо за такое видео, я сколько видео посмотрел по useMemo и по useCallback не понял, а тут прям все понятно, и весь ролик я так кайфовал, как будто АСМР смотрю)))
Это было исчерпывающее видео, очень круто что разжевали все подробно и все подводные камни изучили. Прям основательный подход
Посреди видео поставил лайк и подписался. Зачет
Спасибо! Очень доходчиво и понятно все объяснено. Приятно смотреть.
Я очень рада! 😍☺
Спасибо за видео! Первое видео, в котором наглядно и понятно объяснили в чём разница между useMemo, useCallback и React.memo. Особенно между useMemo, useCallback.
Спасибо за объяснение нюансов, ни у кого такого не слышал. Сам не сильно люблю использовать useMemo, так как сложно понять где он нужен а где нет. Но после видео теперь понял, где его можно юзать и как.
Клёво, что умеешь эмоции включать, так милее уроки получаются) буду изучать хуки, а то пока что знаю о таких как UseEffect и UseState, этого явно маловато ;) благодарю милая)
☺️ круто! Спасибо!
Просто огонь! Просто топ! Как все легко и структурно. Задолбался выковыривать инфу про эти хуки. Везде вроде и по делу и в то же время непонятно, что, когда и где пользовать. Спасибо!
Обалденный контент. Спасибо! Жаль раньше вас не нашел
Спасибо Елена, все круто и понятно, мне понравилось, подписка! Успехов и удачи!!)
Большое спасибо за качественный контент, как раз подхожу к хукам, в изучении реакта, видео пришлось как нельзя кстати :)
Оооооооо, тема с useMemo и React.memo это топ. А то в инэте в основном инфа по useState и useEffect) Спасибо большое, жду видос про tsconfig.json😄😄
Будет следующим видео! ❤
Лена, спасибо за разбор работы мемоизации! Я благодаря ему смог разобрался в реальном проекте с проблемой переключения двух компонентов в табах. У тебя такой ситуации не показано и поэтому я долго исследовал исходник либы Antd и код кастомных табов, у нас на проекте, и не мог понять, почему useMemo не работало. Я и пропсы в компоненты отключил и в useMemo обернул, но они перерисовываются при каждом переключении табов и все тут. Но они же, и спропсами, в ANT'e прекрасно мемоизировались. Т.е. отрабатывали по первому разу, а потом брались из кэша. А проблема была в том, что эти компоненты заменяли друг друга в ДОМ при каждом переключении кастомных табов, т.к. брались из пропса (но это не важно в целом). И решение здесь только одно - монтировать в ДОМ сразу оба компонента (при этом они инициализируются тоже оба), а потом переключать их табами через смену стилей: display: none/block. И тогда они рендерятся заново только при реальной смене их собственных пропсов. Твой же компонент FactorialCalculation один раз монтируется в шаблоне и по нажатию на кнопку не удаляется, и поэтому useMemo для него работает. Но результат для меня очень радостный по итогу :))
Супер классное понятное объяснение!! Елена спасибо огромное, крутая подача, продолжайте в том же духе 🔥
Огромное спасибо! Я сидел с этими темами 4 часа.
Спасибо рекомендациям за ваш канал)
Подача, как всегда - волшебно! :)))
Круто, смотрю третье видео перед подготовкой к собесам.
Спасибо )
Спасибо большое за видео, очень нравится ваша подача и позитивное настроение
Желаю побольше просмотров и развития каналу, вы классная :)
Очень доходчиво объяснила 🔥
Елена, огромная тебе благодарность 🤟🏻
Елена, спасибо огромное! Лучшие видео-лекции про веб ❤
❤❤❤ Я рада, что материал полезен!
А вот если я у родителя обернул onClick в usecallback
И передал в дочернюю кнопку (как единсвенный параметр), которая обычная безе memo
Она все равно перерендерится? Т.е зачем делать usecallback??? если я не делаю memo??
Спасибо большое, наконец то я понял эти два хука
Какая же ты крутая, Лена!
☺❤
Умничка! Спасибо за видео❤
Учу реакт, но ещё не дошёл до этих хуков, изучаю useState, useEffect, use Context. Не смотря на это Лена рассказала очень понятно про useMemo, useCallback и reactMemo. Спасибо за ценную информацию)
Спасибо за разъяснение, помогло!
Елена все краше и краше с каждым видео😊
😍 Спасибо!
Спасибо, очень доступно для понимания !
Спасибо большое!!! Супер!
Здрасте, у меня не работает memo в реактнатив. Короче есть Parent.js
внутри есть передающее это состояние в дочерний
function SearcResult (){
const typeState= useState (null);
const root = useRoute()
const {from, destination} = props.params
//props.params приходит из useRoute.
return (
)
}
function UberTypes({typeState, }){
//import types from './assets/types.js
const [type,setType]= typeState
const onClick = (){
setType(type)
}
//
return (
)
}
Ну здесь я обернул React.memo( RuoteMap.js )потому что он неизменяется просто показывает картка и какую то анимацию после загрузки один раз и просп Стейт нечего не меняет. А тот UberTypes меняет тип при нажатии на на каждый UberTypesRow. Что я не правильно делаю? Но
Интересно было послушать, благодарчик
Спасибо большое Елена, вчера из-за этой оптимизации провалил свой первый собес, а нужно было всего лишь раньше посмотреть ваш ролик и ответить правильно на собеседовании :(
0:00 Я тоже в свое время плакал когда все это изучал и наконец разобрался... Какими же дегенератами надо быть чтобы все так запутать. Нам рассказывают какой реакт классный и быстрый... Но когда ты сталкиваешься с реальностью на боевых проектах. Когда у тебя нет выхода кроме как поддерживать распиаренные плагины типа formik, в котором на серьезных формах с валидацией начинает тормозить обычный ввод текста в инпут, и ты понимаешь, что ничего сделать не можешь, потому что изначально архитектура этих решений такая...
Что по RoadMap?
Ещё не сделала 😔 Поможете сгруппировать видео?
@@webelart да конечно, помогу
Мидл+ контент, то что надо. А то я вызубрил что-то про хуки, а как использовать - не понимаю. Спасибо.
спасибо за урок и хорошее настроение)
Пожалуйста! 🥰❤ Рада, что урок понравился!
да. недавно как раз именно эта инфа появилась на канале в тг React, буквально несколько дней)
лайк, репост, комментарий для продвижения в топ!
❤❤❤
Привет, а не подскажешь как правильно именовать css модули при импорте их в jsx:
import вЭтомМестеКакПравильноИменовать from './КакойТоМодуль.module.css';
Да, это для nextjs
@@webelart нет это для react, фронтенд часть
Наверное мой ответ уже будет не актуален, но если я правильно поняла, то можешь называть как тебе удобно или как на проекте надо, но часто вижу, что называют просто styles.
@@Kleo_WyattПривет, да уже не актуален, но всё равно спасибо большое за потраченное время на меня, успехов вам
Спасибо за видео, как всегда все очень ясно и доступно, но есть один очень большой минус - это очень редкий выход видосов, уж оооочень хотелось бы видеть разные уроки почаще)
Спасибо за комментарий! Я стараюсь, стараюсь ребята! 😘❤️
А ещё очень бы хотелось увидеть именно в твоей подаче видео по настройке вебпака или tsconfigа. Если будет возможность, сделай пожалуйста, буду ну очень тебе благодарен, та и люди, которые тебя смотрят, наверняка тоже обрадовались бы такому материалу
Классно развиваетесь
Спасибо
Елена, а Вы просто Software Engineer или Mistress Software Engineer? 🙂 (Senior)
Про useReducer, useContext тоже будут?
Сделаю 👍
useMemo - я использовал когда создавал свой кастомный хук связанный с пагинацией (usePagination) т.к. там велись расчёты и возвращались 4 разные значения
Спасибо за видео, все круто и информативно! Единственное, в некоторых местах советуют не класть компоненты в служебную папку pages в Next.js)
Вроде туда только стили положила. Вообще да, это же папка для роутинга
@@ReAgent003Эх, пока в Лондоне. Но Яндексу сердечки! ❤
Если не хотите перерендеривать компонент не имеющих пропсов вообще (или же они не меняются по ходу программы) - вместо memo лучше вытащить в константу:
function FHome() {}
export const FhomeComponent = ;
И соответственно везде использовать {FhomeComponent} вместо .
useCallback и useMemo можно зачастую тоже избегать, просто вытаскивая объявление функции в родительский компонент. Например, есть Child, который часто перерендеривается:
function Child(props) {
const time = useInterval(100); //типо кастомный хук, из-за которого этот комопент будет перендериваться каждые 100мс.
const heavyResult = useCallback(() => heavyCalc(props.foo), [props.foo]);
}
Вместо useCallback можно разбить его на два компонента:
function Parent(props) {
const heavyResult = heavyCalc(props.foo);
return
}
Почему вы решили, что такой компонент не будет перерендериваться?
@@webelart
Это достаточно легко проверить! В вашем примере вы использовали Home = memo(Fhome). Соответственно, если где-то использовать , он перерендериваться не будет, ведь будет возвращена мемоизированная версия.
Однако это можно заменить на следующую конструкцию: создать глобальную константу
export const HomeComp = ;
Если где-то использовать {HomeComp}? то он точно так же не будет перерендериваться.
Почему? Потому что конструкция '' была вызвана только один раз, при объявлении глобально переменной.
@@angelicoctahedron3646 Так вы проверяли? Почему спрашиваю, потому что перерендеринг будет.
@@angelicoctahedron3646 Все компоненты, которые вы задействуете внутри, если они не мемоизированы, будут перерендерены и не важно как вы их импортируете, вынесете или не вынесете.
@@webelart
вот простой пример. redraw вызывается только один раз, при маунте компонента. И не вызывается при обновлении родителя.
import React from 'react';
function Child() {
console.log('redraw');
return Hello
}
const globalChild = ;
export function App(props) {
const [count,setCount] = React.useState(0);
return (
{count}
setCount(count +1)}>
{globalChild}
);
}
Как видите, компонент не пришлось оборачивать его в memo. memo будет полезно когда у компонента меняются пропсы - но для propless компонентов (либо компонентов, чьи пропсы не меняются в ходе программы) его использование не имеет смысла.
А магии здесь нет. Конструкция `` транслируется бабелом в createElement(Child). То есть получается, что эта функция будет вызываться каждый раз когда компонент рендерится. Но мы можем этого избежать: если будем передавать компонент через пропы (обычно через children), глобальные переменные, или используя memo.
после слов будем использовать хуки useMemo, useCallback и REACT.MEMO...... REACT.MEMO Карл, реакт мемо - это хук , Карл... захотелось выключить) надеюсь оговорка, щас посмотрим дальше
👍👍👍
Жалко, что нельзя поставить млн лайков ❤
Спасибо большое!!! ❤❤❤ Рада, что контент нравится! 🥰
Хорошее видео
Спасибо!
@@webelart Вам огромное спасибо, очень информативное и полезное видео, как раз полностью раскрывается useMemo, useCallback
function sleep(ms) {
const timeNow = Date.now();
while (timeNow + ms >= Date.now());
}
Такая штука позволяет более наглядно имитировать тяжелые вычисления.
Крутой пример!
thanks
Хороший урок! Очень позитивно и полезно, про злободневные штуки при React разработке.
сверх оптимизация...точней что memo требует тоже ресурса а его ресурс так же является память... используем бывает в местах где нет необходимости запоминать.
Что может быть лучше, когда красивая женщина учит тебя как пользоваться своим инструментом)
Что может быть лучше? Ну вот миллион долларов, например, лучше.
можешь по простому объяснить что такое pure component? а то ты много раз его в видео упоминаешь)
Да, я под Pure компонентой имела ввиду компоненту обёрнутую в React.memo.
Я может глупость спрошу, но почему бы не использовать эти хуки для запросов на сервер (fetch, или axios) ? Для некоторых данных не обязательно каждую секунду отправлять запрос на сервер, узнавать как там дела, не изменилось ли что-нибудь. Я к тому, что отправил запрос в бекэнд, получил данные, записал в стейт, и уже с этим стейтом работаешь, не перевызывая запросы на сервер (не говоря уже о том, что от сервера нужно ещё дождаться этих данных). Чем -не ресурсоёмкое- занимающее время выполнение? Почему для этих нужд не используется _useMemo_ ?
Отличный вопрос! ❤️ Для этих нужд используется useEffect с пустыми скобками.
Проходил тестовое и была задачка оптимизировать ререндер в 3 компоненте чтоб при вводе в инпут не происходил ререндер, нужно было обернуть ончейнж в 1 компоненте юзколлбеком и 1 компонент обернуть реакт мемо хоком
Спасибо что поделились! Но вы в будущем пишите нормально называя, раза три пришлось перечитать, чтобы понять ❤️
@@webelart ок спасибо, Елена снимите пожалуйста видео про стадии рендера компонентов в реакт, почему например юзеффект в чилдрене отработет перед таким же в родителе, на собесах на мидла такое спрашивали. И если в див родителя передать коллбек с рефом и консоль логом почему оно срабатывает до рендера чилдрена. Спасибо и развития вам и вашему каналу !
💥💥💥
Учусь в уральском вузе и мечтаю уехать в Лондон, чтобы стать таким же весёлым и жизнерадостным, как Елена)
Желаю, чтобы всё у вас получилось! ❤
Главное учитесь, вкладывайтесь, идите к мечте и желанию, и оно точно исполнится!
Сразу видно что чувствуешь архитектуру. Не чисто на зубрёжке.
memo же можно также, как и хуки имортить и писать без React
UseDefferedValue and UseTransition hooks please 🙏
Не думаю, что использовать хуки по ощущения правильно. Но спасибо за объяснения
Пришёл посмотреть МЕМЫ, в итоге изучил хуки)
Как мне не хватало девочек тьюторов! : *****
4:07 - хуки useMemo и useReact..... боже.... я понимаю что все могут оговориться, но это не значит что надо оставлять такой материал... новички посмотрят и реально будут искать хук useReact... ну проверяйте свой контент перед тем как выкладывать, это не дело
Вы чего так тригеритесь, ну оговорилась, а у вас словно Солнце на Землю упало. Нормально всё. Расслабьтесь и наслаждайтесь контентом. 😘
Душнила
А не проще так экспортировать: export default React.memo(SomeComponent); без дополнительных именований
Не имеет значения. Зависит от того как у вас линтер в команде настроен.
ты как будто дунула немного перед записью,без обид) я твой фанат
Ахахаха, 😂 Я тут уже писала, не пугайте мою маму. Она меня смотрит.
P.S. Мамуль наркотой не страдаю!! ЧЕСТНОЕ СЛОВО!! Люблю тебя ❤
Максимум, что я пью, курю, дую! Это программирование. 💃 Так что дорогие мои подписчики, давайте вместе под ПРОГРАММИРОВАНИЕ! 😎 ААХАХ или ЗА программирование. 🤭❤🔥
Спасибо за информацию
Но режет слух слово проПСЫ
Что ещё за псы)
Хотя судя по наличию видео урока про галерею с волками, видимо человек как раз любит псов)
А я говорю прОпсы
Хаха, не я не очень люблю собак. Я кошатница.
накуренная ?😀😀😀😀 класс видео
😂 Я не курю...
Было бы здорово услышать о том как правильно делать http запросы useffect!
у сайта loveholidays огромные проблемы с версткой)
Конкретику дадите?
@@webelart на мобильном есть небольшой scroll-x
@@alexeyfilippov42 Скажите какая страница и какое у вас разрешение экрана? Пофиксим!
В начале думал Она бухая.Но поняв что я без работы , и травмы. Понел что я никто
😂😂 Я вообще не пью! Мой эмоциональный импакт этого не требует вообще...😁 Да и настроение разное. Ещё иногда хочется в видео, чтобы барьеры над сложностью материала снимались. Было интересно, весело и дружелюбно. ❤
Кстати и да, ещё хотела написать! Вы тут поаккуратнее с такими комментариями, меня мама смотрит! 😎 В прошлый раз мне пришлось убеждать, что я не под наркотой тут в Лондоне, без присмотра😅😅
@@webelart Незнаю как ответит на этот вопрос Ты ведь взрослая а Мой коммент Жизнейщая жизабенейшая своя логика и своя правда
@@hasegawataizou5038 Я просто решила пошутить, всё нормально 😂😂 Пишите разные комменты! Я серьёзно, как чувствуете! Это очень КРУТО!
А маме я просто передаю привет. Мамуль, если ты это читаешь, люблю тебя безмерно, со мной всё хорошо ❤🙃
@@webelart а я уже начел думать что со мной что то не так
Слишком симпотная.
😍💃Спасибо!! Очень приятно!!!
@@webelart Просто правда.
Ну слабенько как-то про то, где надо, а где нет. Делать по ощущениям, это не совет. Только ради этого по сути и смотрел, а тут ничего нового.
Да, ладно вам, не расстраивайтесь! :) Но в тоже время я понимаю вас, мне кажется было бы здорово как-то через профилирование пройти и чтобы конкретные кейсы были и исследование, тогда это было бы огонь. Мне здесь ещё подрасти тоже надо и опыта набраться. Как только нахватаюсь кейсов побольше, уверена сниму ещё видео. ❤
Кстати если вдруг увидите видео с хорошим объяснением профилирования и сравнения с мемоизацией, тоже кидайте!
Рекурсия - тяжелая функция🤡🤡 завязывай
Давай ты уж сам себе шнурки как-нить завяжешь 😉
если честно, проще доку почитать, ничего не понятно
Прочитайте доку, после возвращайтесь для наглядных примеров❤
так чтобы получить самую достоверную инфу- только доку и нужно читать, а не смотреть видосы от джунов)
КомпоненТ. Не ТА, Т! Зачем коверкать?
Понятно, что это пример, но если объект константный - его вообще выносят за пределы компонента и все. Никаких мем не нужно - это жирно сильно.
возьми с полочки пирожок, ты умничка. а если будет ещё что-нибудь - обязательно заходи за вторым пирожком
@@enjoymtx ты главное побольше запасись ими, я еще за третьим приду и четвертым
Привет, когда стрим ?
Уже был на канале Алгосиков с Виктором ruclips.net/video/SJeQgSdy6Sk/видео.html. Хотите ещё? :)))
@@webelart Ну это вам тогда опрос надо устроить на стёт проведения нового стрима). Я это всенда за) всякий движ)
@@evgeniy3370 Сделаю!
В telegram! ❤