Какая польза от библиотеки управления состоянием в SSR-приложении? - PullRequest
Новая
       6

Какая польза от библиотеки управления состоянием в SSR-приложении?

0 голосов
/ 07 мая 2020

Я использую Next JS в качестве библиотеки для обслуживания приложения SSR. В документации и примерах я много читал об использовании для этого библиотеки управления состоянием. Я привык использовать библиотеку управления состоянием в приложении с рендерингом на стороне клиента, но на самом деле не вижу дополнительных преимуществ в приложении SSR. На клиенте я бы использовал это для хранения настроек, таких как профиль, состояние пользовательского интерфейса и, возможно, некоторые результаты вызовов API. Когда бы я ни путешествовал, этот магазин остается нетронутым. Однако в приложении SSR, когда происходит навигация, приходит новый запрос, где все JavaScript загружаются снова, верно? Это означает, что мой магазин снова будет строиться с нуля.

1 Ответ

0 голосов
/ 07 мая 2020

Управление состоянием в SSR в основном предназначено для предварительной загрузки состояния, из которого выполняется гидратация на стороне клиента.

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

Вот пример сокращения 

function renderFullPage(html, preloadedState) {
  return `
    <!doctype html>
    <html>
      <head>
        <title>Redux Universal Example</title>
      </head>
      <body>
        <div id="root">${html}</div>
        <script>
          // WARNING: See the following for security issues around embedding JSON in HTML:
          // https://redux.js.org/recipes/server-rendering/#security-considerations
          window.__PRELOADED_STATE__ = ${JSON.stringify(preloadedState).replace(
            /</g,
            '\\u003c'
          )}
        </script>
        <script src="/static/bundle.js"></script>
      </body>
    </html>
    `
}

Если вы планируете дать этому go будьте осторожны с JSON.stringify(preloadedState), это уязвимость XSS

...