Максимальный перфоманс с React Signals

แชร์
ฝัง
  • เผยแพร่เมื่อ 24 พ.ย. 2024

ความคิดเห็น • 58

  • @sergeydostovalov6180
    @sergeydostovalov6180 6 ชั่วโมงที่ผ่านมา +12

    После реализации проекта на solidjs нет никакого желания возвращаться на реакт. Не нужно греть голову ререндерами, юсколбеками, юсмемо, мемо - которые ломается, если колбек не мемоизированный передал в пропсах. Всё работает максимально быстро и понятно. Испытываешь ментальный комфорт, когда знаешь, что обновление не вызовет каскадный ререндер всей страницы. Сигналы в том или ином виде уже есть во Вью, и можно вживую убедиться, какая разница в скорости работы приложения на примере Озона (Вью) и Яндекс Маркета (неповоротливый монстр написанный на Реакт).

    • @Zubbol
      @Zubbol 2 ชั่วโมงที่ผ่านมา

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

    • @sergeydostovalov6180
      @sergeydostovalov6180 2 ชั่วโมงที่ผ่านมา +1

      @@Zubbol та же компания, которая разрешит вам использовать сигналы ;)

    • @marcinskavysh8690
      @marcinskavysh8690 2 ชั่วโมงที่ผ่านมา +1

      Дайте угадаю - в резюме это обычно строчка называется фриланс) хахаххаахах

    • @sergeydostovalov6180
      @sergeydostovalov6180 ชั่วโมงที่ผ่านมา

      @@marcinskavysh8690 ну блин, с ребятами, которые пишут фронт, обслуживающий миллионы юзеров в день и минута простоя из-за ошибки стоит сотни миллионов, ищущими информацию о сигналах - тяжело поспорить ;)

  • @AlexanderBorshak
    @AlexanderBorshak 6 ชั่วโมงที่ผ่านมา +2

    Нет Реакта - нет лишних рендеров!
    (Шутка юмора.)

  • @imthebest8000
    @imthebest8000 8 ชั่วโมงที่ผ่านมา +2

    Это, просто, офигенно 👍

  • @alexeysvetlenko2217
    @alexeysvetlenko2217 9 ชั่วโมงที่ผ่านมา +1

    Классно. Спасибо Саша.

    • @it-sin9k
      @it-sin9k  8 ชั่วโมงที่ผ่านมา

      Привет) ты еще смотришь мои видео)) приятно))

  • @ОлегСелин-ш9ы
    @ОлегСелин-ш9ы 5 ชั่วโมงที่ผ่านมา +3

    Мне кажется, что команда react, как бараны, упёрлись в "свой путь".
    В проекте используем реактивный state-менеджер reatom. Возвращаться к разработке на голом react - боже упаси!
    В серверные компоненты и компилятор, как в серебряную пулю - не верю.

  • @allmight8407
    @allmight8407 4 ชั่วโมงที่ผ่านมา +2

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

    • @it-sin9k
      @it-sin9k  3 ชั่วโมงที่ผ่านมา

      должен же быть хоть один островок без реактивщины)

    • @allmight8407
      @allmight8407 3 ชั่วโมงที่ผ่านมา

      @ согласен, но этот «островок» является материком, так как за ним 80% рынка, от чего еще больней 🫣

    • @cdeblog
      @cdeblog 53 วินาทีที่ผ่านมา

      ​@@it-sin9k особенно иронично, что фраемворк без реактивности называется реакт 😂

  • @katana_yaiba
    @katana_yaiba 7 ชั่วโมงที่ผ่านมา +1

    Насчет Vue: Evan писал то ли в гитхабе, то ли в Твиттере. Далее не дословно: "Если сигналы стандартизуют, то у Vue есть большой шанс внедрить их в пакеты реактивности". Сейчас же Vue построен на прокси, что и так довольно удобно и сильно походит на сигналы)

  • @ЕвгенийДжаст-н9й
    @ЕвгенийДжаст-н9й 3 ชั่วโมงที่ผ่านมา +1

    Это лишь подход, который немного противоречит подходу react (вызвать что бы обновить), и теперь имеем 2 подхода, которые нужно будет использовать вместе, так как подход реакт никуда не девается, и сигналами он полностью не заменяется. Тот же RTK или Redux с Immer, это удобно, так как избавляет от больших конструкций со спредами, а сигналы ничего не меняют. Это все плохое влияние вьюшников с их proxy и templates :D

    • @PromiSeDev
      @PromiSeDev ชั่วโมงที่ผ่านมา

      В сигналах, к слову, нет Proxy)

  • @khmilevoi
    @khmilevoi 6 ชั่วโมงที่ผ่านมา +2

    Jotai - 1,1 миллиона скачиваний в неделю.
    Плюс есть пропоузал о добавлении сигналов в ECMAScript.
    Как по мне, реактивность - это будущее и чуть ли не единственно верный способ разработки интерфейсов.

    • @it-sin9k
      @it-sin9k  6 ชั่วโมงที่ผ่านมา +4

      надеюсь все же, что ваше предсказание о реактивном программировании никогда не сбудится)

    • @notimeforhero
      @notimeforhero 3 ชั่วโมงที่ผ่านมา

      @@it-sin9k Это почему?)
      Не вижу особых проблем с реактивном программированием, по необходимости можно всегда выдернуть иммутабельную копию объекта.
      А вот синтаксис удаления элемента из массива в реакте по прежнему выглядит как хтонический ужас, не говоря уж про объекты.

    • @PromiSeDev
      @PromiSeDev ชั่วโมงที่ผ่านมา

      @@notimeforhero У меня был лайфхак на этот счет) Могу скинуть)

  • @rootpown-xc5ds
    @rootpown-xc5ds 8 ชั่วโมงที่ผ่านมา +7

    10:00 - Интересная инфа.

  • @ЕгорЛазука-й1э
    @ЕгорЛазука-й1э 7 ชั่วโมงที่ผ่านมา +2

    Никогда бы не подумал, что увижу vue в react.

    • @ЕвгенийДжаст-н9й
      @ЕвгенийДжаст-н9й 3 ชั่วโมงที่ผ่านมา +2

      Ты увидел лишь проксирование (что в принципе и взято за основу в vue), а не vue в react. Тот же immer уже есть везде, rematch, rtk и его можно легко подключить к сырому redux

  • @Dimazzz_ik
    @Dimazzz_ik 7 ชั่วโมงที่ผ่านมา +3

    На сколько знаю, в планах команды по Angular это полный отказ Zone.js в пользу Signals. И уже проделано очень много работы по этому направлению.
    В том числе и в взаимодействие rxjs и Signals, например, экспериментальный toSignals(observable)

  • @games3194
    @games3194 9 ชั่วโมงที่ผ่านมา

    Интересное видео, но я не пишу на js, а так посмотрел для будущего спасибо)

  • @egoreast
    @egoreast 9 ชั่วโมงที่ผ่านมา +1

    👍

  • @egorovsa
    @egorovsa 9 ชั่วโมงที่ผ่านมา +7

    Все давно было придумано в MobX (как вы упомянули на 5:25), но там было немного другой подход при этом не надо создавать доп ноду value в VDOM.

    • @PromiSeDev
      @PromiSeDev ชั่วโมงที่ผ่านมา

      Доп нода там нужна, чтобы не ререндерить компонент целиком, а менять только места, где используются сигналы. Они создают очень быстрый и легковесный VDOM для отображения value)

  • @salvehn
    @salvehn 6 ชั่วโมงที่ผ่านมา

    былоб интересно попробовать скрестить RJSF с сигналами, при больших формах с кастомными виджетами сигналы должны помочь

    • @PromiSeDev
      @PromiSeDev ชั่วโมงที่ผ่านมา

      Го попробуем)

  • @gerda-morozova
    @gerda-morozova 9 ชั่วโมงที่ผ่านมา +6

    Парни реально придумали Vue 3 в React и назвали это Signals)
    Было время, когда Vue копировал идеи React, но, доводил их до ума. Теперь кажется, будто тенденция идёт наоборот.
    Спасибо за видео!

    • @it-sin9k
      @it-sin9k  9 ชั่วโมงที่ผ่านมา +5

      так это же не React команда копирует, это сообщество же)

    • @gerda-morozova
      @gerda-morozova 9 ชั่วโมงที่ผ่านมา

      @@it-sin9k Да, справедливый тейк. Я некорректно сказал.
      Просто показалось забавным как это всё выглядит

    • @PromiSeDev
      @PromiSeDev ชั่วโมงที่ผ่านมา

      @@gerda-morozova Многие заметили сходство с Vue) Только вот в Vue это появилось позже, чем в Svelte.

  • @Zubbol
    @Zubbol 4 ชั่วโมงที่ผ่านมา

    прекрасная штука) уже год всем про неё рассказываю, но внедрить получилось только в одном проекте, а интереса в итоге ноль

    • @it-sin9k
      @it-sin9k  3 ชั่วโมงที่ผ่านมา

      а что вас заинтересовало больше всего?

    • @Zubbol
      @Zubbol 2 ชั่วโมงที่ผ่านมา

      ​@@it-sin9k Возможность раз и навсегда забыть про повторные рендеры из-за изменения состояния, будь то локальное или внешнее. Без мемо и прочих мемоизаций это выглядит магией) если использовать сигналы хотя бы как альтернативу базовому useState, то уже можно кратно выиграть во всех аспектах уровня производительность/бойлерплейт

    • @PromiSeDev
      @PromiSeDev ชั่วโมงที่ผ่านมา

      Не я один такой, получается)

    • @Zubbol
      @Zubbol ชั่วโมงที่ผ่านมา

      @@it-sin9k в первую очередь то, что даже если использовать сигналы всего лишь вместо дефолтного useState, то рост производительности будет кратным, при этом о различных способах мемоизации(как и говорилось в видео) можно забыть. Показалось непростительным проходить мимо, с учётом таких вводных)

  • @grenadier4702
    @grenadier4702 8 ชั่วโมงที่ผ่านมา +6

    А зачем эта библиотека, если уже давно есть mobx?

    • @a7kerkh
      @a7kerkh 7 ชั่วโมงที่ผ่านมา +1

      отвечаю, люди не смотрят как что устроены и воспринимают что-то хайповое за новое :/

    • @sergeydostovalov6180
      @sergeydostovalov6180 6 ชั่วโมงที่ผ่านมา

      Мобикс - это стейт интерфейса и его можно использовать, в том числе и с сигналами. react-mobx = это просто сахарок, который оборачивает компомнент в memo и подписывается на события обновления стора.

    • @grenadier4702
      @grenadier4702 57 นาทีที่ผ่านมา

      @@sergeydostovalov6180 что значит "стейт интерфейса"? То что сигналы можно использовать с mobx - без вопросов, правда зачем мешанина эта. Мой посыл в том, что mobx отлично заменяет сигналы и обе библиотеки, по сути, выполняют одну и ту же роль: реактивность + точечный ререндер
      const store = observable({
      count: 0,
      setCount(value) { this.count += value }
      })
      VS
      const count = signal(0);
      const setCount = value => count.value = value;
      По сути одно и то же получаем

  • @cdeblog
    @cdeblog 3 นาทีที่ผ่านมา

    Реакт просто куча каких-то костылей и каждый раз накидывают сверху ещё и ещё 🤦😂

  • @dm_din
    @dm_din 9 ชั่วโมงที่ผ่านมา +3

    Пока все нормальные фреймворки переходят на актуальные и эффективные концепции, реактоводы продолжают есть кактус и рискуют оказаться в позиции пользователей JQuery

  • @МаксимСинькевич-в2я
    @МаксимСинькевич-в2я 9 ชั่วโมงที่ผ่านมา +2

    1ый😎

    • @it-sin9k
      @it-sin9k  9 ชั่วโมงที่ผ่านมา +1

      красава!)

  • @rusfungame
    @rusfungame 9 ชั่วโมงที่ผ่านมา +5

    Фронтендеры все оборачивают в memo и думают что что-то оптимизируют. Смешно до жути.

    • @grenadier4702
      @grenadier4702 7 ชั่วโมงที่ผ่านมา +2

      Ну все уж не надо. Зависит от ситуации

    • @oWeRQ666
      @oWeRQ666 6 ชั่วโมงที่ผ่านมา

      ​@@grenadier4702Для хока memo должны совпасть очень многие факторы, в большинстве случаев он не работает, проще меморизировать jsx

    • @notimeforhero
      @notimeforhero 3 ชั่วโมงที่ผ่านมา

      А причём тут вообще memo?)
      В видео о нём речь не идёт, а сигналы работают по другому принципу.
      Это скорее useRef на HTMLElement с подпиской на прокси-объект.

  • @jyjyjyj3
    @jyjyjyj3 9 ชั่วโมงที่ผ่านมา +1

    Я всё больше убеждаюсь, что фреймворк в половине случаев вообще не нужен. React отлично справляется, когда нужно быстро создать простой интерфейс, но как только задачи выходят за рамки верстки и базовых кнопок, начинаются сложности. Например, сравните реализацию бесконечного скролла на чистом JavaScript и в React. Разница очевидна: в случае React приходится преодолевать ограничения виртуального DOM, тогда как с использованием ванильного JavaScript таких проблем нет.
    В этом смысле мне больше всего нравится Svelte, который предоставляет удобный каркас для построения интерфейсов, но при этом активно поощряет использование ванильного кода. Это позволяет добиться лучшего баланса между удобством разработки и контролем над кодом

    • @notimeforhero
      @notimeforhero 3 ชั่วโมงที่ผ่านมา

      Зато в оставшейся половине случаев в случае экспоненциального роста проекта получаешь монстра, которого очень тяжело поддерживать, а тем более пилить новые фичи. В итоге получается что лучше взять заранее полновесный фреймворк и перестраховаться, нежели переписывать всё при внезапном росте приложения.
      Имел, к сожалению, печальный опыт поддержки проектов на ванилле, а также написание велосипедов для Preact (вроде SSR или Swiper) вместо использования готового NextJS.

    • @guihalin8685
      @guihalin8685 ชั่วโมงที่ผ่านมา

      @@notimeforhero В общем, как обычно: есть два стула, а дальше сами знаете...