First H.264 demo in Flash Player 9
UPDATE: I’ve placed some more advanced and improved Streaming Demos on our company website: Check out http://slot3.com
Today Adobe released a new Beta of Flash Player 9. The new update, wich is code-named Moviestar by the way, now supports MPEG-4 playback. That means, that you now can use the Flash Player to playback H.264 encoded files. Wow! There hasn’t been a change in the API, you use the NetStream class as you would with FLV.
Here are a few posts, where you’ll get more detailed information on that.
But now the fun part. The following is a video clip I’ve recorded earlier this year on Corsica, France. It is an MP4 file with AAC audio codec.
YOU NEED THE NEW FLASH PLAYER 9 UPDATE 3 BETA 2 TO SEE THE VIDEO BELOW
H.264 Video in Flash Player – Demo 1 – 576×320 (1.2 MBit/s)
H.264 Video in Flash Player – Demo 2 – 1280×720 (6 MBit/s – huge video file – small pipes may suffer
)
H.264 Video in Flash Player – Demo 3 – 576×320 (800 KBit/s)
H.264 Video in Flash Player – Demo 4 – 432×240 (400 KBit/s)
Music is made by Patric la funk, if somebody is interested
Edit: What I really did not expect is, that the performance on my Mac is pretty cool.. That is the way how the Flash Player should play videos!!!
Edit 2: I don’t know where the green bar in the small demo is coming from. It’s not in the mp4 file, which you can find here
Edit 3: Sometimes the video looks a bit jumpy.. Right now, I don’t know where this comes from. could be the wrong encoding or the flash player. any hints or recommendations are appreciated.
1.
Comment by Steve Paine:Nice demo!
Whats the bitrate of the small file?
Steve.
2.
Comment by Marcel:It must be something around 1.2 MBit/s which is actually pretty high for such a small file.. Right now I’m playing around a bit with different bitrate.. I’ll upload some more demos soon..
3.
Comment by Steve Paine:That would be great. WOuld love to see something around 400kbps (youtube type bitrate) with 320×240.
Steve
4.
Comment by Marcel:Aye.. gimme a couple of minutes. Fortunately encoding goes much faster than in VP6
5.
Comment by Dave:I’m getting the same green bar, btw. Use qt-faststart on these so the videos will start playing immediately!
6.
Comment by Steve Paine:Excellent. Have posted a link to here from my site.
http://www.umpcportal.com/modules/news/article.php?storyid=839
Steve.
7.
Comment by Marcel:Thanks Steve.. The other demos are online, too.. Tomorrow I’m going to play around with seeking
@Dave: Oh, good hint. Thanks.. I’ll do that and upload again.. but not now, its getting late here in europe
8.
Comment by Steve Paine:Yup. Its getting late. Just testing the 400kbps version on a 600Mhz AMD Geode-based UMPC!!!!
….
….
No chance!
Now testing on Intel A100 600Mhz (with GMA950)
..
..
mmm. Doesnt work in ie7. Might be a security issue.
Will let you know how I get on.
Steve
9.
Comment by Steve Paine:400kbps worked under FF on the 600Mhz A100 processor but was jerky. 800kbps worked better.
1.2Mbps tops out the processor.
I get the feeling that 500kbps YouTube files in H.264 are going to be nice!
Thanks for the test files.
Steve
10.
Comment by Illidan:What do I need to do to actually host flash files on a website? I can encode to x264/AAC mp4s easily, but how do I turn that into a flash-compatible file / put it on a webpage? Thanks for anything
11.
Comment by Marcel:Hey Illidan,
if you have encoded them like this. they already are flash compatible. You can trigger these files using the NetStream Object like you would for FLV Files. For example:
var nc:NetConnection = new NetConnection();
nc.connect(null);
var ns:NetStream = new NetStream(nc);
ns.play(”bonifacio-576.mp4″);
12.
Comment by hulda:I’m using Jeroen Wijering’s player ( http://www.jeroenwijering.com/?item=Flash_video_Player ). It’s easy to set up even if you don’t know the first thing about Flash, and it’s javascriptable. It plays mp4 files if you rename them to flv.
13.
Comment by ruben:Hi,
What settings and what program did you use to encode to the right format?
Regards,
Ruben
14.
Comment by Marcel:Hi Ruben,
that was a quick and dirty shot out of Adobe Premiere using the Adobe Media Encoder. There I’ve chosen the h.264 codec with different bitrates and resolutions.. The outcome so far is not very satisfying.
Right now I’m exporting the HD Movie to an Raw AVI to try different encodings software like Episode pro or Carbon Coder to find out if it’s the player or the encoding causing the jumping frames..
15.
Comment by ruben:I tried using Media Coder but this piece of software constantly hangs if I choose h264 for video and AAC-HE for audio and for muxing I use MP4Box.
16.
Comment by Kosso:Hi,
Good demos! Thanks.
Dave mentioned the use of qt-faststart in his comment:
If he’s reading, or anyone else knows, what is the option to set in the ffmpeg command to turn this on?
I *think* I have it installed. I definitely have the qt-faststart.c libs
thx
17.
Comment by Illidan:I use Super (all in one encoder) for most videos, Handbrake for DVD isos. The Jeroen player worked for me re: putting the video up. Netstream didn’t.. maybe googlepages filters it out somehow? Either way, thanks for the help, all.
18.
Comment by ken:Can the Flash player play a “bare” .mp4? If I link to an .mp4, can the user have Flash set to playback that file (probably without a controller, but still…). If not, then, while this may mean a lot for users of Flash to be able to create one “source” file, users will still be locked into Flash if it requires a .flv player and will have no option other than QuickTime if they want to view H.264 encoded .mp4’s.
In my view, compatibility is when you post an H.264 video and I can play it back in QuickTime. If you still have to post “MUST USE FLASH PLAYER”, then to me it’s no longer .mp4.
19.
Comment by Marcel:Ken, got your point, but the Flash Player is not a Media Player comparable to Quictime or Windows Media Player. It’s “just” a runtime environment were people can build their own media players with custom functionality, lookandfeel, etc..
There are a few standalone-doubleclickonfile-players out there, for example this one here: http://www.martijndevisser.com/blog/flv-player
I think there will be updates on these players to enable them to play mp4 files the same way they do flv.
What could be difficult is, when you enter a direct link to an mp4 file into your browser that a flash powered media player opens in your browser window for playback instead of quicktime or whatever..
20.
Comment by Steve Elbows:Regarding performance issues:
Adobe have done some wonderful hardware acceleration in fullscreen mode. If I look at their sample h264, it uses less cpu in fullscreen mode than it does in normal mode.
However, CPU use is much higher at the momen if I use the excellent JW player, by renaming .mp4 to .flv.
I am assuming this is something to do with either fullscreen method, or various video settings int he actionscipt, such as smoothing, deblocking.
So you may want to add fullscreen mode to your player and see if the video runs smoother for you, comparing CPU use to adobe’s example to see if youve got the right settings to enable hardware acceleration.
21.
Comment by Steve Elbows:Oh here are my early tests to back the above up. Both are playing the same video, a 960×540 25fps 2000kbits h264 video…
Using the same code as adobe’s sample:
http://www.unquack.com/fullScreenSourceRectDemo.html
Using JW player with .mp4 renamed to .flv:
http://www.unquack.com/jw.html
There’s a small difference in CPU use between the 2 in normal mode, a huge difference in fullscreen mode.
22.
Comment by Marcel:Wow, really cool. Performance is really good here and feels smoother in fullscreen. gerat stuff.
what did you use for encoding?
23.
Comment by Steve Elbows:I made that file a few years ago, I probably used quicktime pro. Its not a very good video really, all sorts of horrible interlace artifacts when I move the camera, I’ll do something better later.
Ive managed to get better fullscreen performance out of jw player than I had previously, by removing a few lines of code:
http://www.unquack.com/jwmod.html
But it still uses a lot more cpu than adobe’s sample. I havent documented my changes yet as they are very crude and Im sure authors of video player swf’s will optimise their stuff sooner or later, in a better way than I can maange with my feeble skills.
24.
Comment by Dgi:Just remember that renaming .mp4 files to .flv is not good solution in the long run. It causes confusion if people download videos with wrong extension and try to play those on desktop environment.
Eventually all flv-media player components will support .mp4 extension and if not, you can write directly to the author ask him to fix it.
25.
Comment by Dave:Re: qt-faststart: even though it’s included in the ffmpeg distribution, it doesn’t seem to get built in as an option while generating mp4s. I just built the binary (make qt-faststart in the ffmpeg build directory) and ran that on my mp4s (qt-faststart in.mp4 out.mp4)
26.
Comment by Steve Elbows:Yes I am dead against renaming, Im only doing it in these early days, as its bad practice and the last thing we need is more confusion with video formats.
27.
Comment by Stephan:Just tried out the JW player with a 1080p H.264 movie, it played back, but 2 issues: Massive CA, the color layers are not on top of each other at all, and the video didn’t play back smooth, it does, however in Quicktime. The camera used for the 1080p by the way was a Sony F950, so the beginning quality should be perfect. Data rate is 1922.42kbps (according to QT), 23,98fps.
I have reencoding it to 720×405 and 768kbps video, and trying again. Export using QT7 Pro and the MPEG4 option, but it still had these massive aberrations. It played back smooth, though, inside the browser, and in fullscreen.
the same was true for a differen video, also preencodet in MPEG4/H.264 (handbrake), when exported using the iphone setting in QT Pro. JW player played it with the .m4v extension, though, so no need to change m4v to flv!
I later found out that the issue was with JW FLVplayer 3.11, and a modified verion of 2.4 (blip.tv) played it back flawlessly, with the .m4v extension, and even .mp4.
28.
Comment by charles:The green bar you are seeing is an issue with the MainConcept decoders. The MC H.264 decoders that Adobe has licensed are great for their ability to handle so many varieties of H.264 and for how well they perform, but there are unfortunately still a number of decoding (and encoding)bugs that they haven’t ironed out.
We have a number of decode bugs open with MC at this time. Generally, the time for them to fix the bugs we have reported has been around 4 – 8 months. We just reported this and another involving chroma playback problems with HP/HL encodes. Good news is though, this hasn’t always been a bug with MC (in fact, I think when Elecard was writing their decoders was when it was OK) so the fix may come sooner than usual.
29.
Comment by cube:Jeroen’s player just got an update to 3.10 which supports mp4 now!
30.
Comment by cube:sorry… redundant. see #27
31.
Comment by Stephan:actualy, it’s at version 3.11, but see for yourself: http://i9.tinypic.com/4znwjyt.jpg
version 3.2 wouldn’t play the .m4v file, so I didn’t include it.
32.
Comment by Steve Elbows:3.11 of Jeroen’s player is good, but if my cpu load is anything to go by, it isnt using the HW accelerated fullscreen mode yet.
33.
Comment by cube:btw: just an idea since I often blog with my mobile via postie (supersmart wordpress plugin!). My Nokia E70 records movies in mp4… thinking of mobile video-blogging and will give it a try. If anyone is interested I will publish my results here.
34.
Comment by wildex999:You need the video to be encoded in pure X264(NOT pure H264) for it to don’t look jumpy.
35.
Comment by Steve Elbows:Here is a version of JW media player that I modified (badly) to use fullscreen mode. It doesnt work right in various ways, but it does make nice low use of CPU in fullscreen mode. Jeroen is waiting till the new flash player is released n final before adding this acceleration, I believe: http://www.unquack.com/mediaplayere.html
cube, its a nice idea but will probably run into some problems with most devices recording the older mpeg4 not h264, so compatibility with flash not guaranteed. I tried with the 640×480 type .mp4 that the nokia N95 can record, and it didnt work, got sound but no video. The N95 can play h264 but I think it only records to older mpeg4. But maybe I did something wrong, or this will be improved in future, but it may not, still I suppose eventually more devices will record to h264 anyway.
36.
Comment by digital in London » Blog Archive » Flash is going hi-def:[...] http://marcelfahle.com/2007/08/21/first-h264-demo-in-flash-player-9 [...]
37.
Comment by matt:What were the settings you used to export out of premiere. I created a MP4 v2 and this will not play back in Flash using a netstream. I can make mov’s play fine.
38.
Comment by Rafeo:Hey I couldn’t play de video! I tried something like you said :
import flash.net.NetConnection;
import flash.net.NetStream;
import flash.media.Video;
var vid:Video=new Video();
var nc:NetConnection = new NetConnection();
nc.connect(null);
var ns:NetStream = new NetStream(nc);
vid.attachNetStream (ns)
addChild(vid);
ns.play(”http://marcelfahle.com/video/h264/bonifacio576/bonifacio-576.mp4″);
Must I make anything else?
Thanks!
39.
Comment by Basti:I tried a demo too after i saw yours with the following result:
http://www.navision-blog.de/2007/12/07/h264-video-mit-fullscreen-flv-player-2/
To try the video you have to click “Hier Testen” because the website is in German.
40.
Comment by H.264:Ya its great evolution and initiative by adobe to integrate H.264 with flash