Производительность обработки событий JavaScript со многими асинхронными вызовами HTTP - PullRequest
Новая
       14

Производительность обработки событий JavaScript со многими асинхронными вызовами HTTP

2 голосов
/ 24 сентября 2019

TL, DR;

Полная история может быть сведена к следующим вопросам:

  1. как мне сохранить хорошую производительность, выполняя многодинамические асинхронные HTTP-вызовы на веб-странице?
  2. Является ли GraphQL или WebWorker хорошим способом?

Полная история

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

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

Однако проблемы с производительностью все еще существуют.Когда большое количество HTTP-вызовов разрешается за короткий промежуток времени, рендеринг страницы становится проблемой.Как только пользователь пытается выполнить взаимодействия, например, прокрутку мыши и т. Д., Между двумя событиями пользовательского ввода, возникает много разрешенных событий HTTP-вызовов.Хотя каждый обратный вызов повторного рендеринга не займет много времени, он по-прежнему вызывает проблемы с производительностью, если все маленькие временные интервалы суммируются.

В настоящее время я рассматриваю два возможных решения:

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

Решение GraphQL требует большой доработки, чего я стараюсь избегать.Но у меня нет большого опыта работы с WebWorker, будет ли он работать так, как задумано?И есть ли другие решения?

Кстати, для рендеринга таблицы, я использую компонент таблицы элемента пользовательского интерфейса.И совместимость браузера для меня не проблема.

1 Ответ

1 голос
/ 24 сентября 2019

Минимизация количества дискретных HTTP-вызовов - хорошая идея, поэтому вы должны смотреть на среднесрочную и долгосрочную перспективу # 1 или аналогичную.

Re # 2, хотя вы, вероятно, неt нужно , чтобы использовать для этого веб-работника.Обработка завершений, вероятно, не является узким местом, скорее всего, все небольшие манипуляции с DOM, вызывающие большое количество повторений и тому подобное.Поэтому, если вы соберете их и примените их сразу, вы сможете значительно уменьшить влияние этих изменений, не прибегая к помощи веб-работника.

...