Остановить загрузку компонентов на полпути
Я создал приложение, используя angular 7, которое очень интенсивно работает в браузере и имеет много тяжелых компонентов. Всякий раз, когда я перехожу от полузагруженного компонента к другому компоненту, требуется некоторое время. Мой вопрос: могу ли я как-то остановить инициализацию загружаемого в данный момент компонента и начать инициализацию следующего компонента?
Я знаю, что отложенная загрузка и предварительная загрузка могут быть одним из возможных решений моей проблемы, но это не так эффективно.
Он состоит из нескольких асинхронных вызовов и обработки данных. Кроме того, он рисует холст с использованием SVG, отсюда и отставание.
Ответы 1
Для асинхронных операций я бы обязательно использовал Observables и отписался от них, чтобы прервать их работу. См. https://angular.io/guide/comparing-observables#cancellation
Для обработки данных я предлагаю вам изучить рабочие потоки (или веб-воркеры). Это функция JavaScript, и здесь уже есть много статей и вопросов, посвященных веб-работникам и их интеграции с Angular. Поскольку веб-воркеры работают в отдельных потоках, основной поток (тот, в котором работает Angular) может отменять задачи, отправленные веб-воркерам.
Редактировать: для холста также есть экспериментальный API, OffscreenCanvas, который позволяет вам выполнять операции рисования внутри веб-воркеров.
См. https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas
Однако, если вы решите не использовать веб-воркеры или OffscreenCanvas, я думаю, все, что вы можете сделать, это оптимизировать способ использования холста. Если вы разумно используете window.requestAnimationFrame(), выполняя небольшие пакеты операций в каждом кадре, я думаю, вы можете построить процесс рисования, который будет меньше влиять на основной поток и может быть прерван.
https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Оптимизация_canvas
Это очень открытый вопрос. Что это за тяжелая инициализация, которую вы делаете? Он состоит из асинхронных операций, таких как HTTP-запросы? Это обработка данных? Вы можете прерывать асинхронные операции. Однако JavaScript является однопоточным и не может быть прерван. В этом случае вам может понадобиться изучить рабочие потоки.