Макс Лапшин (levgem) wrote,
Макс Лапшин
levgem

Category:

Куда переносить сложность?

У меня с коллегой вышел спор. Мы сейчас переделываем систему редактирования конфига потока и мы разошлись во мнениях о том, как именно поступить.

Ситуация такая: редактор оформлен в виде вложенных компонент Reactjs: Stream -> StreamOutput -> StreamOutputProtocols, есть даже 4-й уровень. Верхний компонент держит кучу данных, вниз спускает данные и коллбек на их изменение. Никаких рефлюксов и прочих венерических заболеваний у нас нет.



В верхнем компоненте хранятся следующие данные:
savedConfig (с которым запустились)
unsavedConfig (то, что наредактировал пользователь)
newServerConfig (то, что приехало с сервера в процессе редактирования)
globalConfig (глобальные данные, которые аффектят сам стрим)
streamRuntimeStats (актуальные данные по работающему стриму)


Вопрос в том, как спускать их вниз к контролам. Мой коллега начал с того, что спустил все 5 данных в раздельных пропсах и там их внизу мерджил:


<StreamOutputProtocols 
  savedConfig={this.state.savedConfig} 
  unsavedConfig={this.state.unsavedConfig} 
  newServerConfig={this.state.newServerConfig} 
  globalConfig={this.state.globalConfig} 
  streamRuntimeStats={this.state.streamRuntimeStats} 
  change={this.changeSetting}/>


Так в контроле внизу он смотрит на поле в unsavedConfig и если оно отличается от такого же поля в savedConfig, то подсвечивает. Так же, реагирует на наличие данных в globalConfig или stats (показать текущий урл или текущее количество сессий)

Я предложил склеивать все данные в один объект. Например, в конфиге есть поле max_sessions.

Мы склеиваем всё в один объект, в котором есть поля max_sessions (актуальное редактируемое значение), флаг max_sessions_changed и старое значение max_sessions_old. С этим коллега худо бедно согласился, но я пошел дальше и решил вмержить туда же поле current_sessions и global_max_sessions

Т.е. получается объект, в котором:

max_sessions, // это можем редактировать
max_sessions_changed, // вычислилось
max_sessions_old, // старое значение
current_sessions, // актуальное значение из рантайма
global_max_sessions, // конфиг, но здесь не отредактировать



В итоге с моим вариантом контрол сокращается до:


<StreamOutputProtocols 
  stream={this.state.stream} 
  change={this.changeSetting}/>


Я считаю, что всё равно нам надо мержить данные: или сверху, или уже в контроле, когда мы сравниваем данные из разных источников, а поэтому проще получается смержить сверху.

Коллега считает, что тут рождается бардак и лучше таскать лишние 2-3 пропса, чем создавать объект, в котором какие-то поля меняются, какие-то вычисляются.

Что скажете?
Tags: javascript, react
Subscribe
  • Post a new comment

    Error

    Anonymous comments are disabled in this journal

    default userpic

    Your reply will be screened

    Your IP address will be recorded 

  • 10 comments