Что если Вам не нужен Redux?

Перевод статьи “You Might Not Need Redux” от Dan Abramov.

Зачастую разработчики выбирают Redux для своих проектов еще до того момента как понимают, что он им действительно нужен. Основной аргумент, который можно услышать от них, это -“Что если наш проект будет немасштабируемым если не внедрить его сразу?”. Это звучит вполне резонно, но за тем наступает момент, когда ты хмуро смотришь на свой код и недоумеваешь, почему же тебе для того, чтобы сделать простую вещь рабочей нужно делать изменения в трех файлах?

Разумеется, разработчики сразу начинают винить Redux, React, все функциональное программирование и много других вещей в своем горе и я вполне их понимаю. Довольно естественно сравнивать Redux с подходом, не требующим шаблонного кода для обновления состояния, и убедиться что Redux только лишь чересчур замороченный. В некотором роде, это так и есть.

Redux предлагает вам компромисс. Он спрашивает с вас:

  • Описывать состояние приложения в виде объектов и массивов
  • Описывать изменения в состоянии как объекты
  • Описывать механику обработчиков изменения в виде чистых функций

Ни одно из этих ограничений не требуется для того, чтобы создать полноценное приложение, на ReactJS или без него. На самом деле, это довольно серьезные ограничения и вы должны серьезно обдумать прежде чем добавлять Redux в свое приложение.

Какие положительные аргументы могут реабилитировать Redux?

Все вышеперечисленные ограничения тем не менее помогают строить приложения которые:

Если Вы работаете над расширяемым терминалом, отладчиком JavaScript или над любыми другими веб-приложениями, вы могли бы хотя-бы попробовать, или по крайней мере перенять некоторые идеи.

Однако, если вы только изучаете React, не делайте Redux вашим первым выбором.

Вместо этого, учитесь думать архитектурой React. Вернитесь к Redux, когда почувствуете большую необходимость в нем, или, если вы хотите попробовать что-то новое. Но обращайтесь с ним с осторожностью, также как и с любым другим “самоуверенным” инструментом.

Если вы чувствуете себя подавленным от осознания того факта, что вам предстоит программировать согласно “The Redux way”, это может быть знак что вы или ваши коллеги воспринимают это слишком серьезно. В конце концов, это всего лишь такой же инструмент в вашем органайзере как и все другие.

Ну и в конце-концов, не забывайте что Вы можете принять идеи из Redux не используя его самого. Например, рассмотрите React-компонент с локальным state:

import React, { Component } from 'react';

class Counter extends Component {
state = { value: 0 };

increment = () => {
this.setState(prevState => ({
value: prevState.value + 1
}));
};

decrement = () => {
this.setState(prevState => ({
value: prevState.value - 1
}));
};

render() {
return (
<div>
{this.state.value}
<button onClick={this.increment}>+</button>
<button onClick={this.decrement}>-</button>
</div>
)
}
}

Это выглядит неплохо, когда не имеет ничего лишнего.

Еще раз: использование локального state — это нормально!

Компромисс, который предлагает Redux — это построение более гибкой архитектуры приложения, но взамен получение меньшей очевидности и наглядности происходящего.

import React, { Component } from 'react';

const counter = (state = { value: 0 }, action) => {
switch (action.type) {
case 'INCREMENT':
return { value: state.value + 1 };
case 'DECREMENT':
return { value: state.value - 1 };
default:
return state;
}
}

class Counter extends Component {
state = counter(undefined, {});

dispatch(action) {
this.setState(prevState => counter(prevState, action));
}

increment = () => {
this.dispatch({ type: 'INCREMENT' });
};

decrement = () => {
this.dispatch({ type: 'DECREMENT' });
};

render() {
return (
<div>
{this.state.value}
<button onClick={this.increment}>+</button>
<button onClick={this.decrement}>-</button>
</div>
)
}
}

Обязаны ли вы делать это с вашими “смарт” компонентами? Очевидно, что нет, до тех пор пока у вас нет конкретно намеченного плана и цели как получить выгоду с этой дополнительно внесенной путаницы. А иметь план в наше время — ключевой🔑 фактор успеха.

Библиотека Redux сама по себе — это лишь библиотека, позволяющая содержать состояние в одном месте. Вы можете использовать это в большей или меньшей мере.

Но если вам приходится для этого жертвовать чем-то, то убедитесь что вы получите от этого что-то взамен.

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.