

Tell HN: Couldn't Sleep Last Night, Wrote a (No-Flash) HTML5 Viewer for YouTube - ComputerGuru
http://neosmart.net/blog/2009/watch-youtube-videos-in-html5/

======
ComputerGuru
I was bored last night and browsing YouTube in bed on my MacBook, and as
usual, when I reached an HD video the fans kicked in and the laptop got hot.
Since YouTube now stores the .mp4 version of (most) videos on their servers, I
figured it was inevitable that someone had coded something or the other to
take advantage of it and view them in streaming format via HTML5 video
containers.

When I didn't find one I wrote this instead. It's really basic, but it gets
the job done. Give it a YouTube link and it'll display the HTML5 video. The
userscript adds a link to the HTML5 viewer for all video pages on YouTube.

~~~
tsuraan
I'm not having any luck loading your page, so maybe it's explained there, but
how do you get to the .mp4 version of a file? pwnyoutube often works, but it's
also often down. I'd love to just be able to download the video and watch it
locally, if the .mp4 link allows that.

~~~
dreish

       javascript:(function(){url='http://deturl.com/download-video.js';document.body.appendChild(document.createElement('script')).src=url;})();
    

I've never had a problem using this.

~~~
louislouis
sexy!

------
rufo
If you haven't seen ClickToFlash yet, it can transparently replace the YouTube
flash player with an HTML5 <video> element in Safari:

<http://rentzsch.github.com/clicktoflash/>

~~~
swombat
From that link:

"Block evil Adobe Flash"

Great, more ideologists.

~~~
wtallis
Aren't there enough objectively bad things about Flash to justify summarizing
it as "evil"? It does so many bad things to a web site's accessibility,
usability, download size, security, and performance that anybody with a
genuine interest in making the web a better place should be encouraging
migration to the open standards based alternatives. Now that HTML5 features
are available, it seems that the only significant things Flash has going for
it are a large install base and a decent authoring tool.

~~~
swombat
There's enough bad things about almost any good thing...

I use Flash (Flex, actually) for my company's website and it works very well
for us. Blanket-labelling it as evil is just silly. Flash is no more evil than
a hammer.

------
drawkbox
Google/youtube beat you to it in April: <http://www.youtube.com/html5>

Must be viewed in Chrome Also show a video of their O3D technology, similar to
WebGL.

~~~
ComputerGuru
That's just a sample. No way to load other videos in the HTML5 viewer.

fyi, the link works great in Safari.

~~~
drawkbox
True. But the player code is all there. It should work in any html5 enabled
browser (Safari 4, Chrome, and FF 3.5) although FF 3.5 is having some issues
with it.

This does highlight one problem with html5 based video, different browsers
will interpret it differently no matter how hard standards are pushed. Flash
video (FLV) saved us from that and all the horrible players like Real Media,
Windows Media and Quicktime by being consistent and working across all browser
as long as you have the plugin.

------
ComputerGuru
OK, it's going to be super-slow right now because it's already been
slashdotted.

Don't know why it's taking it down so badly, MySQL has been acting up for the
past fortnight :S

EDIT: Just swapped services (from Apache to IIS) and it looks like
everything's doing better.

------
spazmaster
Very nice! Just watched Did you Know 4.0 in HTML5 and the activity on the CPU
on my MBP was super low, unlike when watching it in Flash. Thanks for staying
up the night!

~~~
ComputerGuru
Thank you! and you're welcome :)

------
yesimahuman
This seems cool. It's not working for me though, the video never plays and the
track scan and volume buttons have a blue border around them. I'm on FF 3.5.5

~~~
ComputerGuru
You need to manually press the play button. The numbers are a lie (0:00/0:00)
and the blue border only appears in FF (silly thing requires a border=0 which
I'll add later). It may take a while on slower internet and some videos do not
have an MP4 upload on YouTube. However, the YouTube slider _does_ work and you
can use it to skip to any part of the movie.

~~~
mlLK
Only browser I got your app working in was Chrome. What browser were you
primarily testing the application in? What version? Because Firefox just
released an update this morning and it could very well be the culprit.

I not only could not get Firefox (3.5.5), IE7, or Safari to work with your
HTML5 YouTube app, but I could not get YouTube's app to work either; I hope
this fact mitigates your worries.

~~~
ComputerGuru
Main development was with Safari, WebKit, Chrome, and Firefox on OS X.
Couldn't get it to work with Camino.

Tested as well on Chrome for Windows. Of course, Internet Explorer doesn't
work.

EDIT: Sorry, guess that's the effect of an all-nighter. It actually doesn't
load in Firefox for me, either.

~~~
mlLK
Well I'm not gonna blame you for it not working in Firefox. I've actually had
to re-write client-side code (generally just quick hacks, similar to your
project) solely for Firefox patching some sort of quirk or behavior change
into their browser. It can get especially annoying if you're always testing
with the most recent version.

Nevertheless its a neat app. ;)

------
r11t
Here is a browser bookmarklet for your Youtube HTML5 video viewer :
<http://gist.github.com/229475>

------
chrischen
This is really cool. And I have a question about HTML5 video in general: how
would an HTML5 player prevent users from messing with ads if it were used by a
site like Hulu?

~~~
kwamenum86
HTML5 video is not supposed to be used for video streaming at all. I think it
is doubtful that companies with the concerns you described would use the video
tag.

~~~
rimantas
What makes you think so?

~~~
kwamenum86
What makes me think HTML5 is not for streaming? Streaming video technology
works differently.

What makes me think companies with the concerns outlined by the OP would not
consider HTML5? It would be much more difficult to control their content.
Flash is great as a hard to penetrate content container. Exposing your content
by using HTML + JS to display it is less than ideal if you want to serve
ads/make it difficult to steal content.

~~~
chrischen
<http://www.youtube.com/html5>

Youtube streams the file. Youtube also serves ads. Youtube, as exemplified by
the OP and by my link is experimenting with an HTML5 player. But you are
right. HTML5 has this problem of exposing the player, so any mechanisms in the
javascript to force ad viewing can be more easily defeated.

A possible solution would be to track user session and force a new ad on every
new session (so you can't clear cookies). That way ad tracking can persist
outside of the video player itself by using the cookie.

The other problem is, who serves video files themselves anymore? So if
Youtube, or any other video services who depend on _ads_ to keep themselves
afloat can't use the HTML5 video tag, who will?

~~~
kwamenum86
Who will? Anyone who wants to serve video without interstitial ads. Think
about the world before Youtube-like sites. How did we embed video? Often times
hosted on our own servers. If I want to serve up a dynamic video for example,
right now Youtube-like services do not allow me to do that. I think dynamic
video is a great use case for the video tag e.g. splicing a use photo into
video.

It seems to me that unless the ad is prepended to the actual video file then
using javascript we can tell when an ad is playing and kill it/skip to the
"real" content. On the other hand the average user probably does not have the
expertise to kill ads, so maybe the point is moot.

~~~
chrischen
Yes but someone can easily make a browser extension that kills it for them.

Or use firebug and inject javascript into the page.

I think people stopped embedding videos and started using third party tools
because it makes it _easier_. Third party tools will always make it easier. No
need to worry about bandwidth, file space, etc (even if the cost of these
items are going down). And as long as these tools make it easier, these tools
will probably want control of their players and will want to put ads in them.

------
gcanyon
On my macbook, using this viewer causes Safari to take about 20% CPU. Same
video using flash takes about 13%. Flash doesn't seem to be CPU-evil on my
machine.

------
JMiao
thinking it would be nice if you also let us view a random video link rather
than find/copy/paste.

------
radley
A crow eating a dead rat? (Zhuangzi)

