Стратегии производительности Apollo InMemoryCache для большого набора данных (React)

Исходный набор данных, полученный из запроса Apollo Client GraphqQL для приложения, которое я пытаюсь настроить, в настоящее время очень велик. Под словом «большой» я имею в виду, что кажется, что данные нормализуются примерно до 7000 записей под ключом «данные» в кеше. Полезная нагрузка составляет около 1,6 МБ. Если бы я сохранил запись данных в кеше, она нормализовалась до 3 МБ. Я не фанат того, как работает первоначальный запрос, поскольку в настоящее время я переделываю их приложение для использования курсоров и фильтрации на графике, а не для того, чтобы клиент извлекал такой большой объем данных и сам себя фильтровал. Текущая реализация не может масштабироваться, так как большие наборы данных будут возвращены при установке этого программного обеспечения в других местах. Но я ищу краткосрочное решение, чтобы ускорить создание этого кеша, пока я беру на себя очень большую задачу по редизайну.

* ОБНОВЛЕНИЕ 25 июля 2018 г. ** Подход курсора не работает, так как производительность записи в кэш ухудшается, поскольку во время выборки каждой страницы / курсора данных добавляются новые записи.

Настоящая проблема заключается в том, что IE 11, который мы должны поддерживать из-за того, что этот браузер используется в отрасли (здравоохранение), работает очень медленно. Его очень сложно измерить, но он примерно в 8-10 раз медленнее, чем Chrome в области кеша Apollo и кода интеграции реагирования. Chrome может занять 1-2 секунды для создания кеша на этих более медленных виртуальных рабочих столах, в то время как IE займет 10-20 секунд.

Итак, мой вопрос: есть ли какие-нибудь настройки производительности, которые помогут быстрее построить кеш? Я приложил скриншот, чтобы показать, где находится узкое место. В chrome он такой же, как и в IE, в IE он примерно на порядок медленнее. Я не уверен, что это недостаток IE, или это какая-то сумасшедшая проблема с полифилом, которая ужасна. На снимке экрана показаны горячие точки, которые отображаются в результатах производительности. Да, этот снимок экрана относится к разрабатываемой версии React, но мы не видим заметного увеличения производительности в продакшене. Снимок экрана - это просто вызов графика и простейшей HTML-таблицы, которая содержит около 260 строк. Фаза рендеринга незначительна. Кажется, на этом этапе очень много событий или «работы» в очереди. Возможно, есть способ приостановить это? Профилировщик Chrome показывает ту же самую горячую точку, только не такой медленный.

В любом случае, любой совет приветствуется.

Столбцы скриншотов: функция | счетчик вызовов | время (секунды)