Публикации по теме 'reselect'
Погружаемся в глубины с Memoization и Redux Reselect.
В этой статье мы узнаем, что такое мемоизация и как она была реализована внутри Redux Reselect.
Что такое мемоизация?
Мемоизация — это метод ускорения работы приложений за счет кэширования результатов ресурсоемких операций внутри функций и возврата кэшированных результатов с теми же входными данными, которые использовались повторно.
Как мы можем реализовать это с помощью VanillaJs и es5:
interface MemoizedFunction extends Function {
(param: any): any;
cache: {
[key: string]:..
В чем преимущество использования Reselect с Redux и React?
В чем преимущество использования Reselect с Redux и React?
Каждый раз, когда мы изменяем глобальное состояние, хранящееся в Redux, все компоненты, использующие состояния, будут перерисовываться. Это большая проблема для производительности приложения React. Другими словами, мы хотим, чтобы наши компоненты перерисовывались только тогда, когда мы изменяем состояние, которое непосредственно связано с ними.
Существует удобная библиотека, которая является точным решением этой проблемы...
Reselect: улучшите свою игру Redux с помощью селекторов
Вы находите свой componentWillReceiveProps наполненным логикой? Вы знаете, что это не очень хорошо, но не знаете, где еще реагировать на изменения в реквизите? Знакомо это:
componentWillReceiveProps (newProps) {
const coolProp = newProps.coolProp;
const coolPropChanged = coolProp !== this.props. coolProp ;
const otherProp = newProps.coolProp;
const otherPropChanged = otherProp !== this.props. otherProp ;
// Set state when these props change, to know when to..
Создание эффективных селекторов повторного выбора
Почему они могут выполнять вычисления чаще, чем предполагалось, и некоторые передовые методы управления более сложными сценариями
Reselect - ключевой компонент любой архитектуры, использующей шаблон Redux. Он играет большую роль в доставке нужных данных каждому компоненту, а также помогает информировать React о том, когда нужно выполнить повторный рендеринг. Поэтому очень важно, чтобы селекторы были эффективными, они пересчитывали только те действия, которые производят новый результат...
Следует избегать использования `toJS` в Immutable.js
За последние несколько лет, работая над интерфейсной разработкой программного обеспечения, я заметил несколько антишаблонов, которые могут быть вредными для приложений, и их трудно отменить. Это третья статья из серии самоуверенных сообщений об антипаттернах фронтенда, которых следует избегать. Вы можете прочитать предыдущую статью здесь .
Фон
Чтобы понять этот антипаттерн, нужно понять, как ссылки на объекты работают в JavaScript. Рассмотрим этот фрагмент кода:
const a = {..
Вопросы по теме 'reselect'
React Redux — условный селектор
В моем приложении у меня есть много частей состояния, которые имеют значение только тогда, когда пользователь вошел в систему.
Когда пользователь входит в систему и переходит непосредственно на страницу, маршрутизатор отображает страницу, но должен...
2547 просмотров
schedule
18.01.2023
Доступ к состоянию маршрутизатора реакции в селекторе
Я перемещаю часть состояния своего приложения из магазина в URL-адрес.
В настоящее время я использую redux для управления состоянием своего приложения вместе с повторным выделением для создания селекторов. Селекторы вычисляют производные...
3945 просмотров
schedule
20.09.2022
Есть ли место для ООП в редуксе?
Я использую методы объектно-ориентированного программирования в течение 25 лет и пытаюсь перейти к функциональному программированию в течение последних 5 лет, но я всегда думаю об ООП, когда пытаюсь сделать что-то сложное и, особенно сейчас, когда ES6...
4886 просмотров
schedule
05.01.2023
Назначьте правильные типы для функции Reselect createSelector
Изменить: добавлен отрывок package.json
Я пытаюсь внедрить машинописный текст в существующий проект React и столкнулся с трудностями при работе с библиотекой Reselect . Компилятор машинописного текста настаивает на импорте первого определения...
8397 просмотров
schedule
15.08.2022
Почему в этом примере с @ngrx необходим повторный выбор createSelector?
Что делает следующий фрагмент кода? Он взят из этого файла .
export const getCollectionLoading = createSelector(getCollectionState, fromCollection.getLoading);
fromCollection.getLoading имеет только значение true или false , поэтому...
3967 просмотров
schedule
13.07.2023
Как я могу создать селектор редукции для состояния, которого еще не существует
Я нахожу способ обойти эхосистему Redux и столкнулся со следующей ситуацией: предположим, у меня есть компонент React, который должен быть подключен к части состояния redux с помощью селектора, но эта часть еще не существует (не определено). Итак,...
689 просмотров
schedule
23.06.2022
Будет ли компонент перерисовываться, если селекторы изменятся в третий раз?
Для этого кода выбора:
import { createSelector } from 'reselect'
import { FilterTypes } from '../constants'
export const selectFilterTodos = createSelector(
[getTodos, getFilters],
(todos, filters) => {
switch(filters) {
case...
38 просмотров
schedule
16.10.2022
Форма Redux: измените другое поле, если проверка прошла успешно
Я использую React Redux, Redux-форму и библиотеку повторного выбора ( https://github.com/reactjs/reselect ).
У меня есть компонент с двумя полями: quota и amount . Я хочу обновить поле amount на основе поля quota . Для расчета amount я...
1499 просмотров
schedule
29.04.2024
Как использовать редукционную форму с повторным выбором
Я хочу использовать повторный выбор с избыточной формой, чтобы получить значение из избыточности. проблема в том, что я не знаю, как совместить getFormValues с повторным выбором. кажется, я не могу получить доступ к состоянию в createSelector....
1853 просмотров
schedule
17.11.2022
Выберите взаимозависимые данные в хранилище избыточности с повторным выбором createSelector
Итак, я использую redux и reselect инструмент createSelector для запоминания моих селекторов в mapStateToProps , и это здорово.
Теперь у меня есть нормализованные данные в моем хранилище и контейнер, которому нужны взаимозависимые данные из...
312 просмотров
schedule
13.11.2022
React / Redux / Reselect - mapStateToProps перестает срабатывать даже после просмотра изменений, отраженных в редукторе.
Я искал аналогичную проблему, но не смог найти подходящего сообщения (... хотя у меня есть подозрение, что этот вопрос задавался раньше), поэтому заранее приношу свои извинения.
Я использую Redux с React в нескольких проектах и только начал...
141 просмотров
schedule
28.08.2022
Изменена ссылка на состояние избыточности при ручном обновлении состояния избыточности.
У меня есть проект React/Redux , в котором я использую Web Worker для расчета следующего состояния при отправке действия, а затем передаю новое состояние непосредственно в хранилище. , нравится:
let nextReducer = reducer => {
return...
650 просмотров
schedule
24.11.2023
Как интегрировать Reselect в мое приложение React + Redux?
Я внедряю приложение React + Redux и испытываю трудности с интеграцией Reselect в свое приложение;
Ниже мои коды
store.js
import "regenerator-runtime/runtime";
import { createStore, applyMiddleware } from 'redux';
import...
232 просмотров
schedule
29.09.2022
Модульные тесты для селекторов редукции
Пожалуйста, предложите мне, как написать модульные тесты для приведенного ниже файла selector.js в реакции
import {createStructuredSelector, createSelector} from 'reselect'
import {List, OrderedMap, fromJS, Map} from 'immutable'
const kpi_graphs...
577 просмотров
schedule
30.12.2023
Как работает reselect createStructuredSelector в Typescript?
Я пытаюсь понять, как метод повторного выбора createStructuredSelector работает в Typescript. Я часто вижу эту схему:
export interface SomeProps {
readonly property1: string;
readonly property2: boolean;
readonly property3: number;
}...
4718 просмотров
schedule
27.06.2023
Запоминающийся селектор с вычислением в @ngrx/store
Мой нормализованный магазин ngrx выглядит так:
export interface State {
carts: EntityState<Cart>;
items: EntityState<Item>;
}
export interface Cart {
id: number;
maxVolume: number;
}
export interface Item {
id:...
2400 просмотров
schedule
20.10.2023
Вызов комбинированного селектора повторного выбора из redux-saga
Я пытаюсь вызвать комбинированный селектор из redux-saga . По идее, у меня есть два выпадающих списка. Варианты в первом раскрывающемся списке будут отфильтровывать соответствующие значения во втором раскрывающемся списке, т.е. мой комбинированный...
2511 просмотров
schedule
15.05.2022
Как предотвратить повторный рендеринг компонента при использовании redux/reselect?
Я получаю частые обновления своего состояния, что вызывает нежелательную повторную визуализацию в компонентах, которые не имеют доступа к изменяющимся свойствам состояния.
Компоненты A и B создаются одинаково, компонент A имеет ключи значений...
1688 просмотров
schedule
11.08.2023
Понимание повторного выбора в редуксе
Я просматривал статью Дэна Паркера на Medium о повторном выборе нпм модуль.
В разделе предварительного этапа своего кода он привел этот пример (с комментариями)
import { createSelector } from 'reselect'
// I am a generic selector, I need no...
417 просмотров
schedule
02.08.2022
reselect: передать несколько параметров составному селектору
Я создал селектор, состоящий из двух других селекторов:
export const getAvailableFilters = createSelector(
getOpenedFilterMenu,
isSaleCategory,
(filterMenu, isSale) => {
// .... doing stuff
},
);
getOpenedFilterMenu , а также...
1317 просмотров
schedule
29.04.2023