0

Разрабатываю сайт на vueJS, на сайте много изображений (около 100) и видео (около 10). Изображение храню и загружаю из VueX. Изображения/видео разделены на группы, пользователя выбирает соответствующие разделы и фото/видео обновляются. Видео загружаю через iframe c ютуба. Видна задержка между переключениями, сайт подвисает. Как можно оптимизировать загрузку фото и видео, чтобы пользователь не видел задержек? папка dist весит 98 мб. Буду благодарна за любые советы!

1
  • «Как можно оптимизировать загрузку фото и видео» - вроде никак: скачивание не может идти быстрее чем это технически возможно (скриптом нельзя улучшить канал связи с серверами). _«чтобы пользователь не видел задержек» - прячь контент или ставь заглушку "загрузка", по готовности показывай (с готовностью картинок просто, событие loadend, а вот с embedded-видео вероятно единственным вариантом является использование YouTube API).
    – yar85
    Commented 26 авг. 2021 в 14:06

1 ответ 1

0

Не грузи iframe без надобности, грузи только тогда, когда пользователь нажмет на нужное видео, на любом видео хостинге ты не найдешь сразу загрузку iframe или видео, они грузят превью (есть в апихе ютуба), с изображениями вообще легко, observer делаешь и грузишь если в поле видимости (так же и с видео можно), если изображения миниатюрные, к примеру 200х200, то зачем грузить самую большую картинку и стилями её уменьшать, кропни ее заранее и грузи, а как пользователь захочет увидеть на весь экран изображение (при клике открыть на весь экран) - тогда и грузи полномасштабное.

Или lazy load, но ее нужно все равно прогнать через сжатие без потери качества, вес как минимум х2 уйдет.

Плюс можно CDN использовать для медиа файлов, настроить кэширование.

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.