Почему я не использую хук useReducer? | React Hooks

Поділитися
Вставка
  • Опубліковано 28 лис 2024

КОМЕНТАРІ • 39

  • @роматарасов-о8л
    @роматарасов-о8л Рік тому +10

    Аюб, ты освящаешь очень много жизненных проблем в React, формат мне очень нравится, продолжай!!!

  • @deantek
    @deantek Рік тому +2

    на моей памяти использовал useReducer раза 2 за 2 года работы, очень понравилось видео, спасибо

  • @nafanya3733
    @nafanya3733 Рік тому +1

    спасибо большое, очень полезную инфу освещаешь)

  • @2difficult2do
    @2difficult2do Рік тому +1

    Лайк, посмотрел, хорошее и подробное разъяснение. 👍

  • @МарияЧерешня-у2й

    Полный вперёд! 🎉

  • @harrisonwinston2850
    @harrisonwinston2850 Рік тому +7

    Привет, хотел бы от тебя увидеть видео про веб-сокеты, тема не особо популярная, но лично мне интересна.
    Спасибо.

  • @mercury_2379
    @mercury_2379 Рік тому +1

    комментарий в поддержку канала

  • @artyomtaranenko2267
    @artyomtaranenko2267 Рік тому +3

    Было бы не плохо рассказать фишки (как было в одном твоём видосе про собес), где и как правильно юзать мемоизацию. Я, честно сказать, сам порой теряюсь где надо и нет, поэтому сначала пишу код без неё, если где-то прям очевидно вылазит, то добавляю

  • @dr.livesey5157
    @dr.livesey5157 Рік тому +1

    Лучший

  • @rudinandrey
    @rudinandrey Рік тому +3

    тема интересная ) но как же ты разгоняешься именно в разговоре, про пример undo/redo рассказывал с нормальной скоростью, потом к useReducer перешел и тра татататата ) как автомат. прикольно выглядит просто.Не в укор, понимаю что информации много и хочется уложить в минимальное время. просто особенность заметил ;) инфа полезная очень, спасибо.

  • @роматарасов-о8л
    @роматарасов-о8л Рік тому +2

    очень часто встречаюсь с проблемами из видео
    было очень интересно посмотреть как useReducer/useMethods их решает
    (
    я в таких случаях просто использовал стейт менеджер(mobx)
    но если состояние с которым мы хотим работать локальное(каждый инстанс этого компонента имеет свой личный стейт)
    приходится использовать костыльный хук который создаёт инстанс mobx-стора при маунте компонента
    такой костыль я мог позволить себе поскольку я был 1 в команде и у меня был mobx
    сейчас когда у меня редакс и команда перед которой надо объяснять каждый костыль
    альтернативные способы становятся ещё актуальнее...
    )

    • @ayub_begimkulov
      @ayub_begimkulov  Рік тому

      Ну, если в проект везде mobx, то можно и к такому решению прийти. Главное, чтобы везде консистентность была.

  • @magnific8930
    @magnific8930 Рік тому +1

    👍👍👍

  • @СергейГолованов-й7я

    мб расскажешь про нюансы и случаи использования useEffect, а то в новой доке реакта рекомендуют не злоупотреблять этим хуком

  • @malsagov6331
    @malsagov6331 Рік тому +1

    👍👍👍👍

  • @hrustalevdev
    @hrustalevdev Місяць тому

    Аюб, привет. Какой смысл завязываться на useReducer, если то же самое можено сделать вокруг useState?
    ```ts
    import { produce } from 'immer';
    import { useMemo, useRef, useState } from 'react';
    type WithoutFirstParam =
    Params extends readonly [unknown, ...infer Rest] ? Rest : [];
    type AnyAction = { type: string; payload?: any };
    type Method = (state: S, payload?: any) => void;
    type BoundMethod = (...args: WithoutFirstParam) => void;
    type MethodsMap = Record;
    type BoundMethodsMap = { [K in keyof M]: BoundMethod };
    type Options = { initialState: S; methods: M };
    type VariantOptions = Options | (() => Options);
    export function useModel(options: VariantOptions): [S, BoundMethodsMap] {
    const initialOptions = useRef(typeof options === 'function' ? options() : options).current;
    // Используем useState вместо useReducer
    const [state, setState] = useState(initialOptions.initialState);
    const methods = useMemo(
    () =>
    Object.keys(initialOptions.methods).reduce(
    (_methods, methodName) => {
    _methods[methodName] = (payload?: unknown) => {
    setState(prevState =>
    produce(prevState, (draft: S) => initialOptions.methods[methodName](draft, payload))
    );
    };
    return _methods;
    },
    {} as Record,
    ),
    [initialOptions],
    );
    return [state, methods as BoundMethodsMap];
    }
    ```

  • @romandeveloper7720
    @romandeveloper7720 Рік тому

    Не совсем понял, как можно useEvent'ом решить проблему во втором примере? Можешь показать, пожалуйста?

    • @ayub_begimkulov
      @ayub_begimkulov  Рік тому

      Просто завернуть колбэк в хук useEvent, и все) Я подробнее о нем рассказываю в отдельном видео - можешь посмотреть.

    • @romandeveloper7720
      @romandeveloper7720 Рік тому

      @@ayub_begimkulov , ах, точно, тупанул)

  • @oWeRQ666
    @oWeRQ666 Рік тому

    14:06 как получить такие комментарии с выводом типа?

  • @oWeRQ666
    @oWeRQ666 Рік тому

    Пример с undo как-то слишком притянут за уши, если состояние нельзя описать одним значением - значит надо их объединить и хранить в одном стейте, и уже это решение сравнивать с редьюсером, вообще добавление редьюсера в ядро реакта вызывает вопросы, можно же и через стейт использовать редьюсер dispatch = action => setState(state => reducer(state, action))

    • @ayub_begimkulov
      @ayub_begimkulov  Рік тому

      Хммм, а как ты считаешь надо это все писать? Да, хук useReducer - заменяем, я как-то писал про это пост в ТГ.
      Но у него по мимо объединения стейта есть и другая фича - это то, что сам редьюсер не надо мемоизировать и dispatch имеет всегда одну и ту же ссылку. Уже с такими условиями его реализовать было бы чуть сложнее, чем ты показываешь)
      Касательно сравнения тоже не согласен, никто не пишет несколько стейтов в один объект просто так. Обычно если так и делают, то только из-за неудобство хука useReducer.

    • @oWeRQ666
      @oWeRQ666 Рік тому

      ​@@ayub_begimkulov обернуть dispatch в useCallback, редьюсер - чистая функция, не вижу ни одной причины ее заносить в компонент, опять же это решаемо и всегда можно сделать кастомный хук, вопрос в том нафига это в ядре, где код хуков мягко говоря запутанный, имхо, в ядре должны быть только базовые.

  • @albertrain7093
    @albertrain7093 Рік тому +1

    я узнал что-то новое. я не знаю реакт )))

  • @МихаилВолков-й6м

    не могу понять, зачем столько лепить useCallback() и useMemo()? Неужели они здесь оправданы?

    • @ayub_begimkulov
      @ayub_begimkulov  Рік тому +1

      А можешь раскрыть мысль? Где именно?
      Тут просто есть особенность в том, что большинство примеров в данном видео - переиспользуемые хуки. И ты не знаешь, где они будут использоваться. Поэтому нужно все мемоизировать.

  • @АлександрКос-р3щ
    @АлександрКос-р3щ 5 днів тому

    тараторщик, блин

  • @jamjam3337
    @jamjam3337 Рік тому +1

    👏👍