DarthJS

DarthJS, В любом случае у редьюсеров будут свои наименования в стейте. Если в action.data приходит объект такого вида { cats: [], dogs: [], ... }, то я бы так сделал.

const initialState = {
  cats: [],
  dogs: [],
  hozyiny: []
}

const reducer = (state = initialState, action) => {
  switch(action.type) {
    case LOAD_ALL_DATA: {
      const { cats, dogs, hozyiny } = action.data;
      return Object.assign({}, state, { cats, dogs, hozyiny })
    }
    default:
      return state
  }
}

Я сам linux-админ, и пользуюсь Ubuntu с 2007 года. Но пару недель назад перешел на MacOS. Могу сразу сказать - сам макбук, его приятно держать в руках, на коленях, он даже приятнее на ощупь. Получаешь некоторое удовольствие от пользования такой вещью, и при этом она не отвлекает. Все пластиковые ноуты кажутся какой-то доской по сравнению с макбуком. Операционка приятная в поведении, но к ней я привыкал дня 4. Это то, что касается GUI.

Консоль в макоси я не кастомизировал, только поставил fish и brew, но мне в ней не хватает многого, стандартных утилит GNU Coreutils, я понимаю, это все можно поставить, настроить, кастомизировать, но первое впечатление от работы с консолью - неприятные.

Вообще конечно, обе руки "за" макбук, и выбирать нечего.

function Parallel(settings) {
  this.parallelJobs = settings.parallelJobs;
  this.results;
  this.tasks = [];
  this.onDone;
  this.index = 0;
  this.activeJobs = 0;
};

Parallel.prototype.start = function() {
  this.results = Array(this.tasks.length);

  for (var i = 0; i < Math.min(this.parallelJobs, this.tasks.length); i++) {
    this.next();
  }
}

Parallel.prototype.next = function(result) {
  var index = this.index;
  this.activeJobs++;


  this.tasks[this.index](function(result) {
    this.onResult(result, index);
  }.bind(this));

  this.index++;
}

Parallel.prototype.onResult = function(result, index) {
  this.results[index] = result;
  this.activeJobs--;

  if(this.tasks[this.index]) {
    this.next();
  } else if (this.activeJobs === 0) {
    this.onDone(this.results);
  }
}

Parallel.prototype.job = function (step) {
  this.tasks.push(step);
  return this;
};

Parallel.prototype.done = function (onDone) {
  this.onDone = onDone;
  this.start();
};



function asyncRequest1(result) {  
     setTimeout(result, 2000, 'data');
}

function asyncRequest2(result) {  
     setTimeout(result, 2000, 'data 2');
}

function asyncRequest3(result) {  
     setTimeout(result, 2000, 'data3');
}

function asynRequest4(result) {  
     setTimeout(result, 2000, 'data4');
}



var runner = new Parallel({
  parallelJobs: 2
});

runner.job(asyncRequest1)
      .job(asyncRequest2)
      .job(asyncRequest3)
      .job(asyncRequest4)
      .done(function (results) {
         console.log(results); 
      });

Можно так:

class Foo {
  constructor() {
    this.queue = [];
  }

  tick(cb) {
    this.queue.push(cb);
    return this;
  }

  then(cb) {
    return this.queue.reduce((acc, fn) =>
      acc.then(fn), Promise.resolve()).then(cb);
  }
}

Вариант в прототипном стиле:

function Foo() {
  this.queue = [];
}

Foo.prototype.tick = function(cb) {
  this.queue.push(cb);
  return this;
}

Foo.prototype.then = function(cb) {
  return this.queue.reduce(function(acc, fn) {
    return acc.then(fn);
  }, Promise.resolve()).then(cb);
}

Пример использования:

const foo = new Foo();

const task1 = () =>
  new Promise(resolve => {
    setTimeout(() => {
      console.log('task1');
      resolve('Done!');
    }, 1000);
  });

const task2 = arg =>
  new Promise(resolve => {
    setTimeout(() => {
      console.log('task2');
      resolve(arg);
    }, 1000);
  });

foo.tick(task1)
   .tick(task2)
   .then(console.log);

/* result:

    task1
    task2
    Done!

*/

Проблема здесь

{
	exclude: /\/node_modules/,
	loader: "babel-loaderd",
	query: {
		presets: ['es2015-webpack', 'stage-0', 'react']
	},
	plugins: ['transform-runtime'],
},

Надо так

{
	exclude: /\/node_modules/,
	loader: "babel-loader",
	options: {
		presets: ['es2015-webpack', 'stage-0', 'react'],
		plugins: ['transform-runtime']
	}
},

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

Paypal и Netflix используют Node.js. У обоих нагрузки очень даже приличные.
В плане масштабируемости думайте об архитектуре. Можно и на perl написать приложение, которое за секунду будет обслуживать миллион клиентов.
Node.js будет прекрасно работать в качестве движка для типичного веб-приложения вроде магазина, чата или CRM. Если у вас очень много компонентов, например тысячи, логичнее приложение разбить на модули и сделать вместо одного приложения несколько, которые можно запускать по-отдельности (здесь уместно упоминание микросервисной архитектуры). Разумеется запросы нужно распределять с помощью балансировщика.
Есть еще такая вот штука https://serverless.com/ - ее можно масштабировать практически до бесконечности. Были бы деньги.
Node.js будет плохо работать в области процессинга данных, например генерация картинок, потоковая обработка видео, нейронные сети и т.д. Здесь лидеры C, C++, Go, Rust, Java.
Можно даже создать гибридное приложение - большую часть выполнить на Node.js, а критичную по производительности на другом языке. Например генерация миллиона прайсов в сутки в старый xls или векторный pdf, упаковка в архив и рассылка - не самая лучшая идея для Node..JS. То же C++ здесь будет вне конкуренции.

Один из вариантов:
Вам нужно отрисовать компонент Popup внутри вашего родителя, и у Попапа сделать атрибут isVisible, который менять в state родителя.
Таким образом, когда придут новые данные вы можете просто setState вызвать и показать попап.

Никак. В аттрибутах все значения сохраняются как строки.

Потому я бы советовал для разных типов данных в инпуте держать разные обработчики. Ну или там на isNaN проверки делать.

...
const number = isNaN(+value) ? value : +value;
...

const testElementHtml = this.TestElement.parentNode.innerHTML

Но в этом случае будет получен HTML всех дочерних элементов родительской ноды
Если помимо этого div'а есть еще дочерние элементы, то так:

const testElementClone = this.TestElement.cloneNode(true)
const wrap = document.createElement('div')
wrap.appendChild(testElementClone)
const testElementHtml = wrap.innerHTML

Так а причем тут React, если проблема c CSS?

position:absolute задаётся относительно ТОЛЬКО парент компонента

Нет, «position: absolute» задаётся относительно родителя, только если у родителя значение свойства position равно fixed, absolute или relative, то есть не static.

два прямоугольника
.......... у верхнего border-bottom:none;
.......... у нижнего border-top:none;

>Или лучше связать front с backend через ajax запросы к api?
This.