Вы должны передать весь объект как единственную опору или разделить его на более мелкие части?

Question

Предположим, у меня есть компонент, который отвечает за отображение элемента временной шкалы, содержащего различные данные (идентификатор, метка, тип, метка времени и т. Д. c). Когда придет рендеринг этого компонента, какой стандарт для реквизита? Прохожу ли я через объект timelineItem как опору и деконструирую его внутри компонента?

Например,

({ timelineItem }) => {
  const { id, label, timestamp, type } = timelineItem;

  return ...
};

// Render
<TimelineItem timelineItem={timelineItemObject} />

Или, в качестве альтернативы, рекомендуется разделять объект вне этого компонента? Например,

({ id, label, timestamp, type }) => {
  return ...
};

// Render
<TimelineItem id={id} label={label} timestamp={timestamp} type={type} />

Я полагаю, что при разделении реквизита на более мелкие куски может быть полезен выигрыш в производительности, чтобы React мог лучше выполнять различий в проп, однако приведу мой код ниже. У меня есть два компонента, которые получают в основном одинаковые реквизиты (поскольку группа в основном отвечает только за отображение фрагментов элементов временной шкалы), и я не уверен, какую структуру использовать для удобства чтения / сопровождения

Спасибо за любой совет!

Answer 1

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

Answer 2

Дифференциал diff выполняется по значению примитивных типов (число, строка, логическое значение) и по ссылке на объекты. Таким образом, передача объекта в качестве реквизита происходит быстрее, чем передача всех свойств этого объекта