Разгоняем Twitch.tv

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



На дворе 2016 год, а сайт для показа видео до сих пор использует плагин Flash — это тормоза, постоянная подгрузка видео, и про многочисленные дырки в безопасности не забываем. Поэтому я сделал расширение для Chrome и Firefox, которое меняет стандартный проигрыватель Twitch на свой, более производительный и удобный. Моему проигрывателю не нужен Flash, для воспроизведения видео ему хватает возможностей HTML5. Расширение называется Twitch 5.

Выглядит проигрыватель примерно так:


Достоинства по сравнению со стандартным проигрывателем Twitch (Flash):
  • Выше скорость работы, если ваш компьютер и браузер поддерживают аппаратное декодирование видео.
  • Меньше остановок во время воспроизведения: при необходимости работу проигрывателя можно подстроить под своё Интернет-соединение.
  • На экране нет ничего лишнего. Включая рекламу. :)

Недоработки:
  • Для показа архивных трансляций используется стандартный проигрыватель Twitch (Flash).
  • Могут встречаться ошибки.
  • Только русский язык.

В общем, объявляю начало полузакрытого бета-теста расширения. :) У меня расширение работает нормально, интересно проверить с другим железом и операционкой.

Пользователи Chrome версии начиная с 43 (а также пользователи некоторых других браузеров на движке Blink с поддержкой H.264 и AAC, например Opera и Vivaldi) могут установить расширение Twitch 5 здесь. Если не ошибаюсь, в Chrome 45 не работало аппаратное декодирование видео, советую эту версию обновить. Chromium не умеет воспроизводить H.264 и AAC, поэтому расширение в нем работать не будет.

Пользователи Firefox версии начиная с 42 (начиная с 43 для Linux) могут установить расширение Twitch 5 здесь.




Замечание для тех, кто наивно считает, что в настольных браузерах Twitch.tv умеет показывать трансляции без Flash. Отключите в браузере плагин Flash и вы увидите черный экран. От HTML на Twitch-е только кнопочки. Единственный браузер, который сам умеет показывать HTML5 — это Edge в Windows 10. Но удобство просмотра у него еще меньше, чем у моего дополнения. Да еще рекламу с телеметрией резать нужно. :)
73 комментария
какие версии firefox поддерживаются? задумка неплохая,как выйдет релизная версия обязательно скачаю-попробую
а чего ждать? он уже сейчас нормально работает, по крайней мере у меня.
ждать релизную версию потому что 1) В общем, объявляю начало полузакрытого бета-теста дополнения. 2) Дополнение пока не доделано
Можно ли для тупеньких пояснить как оно должно работать? Я не особо интересуюсь всеми этими плагинами и надстройками для браузеров, но вот эта пригодилась бы. Я ее тупо ставлю и все работает само по себе или как? Как я пойму, что смотрю не через flash?
ставишь и смотришь.

понять просто — интерфейс проигрывателя (кнопки внизу) другой.
Я частенько смотрю твич, трансляции идут в html5 на гугл хроме без плагинов
не верю. какая версия хромого? какая операционная система?
сегодня попробую заскринить. SRware Iron последняя версия
ты так и не ответил на вопрос, фантазер. решил заскринить свою безграмотность?
зачем же хамить и грубить?
Уже наверно с пол года, как твитч вещает в хтмл5 и на своём сайте и на сторонних. Даже без в хода с аккаунта.
еще один... разницу между html кнопочками и html проигрывателем не знаешь?
Действительно, был не прав. На хтмл5, по умолчанию, проигрыватель.
работает номрально но нужен чат.
подожду пока чат будет.
Незачем ждать. Открываешь две вкладки стрима, одну оставляешь как есть, у второй из адреса удаляешь hls, тыкаешь в настройки чата и открываешь его в отдельном окне, закрываешь лишнюю вкладку стрима. Проблема только если ты постоянно прыгаешь по стримам и тебе будет впадлу каждый раз открывать чат заново
если я добавлю кнопку для открытия чата в окне, это будет норм или неудобно? я сам чатом не пользуюсь (и вообще на твитче нечасто), так что не все нюансы понимаю.
добавь конечно :)
это будет отлично — большего и не надо, откровенно говоря. Чат нужен редко, только когда ты на маленьком стриме со знакомыми. На стримах, где 30-40к народу чат просто помойка
добавил кнопку, которая показывает окно с чатом. кнопку на клаве для этого пока не выбрал, потому что все удобные кнопки вроде как заняты. :)

такой вопрос: нужно ли запоминать размер окна с чатом? это оказалось не так просто (безопасность в браузерах адовая).

вообще по-моему отдельное окно удобно, если в компе 2 монитора, иначе лучше сбоку его прицепить, как на твитче и ютубе. но это я позже сделаю.
очень желательно чтобы позиция запоминалась!
В Опере есть вертикальная боковая панель, так вот очень удобно когда чат на этом месте располагается.
добавил запоминание размера и местоположения чата
спасибо!
оно пытается, но при открытиии ошибается.
разворачиваю окно чата, как выше на скрине, который уже выкладывал, после закрытия и открытия получается так


впринципе и так хорошо. спасибо большое!
а если dpi в системе поставить стандартный (100%)? я в хромом проблем не вижу. но у меня win7, а не твой глюкодром.
>:(
ставить 100% не буду — геморой...
я же сказал меня и так устраивает более чем.
я немного изменил чат. стало лучше или хуже?
счас отлично! позиция запоминается. 
спасибо!
тогда владельцам оперы повезло. в хроме даже новый вариант подглючивает... у гугла с поддержкой dpi хреново.
Юзаю Tardsplaya, будет под новую Оперу с удовольствием протестирую
смотрел я Tardsplaya — ооочень неудобная штука. но технически сделано интересно, с моим mpc hc работало хорошо.

под новой оперой хромое расширение должно работать, если в опере есть поддержка H.264 и AAC. она там скорее всего есть. так что отпишись как заработает. :)
я под оперой сижу
я добавил в конец статьи пару слов о Flash.
Круто. В vivaldi работает. Ну по крайней мере что-то показывает в виде отличном от дефолта, а как узнать во flash кажет или html5, я не в курсе.

*ну и как обычно жжешь с кодом на русском :-)
	function ОбработатьWaiting()
Привет. Спасибо за дополнение.
К сожалению, на оперу 35.0.2066.37 не устанавливается (предлагает хром поставить).
Вивальди beta 2 — ничего не изменилось.
Chrome 48.0.2564.97m — тоже ничего не изменилось. Кнопочки нагрузка ЦП такие же :(
Все браузеры «чистые», т.е. только с этим дополнением.
Есть идея чего так?

W10 x64 со всеми обновками / G1840 / HD7770 /8GB — если вдруг понадобятся характеристики =)
у меня на оперу 35.0.2066.10  без проблем встало
странно, на хром как минимум должна встать. и количество браузеров впечатляет. :) firefox забыл.
На хром устанавливается, но абсолютно ничего не изменяется :(
Может какой-нибудь лог глянуть или что-то подобное ? Или где копнуть еще?

Та я те браузеры поставил просто что бы проверить =)
На лисе не проверял, ибо не хотелось, из-за упомянутых выше частых крашей.

Вот так оно должно выглядеть на хроме ?
Через закладки на канал заходишь? Добавь к адресу канала вручную /hls
Вот так: http://www.twitch.tv/названиеКанала/hls
Спасибо большое! Всё работает теперь :)
я бы никогда не догадался. :) не думал, что переход со сторонних сайтов и закладок сильно полезен. нужно будет подправить.
Секундочку.. Я так обрадовался работе плагина, что забыл комментарий дополнить свой :D
Когда плагин не работал, я не через закладки переходил. Просто ручками вписал в адресную строку и заходил на стрим :) Ну или через копипаст (к примеру http://www.twitch.tv/a1taoda)
Я вообще стримы чекаю (и перехожу на них) через Twitch Now. Так что было бы реально здорово не дописывать /hls каждому стриму :)
аналогично. Либо закладка, либо через адресную строку. Сам два дня думал, почему при первом тесте работало, а потом два дня не работало ни в одном браузере. А всё дело в том, что тот стрим, который у меня в закладках, оффлайн был в момент первого теста и пришлось искать на твиче что-то живое. На следующий день стрим из закладок уже живой был и на нем тестил. Как на зло вивальди перед этим обновился и думал как-то с этим связано, что перестало работать. Но во всех браузерах не работало, потом твой пост увидел, потом опять стрим оффнулся и пришлось новый для теста искать, на котором магическим образом всё заработало. Так и допёр до причины
прикрутил поддержку перехода с других сайтов и закладок. таким образом загрузка удлинняется где-то на пол-секунды, так что лучше ходить по прямым ссылкам. хотя не исключено, что эти ссылки (/hls) скоро придется изменить...
прикол. разбираю пришедшие отчеты об ошибках и вижу, что у нескольких челов дополнение не запустилось, потому что на компе неправильно установлено время (или дата, или часовой пояс). видимо любители кривых кряков. :)
последняя версия 2016.2.29.1, в опере окно чата кидает вправо, т.е. тоно так как это делает стандартный плеер твича :(((
могу сделать, чтобы чат открывался сразу в отдельном окне если щелкнуть по кнопке средней кнопкой крысы.
если не трудно, то было бы здорово.
до сих пор не работает :(
Пользовался примерно неделю, все было отлично, пока Хром не обновился до 49 версии.
Во первых — элементы управления стали прозрачными, во вторых — при разворачивании на весь экран плеер в ширину уменьшается и получается, как будто смотришь видео с соотношением сторон 4:3. Почините пожалуйста.

Уже починили, оперативно =)
Добрый день! Спасибо за Ваш труд!
Подскажите, можно ли как-нибудь сделать просмотр информации которая под стримом (обычно там кнопки с донатом, биографией и тд)
Спасибо!
жми кнопку flash и читай. в свой проигрыватель я это вставлять не планирую.
почему ты не нашел эту кнопку? может мне ее переместить в другое место? например, в виде ссылки. я прям не знаю. :)
я нашел эту кнопку сразу )))
но хотелось бы просто проскролить мышкой вниз и нажать кнопку для доната например, без лишних телодвижений.
хорошие новости для владельцев firefox. я наконец-то нашел причину, по которой он не показывал некоторые трансляции. firefox (почти) не виноват. это трансляции глючные. я их попробую исправить.
Отличное расширение :)

В одном обновлении чат стал открываться не отдельным окном, а сбоку от плеера. Почему-то к чату сбоку не хотят применяться другие расширения хрома (BetterTTV — популярная штука).
Но даже если починятся, всё равно я пользую только чат в отдельном окне :( Конечно, его всё ещё можно всплыть самостоятельно из бокового и закрыть панельку, но «одной кнопкой» было сильно удобнее. Вернёте опцией? =)
на хабре обсуждение возникло — нужен флешъ или не нужен
- https://habrahabr.ru/company/vivaldi/blog/282463/#comment_8871516
Как убрать гребаные полосы сверху и снизу на фулскрине? (с этим разобрался, нужно увести курсор вправо, не вниз и не вверх, но хотелось бы , чтоб оно само исчезало)

И стоит ли ставить двухпоточную загрузку при АДСЛ 10мбит?

Положение статистики сбрасывается при новом открытии стрима.

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

Еще если возможно, то было бы круто вывести разрешение, битрейт и фпс на верхнюю панель, чтоб не тыкать постоянно статистику только для этого.
Как убрать гребаные полосы сверху и снизу на фулскрине? (с этим разобрался, нужно увести курсор вправо, не вниз и не вверх, но хотелось бы , чтоб оно само исчезало)
это я специально сделал. но пожалуй уберу, не пригодилось.
И стоит ли ставить двухпоточную загрузку при АДСЛ 10мбит?
этого никто не знает.
Еще хотелось бы отдельную кнопку внизу для включения статистики, т.к. она нужна гораздо чаще, чем изменение параметров скачивания стрима.
отдельная кнопка есть на клаве.
Положение статистики сбрасывается при новом открытии стрима.
да. и что?
Еще если возможно, то было бы круто вывести разрешение, битрейт и фпс на верхнюю панель, чтоб не тыкать постоянно статистику только для этого.
зачем тебе постоянно смотреть на эти числа?
зачем тебе постоянно смотреть на эти числа?
если полоска будет нормально скрываться, а не как щас, то в начале стрима я часто чекаю качество стрима, т.к. оно весьма разнится, кто на что горазд: битрейт 2-5, фпс 30-45-60. А на название стрима тоже постоянно смотрят каждую минуту, судя по логике?

В общем я понял, что чтобы похавать за столом надо доказывать, что ты не жираф, ведь есть вещи поважнее, бттв например. И нельзя делать всего понемногу, надо .Снизу полоса вообще пустая, нет, я должен тыркать кучу кнопок, чтоб глянуть фпс битрейт и разрешение. Ну подскажи хотя бы хоткей, раз энтузиазм иисяк даже на подруб БТТВ.
то в начале стрима я часто чекаю качество стрима, т.к. оно весьма разнится, кто на что горазд: битрейт 2-5, фпс 30-45-60
качество и так видно, без статистики.
В общем я понял, что чтобы похавать за столом надо доказывать, что ты не жираф
в подсказке написана кнопка, ты ее только сейчас смог найти. то есть ты не можешь разобраться в простых вещах, но при этом любишь давать советы. сам понимаешь, ценность твоих пожеланий для меня, скажем так, не слишком высока. и аналогия про стол неудачная.
Снизу полоса вообще пустая
я знаю чуваков, у которых вся панель задач значками забита (которые справа). коллекционируют. :) еще есть чуваки, которые в играх всегда выводят параметры железа на пол-экрана. нам такой хоккей не нужен.
подруб БТТВ
этот бттв даже в лисе настройки сохранить не может. да и само расширение написано как попало. не хочется всем такое пихать. разве что настройку добавить.
да тебе самому аналог бттв по силам сделать, мне кажется. Там элементарные навороты для разбирающиего в  этом деле человеке:
— даблклик по нику для вставки его ника в окно чата
— подсвечивание если тебе пишут, и закрепление этого на одну минуту
— полное окно смайлов
остальное особо нафиг и не нужно.

Значит в расширение больше ничего не будет добавляться, раз порт бттв не прокатил? Если бы такой же минимальный функционал был бы добавлен, то твое расш-е стало бы номер 1 для просмотра на твиче, т.к. в разы лагов стрима, и они моментально проходят, даже при размере буфера в 6 секунд. Плюс остановок не происходит, что надо самому заново врубать стрим. Народ бы бещщщеенное желание имел задонатить за безлаговое и быстрое расширение, и я в том числе, т.к. бттв тормозная какая то.

А насчет качества все равно не согласен. Вот на ютюбе есть значек даже , какое качество играет в настоящий момент. Много моих знакомых так же проверяет качество на ютубе и фпс.

 
я знаю чуваков, у которых вся панель задач значками забита (которые справа). коллекционируют. :) еще есть чуваки, которые в играх всегда выводят параметры железа на пол-экрана. нам такой хоккей не нужен.
ну тут несколько символов то всего надо добавить, ведь реально нужная вещь, не менее важная чем кол-во зрителей и время стрима. 
1280-720p60 3.8mbps   — это пол экрана?  19 символов, все .

Игра: Counter-Strike: Global Offensive Зрителей: 8835   и то больше места занимает
А насчет качества все равно не согласен. Вот на ютюбе есть значек даже , какое качество играет в настоящий момент. Много моих знакомых так же проверяет качество на ютубе и фпс.
это разные вещи. ты уже доводы из пальца высасываешь.
еще размер плеера в оконном режие подстраивается под размер браузера, если в фуллхд обычный твич имеет 1280 точек, что совпадает с большинством  1280p60 стримов, то твич5 разворачивает до 1580 точек, и картинка апскейлится и еще больше мылится еще раз после того , как ее задаунскейлили в броудкаст клиенте. Так вот неплохо бы в оконном режиме иметь возможность ставить оригинальное разрешение стрима
опа, полосы стали уходить, нормас теперь, а то бесило. спс
MP3, 44.1kHz, 320kbps, Stereo — от этой фразы мелким шрифтом в проигрывателе Аимп у тебя тоже эстетическая агония?
1. на твиче 95% трансляций такого качества, что замыливание даже на скриншотах не видно. 2. чаще всего высота 720, нет смысла уменьшать, мелко. еще встречается 1080. но моников с большой диагональю и высотой > 1080 мало. так что не вижу смысла.
замыливание 1280>1580 видно невооруженным глазом даже если об этом не думать, оно сразу бросается в глаза. Почему то твич и ютюб в оконном режиме юзают оба 1280 по ширине и никому блин не мелко — либо нативное 1280 либо растянутое 1920 смотришь. А у тебя ни рыба ни мясо Логика майкрософта короче (
1280 > 1580 — это не мыло, а законы физики. замыливание сравнивают 1280 > 1283.
ютуба — не икона. :) если так нравится мелкая картинка, то можно уменьшить окно браузера.
да я уже давно понял, что нихрена функционала больше добавляться не будет, т.к. за несколько месяцев только полоски были пофикшены по ходу, и остается ждать, пока твич сам введет хтмл5
нашел хоткей
Вроде как в FF48 планирует включить поддержку WebExtensions. Планируете портировать расширение из Chrome в FF?
зачем что-то «портировать», если расширение для FF уже есть?
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.