Как справляются браузеры с параллельной загрузкой скриптов?
Во времена IE7 и Firefox 2.0 ни один браузер не загружал скрипты параллельно с другими ресурсами. Вместо этого старые браузеры блокировали все последующие запросы до полной загрузки, парсинга и выполнения скрипта. Вот так выглядел лог HTTP-запросов при подобной блокировке в старых браузерах:
На тестовой странице, по которой была сгенерирована данная диаграмма, есть шесть HTTP-запросов:
На диаграмме видно, как скрипты блокируют друг друга, а также картинку, стилевой файл и iframe. Последние загружаются параллельно друг другу, но только после того, как завершена последовательная загрузка скриптов.
Скорее всего, причиной последовательной загрузки скриптов в старых браузерах являлось сохранение порядка выполнения. Это критично, когда код во втором скрипте зависит от переменных в первом. Сохранение порядка выполнения решает проблему неопределённых переменных. Однако очевидна упущенная выгода — пока браузер загружает первый скрипт и гарантирует его выполнение первым, он мог бы параллельно загружать остальные четыре ресурса.
Слава новым браузерам, они загружают скрипты параллельно!
Это большая победа для современных веб-приложений, часто состоящих из 100K+ яваскрипт-кода, разделённого на несколько файлов. Загрузка той же самой страницы в IE8, Firefox 3.6, Chrome 4 и Safari 4 приводит к следующей диаграмме:
Положение вещей улучшилось, однако не настолько, насколько могло бы. В данном случае IE8 загружает два скрипта и стилевой файл параллельно, но картинка и iframe заблокированы. Во всех современных браузерах есть похожие ограничения, связанные с типами ресурсов, которые могут грузиться параллельно со скриптами. В таблице из Browserscope показан прогресс в этом вопросе на текущий момент. Кнопка «Compare», недавно добавленная в Browserscope, облегчила составление таких отчётов.
При загрузке скриптов IE8 всё ещё блокирует картинки и iframe. Chrome 4, Firefox 3.6 и Safari 3.6 блокируют только iframe. Opera 10.10 блокирует все типы ресурсов. Уверен, параллельная загрузка скриптов будет совершенствоваться, судя по значительному прогрессу в последних версиях браузеров. Давайте следить за будущими версиями и отмечать улучшения в этом вопросе.
Во времена IE7 и Firefox 2.0 ни один браузер не загружал скрипты параллельно с другими ресурсами. Вместо этого старые браузеры блокировали все последующие запросы до полной загрузки, парсинга и выполнения скрипта. Вот так выглядел лог HTTP-запросов при подобной блокировке в старых браузерах:
На тестовой странице, по которой была сгенерирована данная диаграмма, есть шесть HTTP-запросов:
- HTML-документ;
- первый скрипт — 2 секунды на скачивание, 2 секунды на выполнение;
- второй скрипт — 2 секунды на скачивание, 2 секунды на выполнение;
- картинка — 1 секунда на скачивание;
- стилевой файл — 1 секунда на скачивание;
- iframe — 1 секунда на скачивание.
На диаграмме видно, как скрипты блокируют друг друга, а также картинку, стилевой файл и iframe. Последние загружаются параллельно друг другу, но только после того, как завершена последовательная загрузка скриптов.
Скорее всего, причиной последовательной загрузки скриптов в старых браузерах являлось сохранение порядка выполнения. Это критично, когда код во втором скрипте зависит от переменных в первом. Сохранение порядка выполнения решает проблему неопределённых переменных. Однако очевидна упущенная выгода — пока браузер загружает первый скрипт и гарантирует его выполнение первым, он мог бы параллельно загружать остальные четыре ресурса.
Слава новым браузерам, они загружают скрипты параллельно!
Это большая победа для современных веб-приложений, часто состоящих из 100K+ яваскрипт-кода, разделённого на несколько файлов. Загрузка той же самой страницы в IE8, Firefox 3.6, Chrome 4 и Safari 4 приводит к следующей диаграмме:
Положение вещей улучшилось, однако не настолько, насколько могло бы. В данном случае IE8 загружает два скрипта и стилевой файл параллельно, но картинка и iframe заблокированы. Во всех современных браузерах есть похожие ограничения, связанные с типами ресурсов, которые могут грузиться параллельно со скриптами. В таблице из Browserscope показан прогресс в этом вопросе на текущий момент. Кнопка «Compare», недавно добавленная в Browserscope, облегчила составление таких отчётов.
При загрузке скриптов IE8 всё ещё блокирует картинки и iframe. Chrome 4, Firefox 3.6 и Safari 3.6 блокируют только iframe. Opera 10.10 блокирует все типы ресурсов. Уверен, параллельная загрузка скриптов будет совершенствоваться, судя по значительному прогрессу в последних версиях браузеров. Давайте следить за будущими версиями и отмечать улучшения в этом вопросе.