Почему глючит Ютуб на DTF

Не всегда, но в последнее время зачастил.

В последнее время часто пишут (например, вот, вот, вот и вот) про баг с Ютубом. Встроенные видео не проигрываются, а вместо этого появляется надпись «Video unavailable».

Проблема действительно есть, но, похоже, что на этот раз мы не виноваты и трабл на стороне ютуба.

Внимательные юзеры могут возразить, что проблема наблюдается только на DTF (ну и еще на TJ с VC), но дальше я объясню почему на других сайтах ее попросту не замечают.

Обычно, чтобы вывести на странице видео с Ютуба вставляют эмбед. Эмбед, по сути, является айфреймом, или, иначе говоря, этаким окошком на сайт ютуба. Это самая простая и потому наиболее распространенная практика.

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

Здесь все что хочешь: и стили, и шрифты, и картинки, и скрипты. Последних аж семь штук. Вес всего этого роскошества переваливает за два мегабайта. Да у нас главная страница столько не весит!

А если таких эмбедов на странице несколько (что далеко не редкость), то каждый будет грузить свое добро независимо от остальных, отъедая трафик и ресурсы.

Чтобы не быть голословным, вот страничка, на которой нет ничего кроме двадцати ютубовских эмбедов: 360 запросов на 38.9 мегабайт, которые вылились в дополнительные 6 секунд загрузки (при хорошем интернете). Если б вокруг этой страницы был еще и сайт, то пользоваться им не захотелось бы.

Мы подумали, что так нельзя и нужно сделать лучше.

Вместо эмбеда мы отображаем муляж, состоящий из превью-картинки и заботливо стилизованной кнопки. Сравните сами:

Согласитесь, практически одно и то же. Но весит на пару мегабайт меньше.

При нажатии на муляж подгружается API Ютуба, после чего заглушка заменяется настоящим видео с флагом автопроигрывания.

Такой подход требует определенных усилий со стороны разработки, поэтому его не часто встретишь на сайтах. Для этого нужно очень любить своих пользователей, а мы как раз их тех <3.

Так вот, эта система прекрасно работала последние пару лет, пока не начала твориться чертовщина.

Давайте разберем пример. Возьмем обычное, ничем не примечательное видео с ютуба и встроим его сюда:

Это муляж, при нажатии на который заиграет настоящий ролик.
Здорово! А теперь давайте попробуем другое видео:

Мистика! Само-то видео есть и работает.
Проанализируем что случилось. В первом случае ссылка эмбеда такая:

Во втором такая:

За исключением айдишников видео, ссылки идентичны. Если поварьировать последнюю ссылку и поставить флаг "autoplay" в значение "0" или вовсе его убрать, то видео становится доступно, правда, при попытке воспроизвести появится все так же знакомая надпись.

Внимательное вглядывание в документацию не принесло результатов. Гугление проблемы выявило несколько похожих ситуаций (например, вот), но без решений.

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

Аналогичный вопрос мы задали на форуме поддержки Ютуба.
Точнее, даже три вопроса: первые два выпилили по причине нарушения правил (им не понравились то ли ссылки на видео, то ли скриншоты). Последний пока висит, но без ответа.

Мы очень любим нашу систему с муляжами, потому что она экономит вам уйму ресурсов. Технически нам ничего не стоит отказаться от нее и начать показывать настоящие эмбеды. Что уж там, стало бы даже проще. Но на кону юзабилити и производительность.

Поэтому я предлагаю потерпеть еще немного, пока техподдержка ютуба не разродится ответом или мы не смастерим костыль, или что-нибудь еще.

Если хотите посодействовать, то нажимайте ПКМ на неработающих видео и выбирайте пункт "Troubleshoot playback issue". Сим победиши.

И так, кто живет на глубине озера Бросно пока неизвестно. Но все-таки понятно одно – оно там есть. И, возможно, когда-нибудь исследователи установят происхождение Бросни из Тверской области.