Skip to Content
Оптимизация, отложенная загрузка и автозапуск

Оптимизация, отложенная загрузка и автозапуск

Для экономии ресурсов и более быстрой загрузки страницы можно отложить загрузку плеера или видео. Ниже описаны доступные способы.

Отключение предзагрузки видео

Плеер загрузится вместе с постером, но данные видео не будут загружаться до начала воспроизведения. Это экономит трафик и ускоряет загрузку страницы.

Простое встраивание:

<iframe src="https://kinescope.io/embed/VIDEO_ID?preload=0" ...></iframe>

IFrame API:

playerFactory.create('player', {
  url: 'https://kinescope.io/VIDEO_ID',
  behavior: {preload: false},
});

Отложенная загрузка самого плеера

Если плеер находится вне зоны видимости (например, внизу страницы), можно отложить загрузку <iframe> до тех пор, пока пользователь не прокрутит до него. Браузер не будет загружать iframe, пока он не окажется вблизи видимой области.

<iframe loading="lazy" src="https://kinescope.io/embed/VIDEO_ID" ...></iframe>

Отключение постера плеера

Если вы используете собственный постер (например, <img> поверх плеера), отключите встроенный постер, чтобы не загружать его дважды:

<iframe src="https://kinescope.io/embed/VIDEO_ID?no_poster=1&preload=0" ...></iframe>

Автозапуск при видимости на странице

Плеер начнёт воспроизведение автоматически, когда окажется в видимой области. Удобно, если плеер расположен ниже первого экрана.

playerFactory.create('player', {
  url: 'https://kinescope.io/VIDEO_ID',
  behavior: {autoPlay: 'viewable'},
});

Автозапуск и воспроизведение пока курсор над плеером

Видео проигрывается только пока курсор находится над плеером — при уходе курсора ставится на паузу. До первого клика по плееру.

playerFactory.create('player', {
  url: 'https://kinescope.io/VIDEO_ID',
  behavior: {autoPlay: 'hover'},
});

Ограничение максимального качества при ABR

По умолчанию плеер автоматически выбирает лучшее доступное качество видео (ABR). Можно ограничить максимальное качество, чтобы снизить потребление трафика:

playerFactory.create('player', {
  url: 'https://kinescope.io/VIDEO_ID',
  behavior: {maxAbrQuality: 720},
});
Управление плееромПлейлисты