Home > Video > Flash + H.264 = H.264 squared

Flash + H.264 = H.264 squared

Despite all the fruitless discussions about the clash between H.264 and Flash (which you know are simply FUD, being H.264 a codec and Flash a platform) , I think instead that H.264 and Flash form a wonderful duo. Fortunately enough I’m not alone if a giant like Hulu (over 500 million streams per month) has declared HTML5 to be too young to be used in scenarios where monetization is a key factor. This will probably change in the future, but by now only a plug-in like Flash (or possibly Silverlight) can assure the performance (dynamic streaming), the security (DRM or RTMPe) and the control (Monetization and Reporting tools) in video delivery.

Furthermore, the control over the streaming parameters and how the video is displayed on stage are two invaluable key factors for maximizing the QoS in video streaming.

With this Article I want to show exactly this:  Flash + H.264 = H.264 squared

You know that I like to push the limit of H.264, trying to find the best processing chain to obtain HD quality at a fraction of the usual bandwidth.
If you are a reader of my blog  probably remember my several tests (here you find a list of the most popular) where I showed HD (720p) contents encoded at very low bitrate like 500Kbit/s.

Ok, this time, I want to show you what is possible to achieve exploiting synergies between Flash and H.264.
In the video below you can see a HD* video encoded at … (drum roll prease) … 250Kbit/s!

* In my next post I’ll explain how Flash can be used to enhance video quality and obtain a result like this. In the meanwhile let me know what do you think about the quality / bitrate ratio of the video. Remember that obviously we are talking about a video that is using only 250Kbit/s, 8 times lower of what YouTube uses for a video like that and half the bitrate I used before in my extreme tests. So despite the inevitable loss of detail, I would draw your attention on the reproduction of film grain and on details of the text.

Dued to post processing, a fast computer is required, expecially at full screen where an upscaling schema is applyed. On Windows there’s no problem (I tested it also on a Pentium4 2.4 GHz), on Mac I suggest to update both Flash Player and Safari.

Categories: Video Tags: , ,
  1. seth
    18 May 2010 at 8:02 pm

    Ok, its awsome, but how to do it. When i put h264 in flash it looks terrible. Whats the trick?

  2. 18 May 2010 at 9:07 pm

    Wow, wow & wow! This is mighty impressive. Doesn’t look like a standard Episode conversion to me🙂.
    2.9Mb for 84 sec of video?? OMG… that’s … that’s amazing! WTH did u do to archieve this mighty world record? I’ve got a 3 Ghz Intel Core 2 Duo with 4Gb RAM, with a NVIDIA GeForce 9600M GT card and it’s running smoooooooth.

  3. 19 May 2010 at 3:42 am

    impressive. But with any H.264 tests I’ve done the same caveats apply. You need to test on a variety of target machines. Not all viewers will have less than 2 year old machines with fast cpu’s, and this example simply won’t play smoothly on an older machine.

  4. Hans Dampf
    19 May 2010 at 10:30 am

    awesomme quality! can’t wait to see how you did this.

  5. M.
    21 May 2010 at 12:21 am

    Not bad Fabio – congratulations.

    Catchword Keyframes?

  6. 21 May 2010 at 10:58 am

    I am really impressed, as someone always on the lookout to make my videos better I would love to know the how to.

  7. 21 May 2010 at 11:31 am

    lots of subtle movements and quick color changes, without much compression artefacts, almost none actually. good job. are we to understand that the post processing is done within the flash container/player and not with a post compression tool?

  8. 21 May 2010 at 11:35 am

    Awesome!!! respect and please do post how to do it… thanks!

  9. 21 May 2010 at 1:46 pm

    Hi Fabio, That’s very impressive. 250Kbit/s! Wowsers. And yet I had noticed the film grain effect, which was nice. Very smooth and great quality for such low bandwidth. I’m dying to find out what your secret was. Please tell us in your next post like you promised.

  10. Percival
    21 May 2010 at 8:08 pm

    Really, Really, Awesome! I can’t tell you how many times I viewed the source mp4 in quicktime and compared it to the post-processing going on in the browser. Its amazing how you increased contrast, added saturation, sharpness(especially in the copy) and added the subtle film grain. The only thing I noticed is that the film grain keeps its movement even when I pause the playback.

    But WOW, this is really awesome for 250!

  11. sonnati
    22 May 2010 at 2:34 pm

    Thank you guys, I’m just preparing the second article.

  12. CraigF
    24 May 2010 at 3:23 pm

    Amazing… can’t wait to see how you achieved this!

  13. 25 May 2010 at 1:09 am

    I’ve encoded a few videos myself recently in H.264 at 250Kbit/s and to compare to yours and it really is amazing. Can’t wait for your next post.

  14. 25 May 2010 at 10:47 pm

    Really nice. Video is playing smoothly. I have iMac 3.06Ghz Intel Core 2 Duo, 4GB of RAM. Activity monitor is showing above 100% CPU usage.
    Playing with Pixel Bender filters ?

  15. 26 May 2010 at 10:13 am

    Yeah, my CPU hovers around 90% – 97% when the video is playing.
    I have, Win XP (SP3), Intel 3GHz Pentium 4, 3GB RAM, ATI Radeon X600 256MB.

    • sonnati
      26 May 2010 at 10:17 am

      It’s not a bad result. It is probably a 4-5 years old cpu.

  16. 26 May 2010 at 10:28 am

    Hi Fabio, Don’t get me wrong. Like I said in my original comment above (21 May 2010 at 1:46 pm). I think what you have acheived is very impressive! I’m still looking forward to hearing how you did it.

  17. Nylton
    29 May 2010 at 8:42 pm

    Hello Fabio’ from Brazil, more than two years I follow your posts, they help me a lot in studies of streaming, however until today I have had more interest in how you get a quality video incrívbel so as always keep tracking until you post details on how to …

  18. 9 June 2010 at 2:59 pm

    Hi Fabio,

    I’am impressed. It is a very scharp flash film.
    Do you work in FC ore Premier etc?
    and can you tel me what the procedure is, to get this quality?

    Thanks from Holland,

  19. 11 June 2010 at 7:09 pm

    Hi Fabio,

    We are trying to optimize video encoding. Could you please recommend encoding settings for premium video portal? Especially for very low bitrate like you have shown and HD quality for extra experience?

    Thanks, Denis.

  20. 8 August 2010 at 6:23 pm

    Hi Fabio,

    When u want to update with second article? Can’t wait! I really want to know on how u do this with low bitrate.

    Fairu from Malaysia

    • sonnati
      12 August 2010 at 8:14 am

      I’ve been busy. I hope to publish the second part in september

      • Stefan
        19 August 2010 at 6:04 pm

        Really Nice results. I think you used some pixelbender filters for the post processing. Can you maybe publish them?

  21. 28 August 2010 at 5:49 am

    I’m sorry to say but I’m not impressed with the quality one bit. I guess it depends on what you’re used to. When examining a video for its picture quality looking at text does not tell you anything. Look at complex things like people’s faces and the clarity of their features and shadows on parts of their faces or something similar. When you understand the codec, you know it’s flaws and so you know where to look or what to look for.
    Flash player per-se does nothing special and definitely not anything more than Windows Media player or Quick time and both these players are far superior to Flash player. As someone who is completely immersed in H.264 and video encoding and with an in-depth knowledge and understanding of the codec and its various switches I can tell you, that any quality is due to the H.264 codec. Also you should know that Flash media encoder does not surface many of these options, so if you’re using Flash media encoder to encode your videos there is no “magic” here.
    The source of your video is obviously good quality to begin with. But leading people into believing that this video and any video from Hulu or YouTube for that matter is “HD” is completely wrong in my humble opinion. HD is not just about dimensions, it’s about quality.
    You should know that no computer should have trouble (PC or MAC) playing a video that is encoded at 250kbps (even in full screen). A video encoded at 250kbps can be played back on a 10 year old PC (I’ve done thousands of hours of testing over the last 4 years).
    There are settings in the H.264 codec that can make 8 year old machines (no hardware decoding) playback 720p HD videos encoded at 7000kbps using Flash player even though Flash player is a CPU hog. The “magic” is not in Flash player (since the same video played using Window Media player uses far less CPU) but rather in the way you encode and Flash media encoder does not surface any of those options.
    As a comparison, a DVD (which is SD and not HD) is typically encoded at 8000kbps, good Blu-ray videos are encoded at 35Mbps and future versions will be even higher. So would you still call your video HD?
    And as far as Html 5 video is concerned. I wouldn’t repl on a Hulu to tell me about a technology. Test it out for yourself or if you don’t have the time, take a look at these tests:
    Html 5 Video Comparison

    • sonnati
      28 August 2010 at 9:41 am

      You are making bad assumptions:
      1. I’m not using Flash Media Encoder. It’s not possible to achieve the quality of my demo at such low bitrate with Flash Media Encoder. I never mentioned to use Flash Media Encoder.
      2. I do not argue about what is or not is HD, in my test I try to keep as much as possible details at very low bitrate. Obviously, as you know, compressing more means eliminate details. The point is how much details we can retain at such low bitrate.
      3. If you have read carefully my articles, I mention a post processing phase performed by the player (detail enhancement and grain restoring), can you do that now with HTML5 ? This is also the reason because this test requires some more processing power.

      I don’t see many video on the internet with the overall quality of this at 250Kbit/s. Obviously it is not HD anymore, but a lot of supposed HD *on the web* today is similar to this and with bitrate 4-6 times higher.
      It’s not a matter of absolute quality but relative quality at such low bitrate.

  22. 28 August 2010 at 10:19 am

    Yea, I read about your post processing. what does that mean in the video world? Is that processing after post? Is that processing after editing? Is that at the time of encoding or do you mean after/during decoding, during playback?

    From you reply you seem to be implying that you’re performing magic during the encoding phase too (since my assumption about you using Flash Media encoder is wrong), pray please tell us your secret.

    I think the big difference is what you call “better” or “detail”. You seem to be claiming that making a bad image look better (using post processing) is better than having a good image in the first place.

    And given that Flash player is already a CPU hod (even on Windows) are you sure you want to add to that? I’d rather up the video bit rate by another 200kbps and get an actual better image, and have that video playable on many more computers (even older computers).

    Pardon me for saying so, but you really need to be in the business to understand real world issue and desires as it pertains to online video.

    Can you apply filters in Html 5 video players? Yes of course! Besides, given that Flash’s video capabilities have been around or many years one would think the performance would be the best. But as it happens, within a year or so every major browser vendor has surpassed Flash’s video playback capability. Check out the link in my earlier comment to see for yourself.

    I doubt you can make the case for the combination of Flash and H.264 by adding even more processing during playback, or for that matter on the grounds that you can enhance the image after decoding.

    Have you tested how much more the bit rate needs to be increased in order equal the perceived quality of this video? If you have, can you post that video too so people can compare? Since at the moment there is no comparison.

    If you provide me with the original, I’d be glad to encode a video that is comparable in quality and provide you the same.

    • sonnati
      28 August 2010 at 10:49 am

      “Pardon me for saying so, but you really need to be in the business to understand real world issue and desires as it pertains to online video”
      you seems to be a little arrogant. I dont’ want to start a diatribe so I reply only to your last questions:

      Yes, I think that experimenting on such topics is interesting even with complex and/or unusual means. Reduce the bandwidth keeping the same quality (obviously approximately) is very important. Even only a 20% reduction in what youtube or vimeo, or BBC, or Hulu consume today means several millions of dollars saved per year. I think this can be a driver for an in-deep research, doesn’t you ?

  23. 28 August 2010 at 5:24 pm

    Yes it could be, but if it were truly improving quality.

    My comment about needing to be in the business was not intended to insult. The real world issues are that people have the bandwidth but not the computer power. Your solution requires even more computer power. So it’s not going to work. And those who have the compute power and bandwidth demand better quality.

    Besides, it’s all been tried and tested and websites interested on quality have gone a different route just like the movie industry (as it pertains to distribution via Blu-ray disks).

  24. mzanzi
    5 September 2010 at 10:34 pm

    I think its cool shiv, esp for us down south who DONT have the bandwidth…. Good work sonnati, may you generate many more !

  25. Kevin Sin
    13 September 2010 at 2:12 am

    Hi, Can I ask with this amazing encoding result, would it take more than 1:1 encoding time to have this quality? What I mean is it needs double or more time to perform the above quality? Thanks so much.

    • sonnati
      13 September 2010 at 2:04 pm

      Depending by the processing power of the encoder machine it may require 2-3x times to encode at 720p.

  26. Kevin Sin
    14 September 2010 at 8:58 am

    Thx, Sonnati. Thats what I think a trade off between quality and speed. Did you ever try to use your above profile to encode an action movie trailer such as Batman dark knight, Can you get the same encoding result?

  27. 22 September 2010 at 7:47 pm

    Hey Sonnati,

    Out of interest, did you enhance the audio in playback in the viewer interface ?

    I downloaded the MP4 that you’d encoded, and trying to compare it with the playback in the flash player.

    I might be mistaken, but it does sound like the audio is clearer and stereo enhanced in the flash video player ?

    Serious H264 compression is a big geeky love of mine, so the sooner you get the new article up online, the sooner I’m sure we’ll all praise you!

    Best regards,

  28. hellboy
    17 November 2010 at 8:40 am

    he never goona to teach what kinda command he is using, but any way , the quality was awesome with tat file size.

  1. 25 May 2010 at 6:32 pm
  2. 21 June 2010 at 5:23 pm

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: