Тёма Сенюков - Опасны ли перерендеры в React и как их избежать?

Поделиться
HTML-код
  • Опубликовано: 21 ноя 2024

Комментарии • 53

  • @ilikecola378
    @ilikecola378 3 месяца назад +2

    Незачто)
    5:17 рендеринг в браузере и реакте это разное
    6:00 Фазы рендеринга
    10:00 Пример демонстрация проблемы
    14:40 Инструмент React Profiler
    17:00 Категории перерендеринга
    - 18:00 Лишние отрисовки
    - 26:00 Количество элементов
    - 33:40 Наличие логики эффектов
    - 35:00 Лишние моунты
    39:30 Итоги и вопросы
    на 13:00 браузер не так уж и спит) я попробовал реализацию примера из 11:30 отобразить 1000 элементов, которые выводят только Yes на ноуте corei5-4210 2.9Ghz это загрузка ядра 100% на corei9 5Ghz загрузка ядра 20%, Тёма скорее всего имел ввиду что не будет reflow и paint, но тем не менее...
    хорошо бы Тёма и статьи писал краткий пересказ этого замечательного видео очень хотелось бы, я конечно его сделал но времени ушло немало

  • @endlesslysorrow
    @endlesslysorrow 7 месяцев назад +1

    очень полезный доклад, спасибо, и главное можно будет везде применить!

  • @siberiacancode
    @siberiacancode 7 месяцев назад +2

    Тема как всегда хорошо, спасибо за доклад

  • @zrtsky
    @zrtsky 7 месяцев назад +1

    как раз занимаюсь разработкой кастомного плеера, интересно было послушать, спасибо

  • @d0paminer
    @d0paminer 7 месяцев назад +19

    То, что должен знать миддл про мемоизацию на интервью)

    • @puffinavtz3966
      @puffinavtz3966 7 месяцев назад +19

      В реалиях 2024 года, уже стажер должен знать)))

    • @boycovclub
      @boycovclub 7 месяцев назад

      @@puffinavtz3966 мне по хуй я ничего не знаю и больше вас всех денег получаю)

    • @touristcompany1105
      @touristcompany1105 4 месяца назад

      @@puffinavtz3966 А что же тогда должен знать миддл?)

    • @__kawaii
      @__kawaii 4 месяца назад +1

      ​@@touristcompany1105миддлов не существует, только стажеры и тим лиды

  • @Graphouny77
    @Graphouny77 6 месяцев назад

    В целом большую часть знал еще с доклада из ШРИ, но про фишку с контекстом спасибо. Буду использовать)

  • @carry-on-chaos4032
    @carry-on-chaos4032 7 месяцев назад

    Топ! по делу, без воды, спасибо!

  • @surenstepanyan9151
    @surenstepanyan9151 2 месяца назад

    Прошу прощения хочу задать вопрос , всегда смотрю презентации Тёмы , (и не только) ,, в моменте (35:38) когда вы рассказываете про ненужных вызовов ХУККОВ, и плавно переходите к демонстрации ХОК-ов разве в обеих случаях не вызывается наш ХУК? . Или я что то не так понимаю. Заранее спасибо ха ответ.

  • @ДжонРембо-в9ъ
    @ДжонРембо-в9ъ 7 месяцев назад +2

    А по какой ссылке с QR-кода нужно перейти и где написать, чтобы Кинопоиск в сериалах вернул кнопку «Предыдущая серия»?

  • @vladimircreator
    @vladimircreator 7 месяцев назад +1

    Без воды и всё по делу 👍

  • @МаксимЖданов-н4о
    @МаксимЖданов-н4о 7 месяцев назад

    Тёма лучший, спасибо!

  • @GutSamJack
    @GutSamJack 7 месяцев назад +1

    Тёма огонь!

  • @sergeydostovalov6180
    @sergeydostovalov6180 7 месяцев назад +33

    Жду тот день, когда Дэн Абрамов выйдет к толпе и скажет, как это он сделал с редаксом, что реакт - это обман, а сам он использует solid js, где нет ререндеров

  • @from_brest2631
    @from_brest2631 7 месяцев назад

    Все по просту, но четко, лойс

  • @verbs-otier-ru
    @verbs-otier-ru 7 месяцев назад +6

    Как бы ничего нового, простые и логичные вещи, которые изучаются во время разработки любого приложения больше, чем to-do-list. Но парень очень хорош как оратор, поэтому было интересно посмотреть даже на 1х и без перемоток.

  • @diaskappassov
    @diaskappassov 4 месяца назад

    Очень хороший доклад, хотелось бы чтобы имелись таймкоды

    • @HolyJS
      @HolyJS  4 месяца назад

      Здравствуйте! Передали пожелание по тайм-кодам коллегам 🙂

  • @Dragolietel
    @Dragolietel 5 месяцев назад

    Не так опасны ререндеры как их последствия. И падение с высоты без парашюта само по себе не опасно, но последствия - встреча с землей опасна, да :) Не, в целом норм, очень даже

  • @arsenybazel2704
    @arsenybazel2704 6 месяцев назад

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

  • @dimovich85
    @dimovich85 7 месяцев назад

    Спасибо, все по делу

  • @vadiiimyeeeekn
    @vadiiimyeeeekn 7 месяцев назад

    С псевдородителем не понял, что меняется от оборачивания Context.Provider и useState в отдельный компонент?

  • @artgurianov
    @artgurianov 7 месяцев назад +1

    Спасибо, топ 👍

  • @paulmalys
    @paulmalys 7 месяцев назад +3

    Спикер норм, но материал не очень. Точнее он не про то, про что тема доклада. Спикер сходу осуществил подмену понятий и поэтому дальше доклад пошел не туда. В итоге вывод - перерендеры в Реакт опасны и с ними надо бороться - факт!

  • @Pantaiz
    @Pantaiz 7 месяцев назад

    хороший доклад, лайкос

  • @dimenuendo
    @dimenuendo 7 месяцев назад +1

    после слов "...делаю интерфейс в кинопоиске..." вырубил видео 😂
    шучу. вода, конечно, есть, но в целом конструктив.
    очень понятно
    Супер!

  • @apa6368
    @apa6368 7 месяцев назад +1

    Сколько не работай с реактом, придется писать костыли для оптимизации.

  • @CRivlaldo
    @CRivlaldo 6 месяцев назад

    Хороший доклад, хоть и из Яндекса

  • @МасияГусейнов-ъ5е
    @МасияГусейнов-ъ5е 7 месяцев назад

    спасибо, лучшее видео

  • @someChicoRy
    @someChicoRy 6 месяцев назад

    круто

  • @verbs-otier-ru
    @verbs-otier-ru 7 месяцев назад

    Как я выпал со скримера вначала 🤣

  • @fedoskamcha3768
    @fedoskamcha3768 6 месяцев назад

    top

  • @selub1058
    @selub1058 7 месяцев назад

    Что такое Кинопоиск и ШРИ?? И нет, перерендеры не опасны. В отличии от электричества 220 вольт они вас точно не убьют.

  • @osidpgipsoe
    @osidpgipsoe 2 месяца назад

    Очень поверхностно

  • @from_brest2631
    @from_brest2631 7 месяцев назад

    Но с сетером темы странная штука: условный свитч все равно меняет свое состояние в зависимости от темы, и ему тауже нужно иметь вэлью 😊

    • @JerarJerar
      @JerarJerar 7 месяцев назад

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

    • @masterofgame0
      @masterofgame0 7 месяцев назад

      Value будет меняться каждый раз.
      Set всегда один.
      Замечали, когда используете setState внутри useEffect, линтер не говорит, что нужно добавить setState в зависимости.
      setState из useState всегда возвращает одну и туже ссылку

    • @masterofgame0
      @masterofgame0 7 месяцев назад

      ​@@JerarJerar потому что srtState без разницы актуальная ли ссылка на него.
      Как когда используешь setState внутри useEffect, линтер не просит добавить setState в зависимости

    • @SmotritelTube
      @SmotritelTube 7 месяцев назад

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

    • @aleksprimetv
      @aleksprimetv 6 месяцев назад

      @@SmotritelTube спасибо, хоть узнал что это за чел))

  • @sova
    @sova 10 дней назад

    Термин "псевдородитель" тупо на ровном месте выдуман.
    Нигде его до этого не видел и не слышал.
    Хоть кто-то из англоязычных коллег его использовал?

  • @revel8246
    @revel8246 7 месяцев назад +2

    Знать такие подробности о Реакте совершенно не нужно. Это внутренние детали имплементации. У Реакта есть best practices, им надо следовать, и все будет хорошо.

  • @YauhenSkaradumau
    @YauhenSkaradumau 7 месяцев назад +1

    Еще бы перестать говорить перерендеры 🥲

  • @Gsi_l2
    @Gsi_l2 Месяц назад

    Просто выбрать Vue