HMR(используя в примере c HotModuleReplacementPlugin и swc-loader) при изменениях в компонентах на странице с veiw model(VM), будет подменяться с сохранением стейта VM и сохранением стейта для всех инстансов зависимостей.
При изменении непосредственно во VM пересоздастся ее инстанс, стейт сбросится. Во всех инстансах зависимостей, которая использует VM, стейт сохранится.
Что касается самого ВКонтакте HMR еще не очень хорошо работает, по причинам не связанным с DI, если интересно есть доклад на holyjs на эту тему https://youtu.be/iuOlKwhiSII?si=sfwXNrwppCfnd3bM
Да, реализация для DI библиотек с мультиконтеризацией в принципи похожая, в текущем примере при переходе между страницами все инстансы зависимостей удаляются, кроме инстансов зависимостей которые имеют @singleton декоратор
Спасибо за комментарий, useCallback и useMemo(немного поправил получение фильтра) здесь нужны, для того чтобы при каждом ререндере возвращать мемоизированные значения. Иначе, все дочерние компоненты, которые будут их получать в качестве пропсов, будут ререндериться каждый раз. Идея добавление useCallback, как раз была именно в том, чтобы исключить рередер дочерних компонентов. В случае передачи функций таким способом, как вы предложили, действительно будет создаваться каждый раз новая функция, но зачем так делать. Если если нужна оптимизация, то лучше передавать одну и туже ссылку на функцию, путем импортирования например из вне React компонента или мемоизируя ссылку внутри компонента.
@habrjeka Спасибо за комментарии, как написано в конце статьи, действительно, данную проблему производительности можно решить путем вынесением поля ввода вместе с его state в отдельный компонент или тем методом который был предложен выше в комментарии. Моя идея была все таки не предложить идеальное решение этой задачи, а показать как можно было бы ее решить при помощи useCallback
HMR(используя в примере c HotModuleReplacementPlugin и swc-loader) при изменениях в компонентах на странице с veiw model(VM), будет подменяться с сохранением стейта VM и сохранением стейта для всех инстансов зависимостей.
При изменении непосредственно во VM пересоздастся ее инстанс, стейт сбросится. Во всех инстансах зависимостей, которая использует VM, стейт сохранится.
Что касается самого ВКонтакте HMR еще не очень хорошо работает, по причинам не связанным с DI, если интересно есть доклад на holyjs на эту тему https://youtu.be/iuOlKwhiSII?si=sfwXNrwppCfnd3bM
Да, реализация для DI библиотек с мультиконтеризацией в принципи похожая, в текущем примере при переходе между страницами все инстансы зависимостей удаляются, кроме инстансов зависимостей которые имеют @singleton декоратор
Спасибо за комментарий, useCallback и useMemo(немного поправил получение фильтра) здесь нужны, для того чтобы при каждом ререндере возвращать мемоизированные значения. Иначе, все дочерние компоненты, которые будут их получать в качестве пропсов, будут ререндериться каждый раз. Идея добавление useCallback, как раз была именно в том, чтобы исключить рередер дочерних компонентов. В случае передачи функций таким способом, как вы предложили, действительно будет создаваться каждый раз новая функция, но зачем так делать. Если если нужна оптимизация, то лучше передавать одну и туже ссылку на функцию, путем импортирования например из вне React компонента или мемоизируя ссылку внутри компонента.
Спасибо за замечание, поправлю в статье вычисление filter
Может лучше будет замемоизировать filter и setSearchQuery, подумаю над вариантом
Спасибо за замечание, пожалуй с вами соглашусь, поправлю
@habrjeka Спасибо за комментарии, как написано в конце статьи, действительно, данную проблему производительности можно решить путем вынесением поля ввода вместе с его state в отдельный компонент или тем методом который был предложен выше в комментарии. Моя идея была все таки не предложить идеальное решение этой задачи, а показать как можно было бы ее решить при помощи useCallback
@romanere Спасибо за внимательность, поправил переменные