Как правильно приостановить реагирующий процесс маршрутизации в SPA? - PullRequest
0 голосов
/ 24 апреля 2020

Есть сайт, фронт написан ReactJS. Для правильной работы генерального директора используется SSR. Алгоритм выглядит так:

загрузка 1 страницы

  1. браузер открывается / foo;
  2. SSR проверяет, есть ли в кэше / foo не находит его;
  3. SSR рендерит на сервере и выполняет приложение реагировать по запросу / foo;
  4. SSR помещает в кеш HTML, который получился в результате рендеринга process / foo;
  5. SSR предоставляет браузеру HTMLL, который был результатом процесса визуализации / foo;
  6. Браузер выполняет асинхронные запросы, которые HTML, то есть результат рендеринга / foo (CSS, JS, favicon ...);
  7. реакция загруженного приложения "понимает, что страница уже прорисована и что нет необходимости выполнять маршрутизацию и т. д. on ";
  8. Реакция обрабатывает дальнейшие действия пользователя (как в обычном SPA).

Последующие обновления

  1. браузер открывается / foo;
  2. SSR проверяет, находится ли в кеше / foo его не находит; * 1 033 *
  3. SSR рендерится на сервере и запускает приложение реагирования по запросу / foo;
  4. SSR помещает в кеш HTML, что получилось в результате процесса рендеринга / foo;
  5. дает браузеру HTMLL, который был результатом процесса рендеринга / foo;
  6. Браузер выполняет асинхронные запросы, которые равны HTML, что является результатом рендеринга / foo ( CSS, JS, favicon ...);
  7. реакция загруженного приложения "понимает, что страница уже нарисована и что нет необходимости выполнять маршрутизацию и т. Д.";

Реакция обрабатывает дальнейшие действия пользователя (как в обычном SPA). Проблема в том, что каждый раз, когда страница обновляется, запускается маршрутизация, и все приложение рисуется заново, и, таким образом, появляется «мерцание», то есть точка 7 не работает.

Вопрос : Возможно ли остановить этот рендеринг в определенный момент? Скажите маршрут, что нет необходимости рисовать его прямо сейчас. Может быть, есть какое-нибудь популярное решение?

1 Ответ

0 голосов
/ 25 апреля 2020

Вы можете использовать метод жизненного цикла shouldComponentUpdate. Вы можете установить свой собственный лог c в методе для компонента, который будет перерисован или нет. Метод класса shouldComponentUpdate имеет доступ к следующим реквизитам и состоянию перед запуском повторного рендеринга компонента. Вот где вы можете решить предотвратить повторную визуализацию, вернув false из этого метода. Если вы вернете true, компонент будет повторно визуализирован.

...