Как запросы на общий доступ к различным источникам влияют на производительность программы

kak zaprosy na obshhij dostup k razlichnym istochnikam vliyayut na

Название может натолкнуть вас на мысль, что эта публикация является еще одним сообщением об отрицательной стороне «одностраничной программы». Это больше о том, чтобы пролить свет на перспективы производительности, которые следует помнить при проектировании SPA. Особенно если ваш SPA использует API из разных служб домена.

Если вы разрабатываете SPA, который потребляет API из того же домена SPA, это отлично. Вы должны пропустить эту статью, если ваш SPA использует только API в том же домене.

Большинство СПА включают «микросервисы». Они потребляют разные конечные точки услуг, которые обслуживают разные домены в пределах SPA. Это придает устойчивость, отказоустойчивость и улучшает опыт нашего продукта. Несколько запросов на домен становятся неизбежными до тех пор, пока мы не будем строго соблюдать одно доменное приложение API Gateway — шаблон микросервисов для нашего СПА.

PcHWxtFEw5vzZI3anByzWY67x-uPCaIAOFd4
SPA+Cors не всегда уменьшает задержку.

Представим, что у нас есть a GET API /users/report/:id обслуживается из домена api.example.com. Наш СПА обслуживается с spa.example.com. The :id означает значение, которое может быть изменено для каждого запроса.

Можете ли вы угадать проблему с приведенным выше дизайном API относительно CORS (Cross-Origin Resource Sharing) и его влияние на производительность нашего SPA?

Вот краткий ввод в CORS от MDN:

xvd3slhsPc14xXUGV4GnBNqmK8PzfJIwNSHO

CORS — это все хорошо, хотя это простой запрос, не инициирующий предполет CORS. Но чаще мы предоставляем запросы, которые не являются «простым запросом».

Это связано с тем, что нам нужно отправить заголовок, который не является CORS-safelisted-request-header. Пример заголовка Authorization, x-corelation-id. Часто наши Content-Type значение заголовка application/json. Это не разрешенное значение для Content-Type заголовок для заголовка cors-safelisted-request-header.

Если наша api.example.com сервер принимает content-type с application/jsonнаш домен SPA spa.example.com сначала пришлет HTTP-запрос с помощью OPTIONS метод. Отправляется на ресурс /users/report/12345 на другом домене api.example.com. Чтобы определить, безопасно ли отправить запрос, параметр отправляется предварительно. Межсайтовые запросы всегда обрабатываются таким образом, поскольку они могут иметь последствия для пользователей.

Это работа api.example.com сервер, чтобы разрешить другому домену spa.example.com знать, что отправлять данные безопасно. Возможно, вы сделали что-то похожее для CORS в своей программе.

EPbbVhWxAMi9cCXNxD2x-L3qGSu5dACKlOIB
Разрешение CORS на сервере Express.js

Однажды api.example.com сервер отправляет правильный ответ из метода «OPTIONS» в другой домен spa.example.com тогда выполняются только фактические данные с запросом, который вы пытались сделать.

Итак, чтобы получить доступ к ресурсу api.example.com/users/report/12345 было выполнено два фактических запроса.

Вы можете сказать да. Мы можем использовать Access-Control-Max-Age header для кэширования результатов предварительного запроса. В следующий раз мы получим доступ к ресурсу api.example.com/users/report/12345 от spa.example.com нет запроса перед полетом.

Да, это правда, но тогда вспомните название — Страшная стоимость исполнения CORS запросы в одностраничном приложении (SPA). Это происходит от API, которое мы используем, и от того, как он был разработан. В нашем примере мы разработали наш API /users/report/:idгде :id означает, что это значение может изменяться.

Принцип работы кэша перед началом проверки зависит от URL, а не только источника. Это означает, что любое изменение пути (включающее параметры запроса) требует еще одного запроса на предварительную проверку.

Итак, в нашем случае доступ к ресурсу api.example.com/users/report/12345 и api.example.com/users/report/123987он инициирует четыре запроса от нашего SPA.

Если у вас медленная сеть, это может оказаться большой неудачей. Особенно когда ответ на запрос OPTIONS занимает 2 секунды и еще 2 для данных.

А теперь представьте, что ваша программа SPA делает миллионы таких запросов для разных доменов. Это повлияет на эффективность вашего SPA. Вы удваиваете задержку каждого запроса.

Спа-центры великолепны в своей собственной сфере. Но для использования разных доменов они имеют свою стоимость. Если API разработан плохо, проблемы с задержкой вашего SPA могут повредить больше, чем предоставляемые ими преимущества.

Нет решения или технологии, которые были бы вполне хорошими или плохими. Важно знать его недостатки и то, что нужно, чтобы он работал. Это то, что отличает ваше приложение от других.

Добавить комментарий

Ваш адрес email не будет опубликован.