Ускорение сайта с большим количеством изображений

Поддержка
1

После прочтения всех предупреждений об использовании Cloudflare и сайтов с большим количеством изображений, я решил принять этот вызов для небольшого личного проекта, над которым я работаю. Хотя с Cloudflare у меня в основном всё получается, я не могу понять, почему изображения моей темы не загружаются до завершения выполнения JavaScript (похоже, что проблема не в CDN).

Есть ли способ загрузить изображения раньше (параллельно с JS/CSS или просто во время выполнения JS), или это невозможно? Может ли это быть необходимой приоритизацией?

Ниже приведены результаты моего теста на webpagetest.org. Меня беспокоит большой разрыв между моментом ~2,3 с, когда последний JS-скрипт завершает загрузку, и моментом ~3,4 с, когда изображения начинают скачиваться.

image
image1098×1514 328 KB

Макет темы:

image
image1859×1488 466 KB

Конфигурация
Ссылка: https://investorcommunity.org
Тема: Graceful
Сервер: Droplet от DigitalOcean (без дополнительного кэширования или S3)
CDN: Cloudflare (бесплатная версия, с отключённым «Rocket Loader» из-за помех для JS). Стоит отметить, что отключение Cloudflare, похоже, не влияет на эту конкретную проблему.

Буду признателен за любые идеи.

2

Этот разрыв соответствует периоду выполнения JavaScript, когда мы завершаем загрузку приложения Discourse на базе EmberJS и запускаем его. Над модернизацией приложения EmberJS работает несколько человек, и в этом году мы начнем получать плоды этой работы.

Однако, поскольку это JavaScript-приложение, выполнение JS-кода будет происходить всегда, поэтому, если вы уже решили использовать Discourse для своего сообщества, я бы не стал слишком сильно беспокоиться об этом.

3

Логично… спасибо за объяснение.

Есть ли способ запустить передачу изображений темы параллельно с инициализацией этого скрипта, чтобы изображения предзагружались и отображались сразу после завершения работы JS? Или JS-скрипт является обязательным условием для того, чтобы знать, какие изображения нужно загрузить изначально?

С нетерпением жду новостей об EmberJS — с нетерпением ждем отличных улучшений, которые вы постоянно выпускаете!