Алексей

Для фильтрации массива объектов по какому либо значению свойства лучше всего использовать метод filter. Изучите как с ним работать и сделаете все быстро и красиво.

Используйте относительные единицы измерения в стилях, например rem.

Если производительность архивации упирается в процессор, то рекомендую архиватор pigz, он умеет использовать все ядра процессора.

Кеш npm чистили?
npm cache clear

Если absolute применить то он уедет, без скриптов можно так сделать?

Можно поднять его, изменив z-index, тогда не должно уехать. Ну и тень сделать box-shadow, это создаст иллюзию того что блок выше всего контента. Без JS можно обойтись.

Можно так, будет всегда по середине по вертикали

.button {
  position: fixed;
  top: 0;
  bottom: 0;
}

Для этого в CSS существуют медиазапросы. Научитесь их использовать и сможете решить свою проблему. И javascript тут не причем.

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

Чтобы сработала анимация transition, нужно чтобы чтобы было какое-либо изменение состояния. Т.е. должен быть либо :hover, либо динамически должен добавлятся модификатор основного стиля, тогда произойдет плавная модификация. Пример:

.example {
  background: green;
  height: 100px;
  transition: all 1s linear;
  width: 100px;
}

.example:hover {
  background: red;
  height: 200px;
  width: 200px;
}

Вариантов куча, что конкретно нужно и при каких разрешениях?

Еще есть heroku

Возьмите мою сборку ну или посмотрите как устроено и соберите свою на ее основе. И звездочку не забудьте поставить мне на гитхабе )). Собрал на основе webpack/pug/stylus/babel/autoprefixer, в общем все на острие технологий.

Какой стиль у user__text?

Можно сверстать прямо, затем повернуть внутри body, при помощи transform: rotate(n deg) на нужный угол а градиент наложить сверху через псевдоэлемент after

Полосы прокрутки очень плохо кастомизируются. В разных браузерах они будут выглядеть по разному. Нужно использовать виртуальные скролбары. К сожалению без js тут не обойтись