--- title: Время ожидания (latency) slug: Web/Performance/Understanding_latency tags: - Connection - Network - Web Performance - latency - Время ожидания - Производительность - Соединение - сеть translation_of: Web/Performance/Understanding_latency --- <p><strong>Latency</strong> (дальше - <strong>время ожидания</strong>) - это время, которое требуется на доставку пакета данных от источника к пункту назначения. В деле оптимизации производительности важно сокращать проблемы, которые приводят к длительному времени ожидания. Также необходимо научиться тестировать работу приложения в условиях плохого соединения. В этой статье мы рассмотрим само понятие времени ожидание, его причины, способы детекции и исправления.</p> <h2 id="Что_такое_время_ожидания">Что такое "время ожидания"?</h2> <p>Время ожидания - это промежуток времени, который проходит с момента старта запроса до момента получения ответа. При запросе первых 14КБ время ожидания дольше, потому что весь запрос включает в себя {{glossary('DNS')}} запрос, соединение {{glossary('TCP handshake')}}, установление безопасного соединения {{glossary('TLS')}}. Последующие запросы будут иметь меньшее время ожидания, так как соединение с сервером уже установлено.</p> <p>Время ожидания описывает величину задержки сети или, в частности, интернет-соединения. Малое время ожидания подразумевает едва заметные задержки. Большое время ожидания подразумевает большие задержки. Одно из основных усилий в оптимизации приложения должно быть направлено на снижение этого времени ожидания.</p> <p>Улучшить время ожидания, связанное только с одним ресурсом, например, с HTML кодом страницы - это довольно просто. Но приложения, как правило, состоят из множества запросов: CSS, JavaScript-файлы, медиа. Чем больше запросов исходит со страницы, тем большее влияние оказывает время ожидания на общие впечатления пользователя.</p> <p>При соединении с малым временем ожидания ресурсы появляются практически мгновенно. При соединении с большим временем ожидания задержка между запросом и ответом становится заметной. Мы можем определить время ожидания, измеряя скорость, с которой данные проходят из одной сети к другой.</p> <p>Время ожидания может быть измерено для одного направления (например, сколько времени проходит до отправки запроса) или для полного пути обмена сообщениями (сколько времени заняли запрос и получение ответов).</p> <h2 id="Эмуляция_времени_ожидания">Эмуляция времени ожидания</h2> <p>Для эмуляции большой времени задержки вы можете использовать средства разработчика. В англоязычных интерфейсах эмуляция называется "Throttling".</p> <p><img alt="Emulate latency by emulating throttling" src="https://mdn.mozillademos.org/files/16805/emulate_latency.png" style="height: 268px; width: 829px;"></p> <p>В Firefox кнопка переключения находится на панели Network (Сеть), в заголовке таблицы. С помощью инструмента вы можете испытать работу приложения в сетях от GPRS до высокоскоростных. Также вы можете сами указать скорость загрузки и время ожидания. Браузеры предоставляют разные наборы значений, но, как правило, все они покрывают перечисленные ниже случаи:</p> <table> <thead> <tr> <th>Selection</th> <th>Download speed</th> <th>Upload speed</th> <th>Minimum latency (ms)</th> </tr> </thead> <tbody> <tr> <td>GPRS</td> <td>50 Kbps</td> <td>20 Kbps</td> <td>500</td> </tr> <tr> <td>Regular 2G</td> <td>250 Kbps</td> <td>50 Kbps</td> <td>300</td> </tr> <tr> <td>Good 2G</td> <td>450 Kbps</td> <td>150 Kbps</td> <td>150</td> </tr> <tr> <td>Regular 3G</td> <td>750 Kbps</td> <td>250 Kbps</td> <td>100</td> </tr> <tr> <td>Good 3G</td> <td>1.5 Mbps</td> <td>750 Kbps</td> <td>40</td> </tr> <tr> <td>Regular 4G/LTE</td> <td>4 Mbps</td> <td>3 Mbps</td> <td>20</td> </tr> <tr> <td>DSL</td> <td>2 Mbps</td> <td>1 Mbps</td> <td>5</td> </tr> <tr> <td>Wi-Fi</td> <td>30 Mbps</td> <td>15 Mbps</td> <td>2</td> </tr> </tbody> </table> <h2 id="Временные_показатели_сети">Временные показатели сети</h2> <p>Кроме того, во вкладке Network (Сеть), вы можете изучить, как много времени занял тот или иной запрос. На изображении ниже - пример загрузка SVG файла размером 267.5КБ.</p> <div><img alt="The time it took for a large SVG asset to load." src="https://mdn.mozillademos.org/files/16807/latencymlw.png" style="height: 342px; width: 1311px;"></div> <p>Когда запрос находится в очереди, ожидая установки соединения с сервером, он считается заблокированным. Блокировка случается, когда браузер уже обрабатывает слишком много соединений одновременно (в большей степени это относится к предыдущему поколению HTTP1.1, который позволял поддерживать до 6 соединений за раз). Пока все соединения обрабатываются, браузер не может загружать другие ресурсы. Как только загрузка ресурса завершается - соединение освобождается.</p> <p><strong>DNS поиск (DNS resolution) </strong>- это время, которое требуется на {{glossary('DNS lookup')}}. Это процесс, когда браузер находит соответствие между именем домена и его IP-адресом. Если вы обращаетесь ко многим доменам, DNS поиск занимает больше времени.</p> <p><strong>Установка соединения (Connecting) </strong>- это время, требуемое на {{glossary('TCP handshake')}}. Это процесс SYN - ACK, когда браузер и сервер договариваются о формате соединения. Как и DNS, чем больше соединений к разным серверам вы используете, тем больше время создания соединений.</p> <p> <strong>{{glossary('TLS')}} handshake</strong> - это процесс установки безопасного соединения. И хотя установка безопасного соединения занимает дополнительное время, ни в коем случае не стоит отказываться от него, жертвуя безопасностью пользователей.</p> <p><strong>Отправка</strong> <strong>(Sending)</strong> - время, необходимое для отправки HTTP запроса на сервер.</p> <p><strong>Ожидание (Waiting</strong>) - это ожидание обработки запроса сервером. Например, вы хотите получить изображение. В этом случае сервер должен обратиться к файловой системе, найти файл, передать его HTTP соединению. В случае сложных динамических запросов процесс может занимать секунды и минуты. Это ещё одно место для оптимизации, но уже не клиентское, а серверное.</p> <p><strong>Получение (Receiving</strong>) - это время на загрузку ответа. Этот показатель - комбинация скорости сети и размера файла. Если изображение было закешировано, то его загрузка может произойти мгновенно. Но если не использовать кеш и включить эмуляцию медленной сети, изображение может загружаться 43 секунды!</p> <h2 id="Измерение_времени_ожидания">Измерение времени ожидания</h2> <p><strong>Время ожидания сети (Network latency</strong>) - это время, которое требуется на отправку запроса и полную загрузку ответа.</p> <p><strong>Время ожидания диска (Disk latency</strong>) - это время, которое требуется устройству на то, чтобы получить запрос, понять его, найти файл в файловой системе и вернуть ответ.</p>