setTimeout стакается в componentDidUpdate

Доброе время суток. React подключен к рельсам через ActionCable (вебсокет). Нужно каждое определенное время дёргать инфу с сервера и записывать в стейт.

Проблема: очень сильно проседает производительность, оно и понятно - информация с сервера дёргается каждые 30 милисекунд, при этом мне нужно обновлять кол-во листов, название листа, кол-во карточек, название карточки.

Для обновления информации я использую componentDidUpdate и тут всё в полном порядке до тех пор пока этих самых листов нет. После того как я добавляю новый лист GET запросы стакаются и сервер жрёт cpu как не в себя.

componentDidUpdate в BoardContainer:

componentDidUpdate = () => {
    setTimeout(() => {
      axios.get(`${API_ROOT}/lists`).then((response) => {
        this.setState({ lists: response.data.lists });
      });
    }, 3000);
  };

Так же и с другим componentDidUpdate в ListContainer:

  componentDidUpdate = () => {
    setTimeout(() => {
      axios.get(`${API_ROOT}/cards`).then((response) => {
        this.setState({ cards: response.data.cards });
      });
    }, 3000);

    setTimeout(() => {
      axios.get(`${API_ROOT}/lists/${this.props.list_id}`).then((response) => {
        this.setState({ title: response.data.list.title });
      });
    }, 3000);
  };

Каким образом можно решить проблему? Заранее благодарю.