Мы разрабатываем приложение angular с использованием redux и ngrx / store.
Приложение считывает непрерывный поток данных через веб-сокет и обновляет хранилище новыми данными почти каждую секунду.
У нас есть такая проблема: когда пользователь покидает окно браузера или даже вкладку браузера, соединение ws автоматически закрывается, и при возврате на передний план мы теряем информацию, поскольку хранилище не обновляется в это время, а интерфейс не иметь более точные данные.
Что мы делаем сейчас, чтобы проверить, разбудило ли соединение с помощью этого веб-работника:
addEventListener('message', ({ data }) => {
let lastTime = (new Date()).getTime();
const checkInterval = 2000;
setInterval(function () {
const currentTime = (new Date()).getTime();
if (currentTime > (lastTime + checkInterval * 2)) { // ignore small delays
postMessage('wakeup');
}
lastTime = currentTime;
}, checkInterval);
});
Затем мы опустошаем хранилище, повторно подписываемся на websocket и снова заполняем весь магазин с новыми данными. Это не идеально, потому что пользовательский интерфейс очищается и заполняется, и это видно пользователю. (Примерно две секунды у нас нет данных - пока не поступит новая информация).
Мы также не хотим показывать счетчики. Теперь мы используем иконку спинового загрузчика, центрированную на экране во время повторного заполнения магазина. Иногда это очень раздражает, по крайней мере, при использовании ios устройств, потому что если я вернусь через 5 секунд, веб-работник отправит «пробуждение» в ios.
Мы хотим плавно подписаться в фоновом режиме и заменить старые данные с новыми данными. Чтобы использовать что-то вроде временного хранилища при подписке в фоновом режиме, замените основное хранилище временным хранилищем, пока все готово в фоновом режиме. Можем ли мы просто заменить такие магазины? Есть ли способ добиться чего-то похожего на это?
Спасибо!