repcolding

Следы на экране мака остаются когда клавиатура грязная.
Лично у меня он чистый почти всегда, но для меня это принципиально.
Видел достаточно таких владельцев маков у кого экран в выключенном виде в пятнах/разводах.
Достаточно не есть за рабочим столом (дома тоже, для этого есть кухня) и протирать периодически родной тряпочкой или аналогичной от другого производителя (для оптики тоже подходит - для очков которая).
Как вариант погуглить: wai ora салфетка

Клаву и корпус можно протирать раствором спирта, главное чтобы он с тряпки не стекал.

Чтобы очистить трудно удаляемые пятна или отпечатки пальцев на дисплее или внешней стороне компьютера Mac, можно аккуратно протереть дисплей или корпус ноутбука Mac тканью, смоченной 70-процентным раствором изопропилового спирта (IPA).

Источник

Класть что либо (особенно тряпку) между клавой и дисплеем очень плохая идея, apple не рекомендует заклеивать камеру наклейками или стикерами (есть любители это делать) а тут целая тряпочка.
Кстати эта прокладка которая в коробке с маком идет, очень похожа на кальку ))

array.reduce((acc,c,i,arr) => {
  if ((i & 1) === 0) acc.push([]);
  acc[acc.length - 1].push(c);
  return acc;
}, [])

const boxScroll = document.querySelector('.box__list_scroll');
const boxImgs = document.querySelectorAll('.box__imgs > .box__img');

boxScroll.addEventListener('scroll', event => {
  const sh = event.target.scrollHeight;
  const h = event.target.offsetHeight;
  const y = event.target.scrollTop;
  const len = boxImgs.length;
  const t = y / (sh - h);
  const index = Math.floor((len - 1) * t);
  boxImgs.forEach((img, i) => img.classList.toggle('__active', i === index));
});

Перечитай как правильно использовать БЭМ и не растягивай больше так кошек!

Очень странный вопрос.
144hz, 60hz - это способность монитора обновлять картинку (сколько раз за секнуду).
FPS - это сколько кадров успела подготовить видеокарта.

144FPS на мониторе 60hz вы не увидите.
60FPS на мониторе 144hz будут точно такие же, как и на мониторе 60Hz.

//Перед обновление стейта сохраняешь текущую версию
const oldState = { ...state }
//Обновляешь стейт
setState({ foo: 'bar' });

//Этот код нужно выполнять в юзефект с депсами стейта
//Это массив измененных свойств 
const changedProperties = {};
for (const key in state) {
  if (state.hasOwnProperty(key) && oldState[key] !== state[key]) {
    changedProperties[key] = state[key];
  }
}

//Проверяем если были обновления и отправляем
if (Object.keys(changedProperties).length > 0) {
  fetch('/endpoint', {
    method: 'POST',
    body: JSON.stringify(changedProperties),
    headers: {
      'Content-Type': 'application/json'
    }
  }).then((response) => {
    if (response) {
      console.log('Данные успешно обновлены на сервере');
    } else {
      console.log('Не удалось обновить данные на сервере');
      // В случае ошибки апдейтп можно откатить  стейт
      setState(oldState);
  });
}

По коду сам смотри куда тебе проще запихнуть

Вот так нужно, не надо говно-кодить какую-то коммуникацию между редуксом и стейтами реакта

Какой самый правильный выход?

Пагинация

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

Сделать как он хочет и пусть попробует пользоваться

https://reactcommunity.org/react-transition-group/

Простая библиотека переходов, легко сочетаемая с css анимацией.
В частности, хорошо подойдет для твоего кейса с модалкой: тут как раз 4 пункта - монтирование, анимация до видимого состояния, анимация до невидимого состояния, размонтирование.

grid/flex + gap