You’ve probably been hearing a lot lately about how Flash is a dying technology and how it’ll soon be replaced by HTML5. Personally, I think that it will slowly replace Flash for some things, but Flash will always have a place, especially for developing complex games and rich internet applications. If you’ve yet to see what HTML5 can do, I’ve rounded up 10 demos that show off some of its capabilities.
So what do you think – will HTML5 replace Flash?
Canvas Minimal Particle Animation
CanvasMol
Flickr and Canvas in 3D
Cloth Simulation
etchaPhysics
Google Images Gift Box – CSS 3D example
Liquid Particles
HTML5 Canvas Nebula
Ball Pool
Bomomo
This is 20.000 particules running in Flash: https://wonderfl.net/c/rbeg/ – your 1500-low-framerate-demo is cute, as well as the other demos. And I would have seriously consider that in 2001. Thanks for sharing!
Just checked out your demo on my iPad, looks great!
Flash 10 works great on Android and other tablets, if Flash is so bad why not disable it default and let users turn it on if they want. Just because Steve dislike Flash the rest of the world don’t.
Exactly.. and by the way, that demo would run extremely smoothly with the CPU power of the iPad, but Jobs is protecting his precious AppStore business model and won’t allow Flash.
HTML5 is cute. I’ve seen some nice effects that remind me of Shockwave in 1995. But to suggest that it even comes close to Flash is just hilariously ignorant.
..as is the notion that the iPad can’t handle Flash.
The lack of Flash on the iPhone is a business decision, period. And what’s funny is the legions of iPhone fanboyz who defend this decision as if it’s based on tech reasons.
Fail.
Flash owns. As does Android.
Dude, we know that Flash is ahead of HTML5 right now. The point of these demos are that HTML5 is advancing and could one day take over even that Flash example of yours.
No, HTML5 will not take over Flash or Silverlight. HTML 5 will make things look nice but I dare anyone to try and make it actually do anything that really matters.
Flash and Silverlight can access and digest very complex SOAP services. Silverlight is ahead of the game in terms of data with it’s WCF Service capabilities.
Text parsed by a browser (HTML 5) will never be able to reach that level of client/server client/cloud robustness.
The canvas tag still has a long way to go before it will supersede flash!
Finally someone who can spell.
very impressive stuff, although its not fair to state it as forgetting about flash, one major major factor about html5 you cant do keyframe animation, flash will always have a roll in the web and will work well in collaboration with html 5, but like me there are a lot of people out there that simply are not coders, and i also require a keyframe animation solution
I would have to agree with Jordan. While the websites listed in the article are impressive examples of what can be done with HTML5, the sheer complexity and length of the code involved will prevent the vast majority of developers from ever using it for these purposes – it’s easier to build complex animations using Flash. Perhaps there will eventually be some tools to simplify the process, but I see Flash sticking around for quite some time.
good luck getting html5 to be cross browser compatible before 2012
@level09
“good luck getting html5 to be cross browser compatible before 2012”
Modern browsers will not be an issue in the next 1-3 years. Chrome seems to be on the right track with Safari and Firefox 3.6 running close behind. IE 9 will be out probably next year? and should show some greating support. IE 10 will fully support it by then.
So if even in a few short years that all modern browsers will support HTML5 and CSS3, it going to take a lot longer to get the average users to catch up for a variety of reasons because they are still using old browsers. I mean, we still have about 5-7% of users still using IE6 and thats been around how long now?? I even had one user tell me about Netscape that he’s still using.
oops.. should’ve said 2020
Wow. Cool stuff. It is just like Flash 2.0. No one knows what it is. No one knows how to do it. No one knows what to do with it.
i’m a flasher but i’ve to admit html 5 is cool and promissing
I’ve experimented porting a lot of the cool AS3 things that I’ve done in the past to the canvas and it worked but unfortunately I didn’t like that some of my examples ran at a slower frame rate or the behavior was different in different browsers. I’m also not cool with the fact that my source code is available for everyone to see. There are certain things I just can’t let out there because it vital to me paying my mortgage. These demos are extremely cool but trust me… it didn’t make me forget about flash.
I think that the canvas element will start to replace flash for many uses as soon as there is a good GUI-based tool (like flash) to create the animations and interactions. Lets face it, nobody wants to do character animation, for example, using javascript. Can you imagine having to code all the different positions for the design elements manually? Forget that!
Though HTML5 canvas for video, games, and a lot of other things is probably quite feasible. I just want a GUI tool for creating HTML5 canvas (vector!!!) content just like Flash has.
Cute stuff but html5 is a very long way of replacing flash (or silverlight or java for that matter).
Flash can do the same stuff and a million more than the ones shown here easier, better, faster, far more compatible and with less CPU on top of that.
It’s nice to post a showcase of html5 demos but these “…forget about flash” crap must one day stop. It’s not trendy any more, it’s just plain old bs.
These html5 demo’s are really not so impressive at all. Especially if you consider the fact that they simply will not work in the most popular browsers (like IE7/8), flash will.
Here’s some demo’s that make you forget about this HTML 5 hype. https://www.flashlab.com
This article will make me forget about Flash for the exact amount of time it’s going to take to drop this site from my RSS reader.
Congrats on your success, WDL!
The real issue isn’t that the HTML 5 Canvas isn’t capable of a lot of things that Flash can do, but the fact it typically takes a huge amount of JavaScript to do so whereas in Flash typically you don’t need to code as much and in many cases you can just use movieclips and the timeline to your advantage.
I agree with some of the other comments that if someone built an IDE capable of making complex animations as simple as using Flash, then I’d be more agreeable to the HTML 5 Canvas getting some traction later on.
You still have to account for people though that shutoff JavaScript though. I know people that turn off JavaScript in their browsers because of the trouble it can cause.
-Mark
canvas will be a very serious competitor, like Chuck Norris can do a wheelie on a unicycle. go css web 3d!
really, really unimpressed. sorry. as someone else said – would have been impressive in 2001?
Im not sure where Flash was at in 2001, but like Flash, HTML5 is growing and advancing and not for no reason. Someone sees it going somewhere and trust me, they will make their vision come true.
Haha Jae, funny picture of Chuck on an unicycle! 😀
Not impressed though…
These would have been impressive if they were presented in the context of how nicely canvas is coming along. But by trying to jump on the “will it kill Flash?” meme, all you’re doing is shining a light on the fact that all of these demos could have been done in Flash years ago, and worked in all major browsers. Just focus on the good things about HTML5 and stop trying to flog the bogus “two technologies enter..” meme.
Demo is great!
Woww HTML5 is the future! Thanks!!
Flash, is around for years deployed on millions op computers, yes.
Html5 is not finished (spec is being written), all the major browser vendors are implementing it, it is open-source, it gives 3d parties the opportunity to develop better and faster software (as opposed to development of the flash plugin which belongs to adobe only), html5 will be the no 1. platform for inter-media implementation (mobile devices, laptops, interactive tv).
The big problems with Flash in my opinion are : it is not open-source, it is a plugin, (poor support for linux64), expensive development tools
Html5 solves all these things.
It seems that almost no one is caring about webkit specific hardware accelerated optimizations like webkit transitions and tansforms. All these demos are running very slowly on ipad/iphone : /
Here is another CSS3 3D example.
Click and drag
https://bin.bmson.com/dg/
I personally like HTML5 more than flash. So I love this article thnx for the inspirational demos.
Few examples are jquery not an HTML5
It’s a pity that none of these demos are working well on iphone/ipad, they aren’t using webkit transitions/transforms (to use hardware accelerated rendering) and so they run very slowly on these devices… Also on standard machines (especially netbooks) equipped with webkit-based browser (chrome, safari) can’t benefit of hw accelleration…
Well Flash doesn’t run at all on iPad / iPhone sot that’s a 100% better!
The time will come.. html5 will be the no dev application-platform for all media. Remember the web-os, the ubiquitous browser etc.
They can all make use of this one open-standard solution. I think by now every computer/software manufacturer sees the benefits of open-source development. Just look at how many phone-os’s, portable pc’s are linux based, google with their os solutions etc.
I’m yet to really look into what HTML 5 can do but this list looks really promising for the future of web design. I appreciate that it is maybe to early to predict the future of flash.
It’s important to move with the development of technology and although there will always be a place for flash, with Apple not supporting it and Apple quickly becoming pioneers in design technology I think we will notice it less and less on the web over the next few years.
Really bloated code. I am not impressed at all.
Shouldn’t this be called HTML 5 + Javascript demos. HTML5 might be able to create those nifty looking images, but javascripts doing all the work.
HTML5 and javascript still are inferior to Flash when it comes to creating both complex animations and large RIA architectures in my opnion.
Then again it’s nice to have apps like this that run directly through the browser. It’s a give and take kind of thing.
HTML5 pretty much IS just that man. The new implementation of HTML and Javascript is called HTML5. Like, yay we have designed a way to bring these 2 codes together to create a wonderful experience.
Can “HTML5” do this? https://www.unfocus.com/2010/06/29/the-bunny-video-eplodes-explodes/
;-P (Kudos if it can!)
yes, but the demo from chrome experiments shows that the exact video is broken into larger pieces than the site u provided.
This guy has hundreds if not thousands and most blow these away…
https://www.dhteumeuleu.com/
“Not everyoone has Javascript enabled”, “It still runs slow”, “Can it blow up every pixel?”, etc.
Flash runs slow and takes long to load before you can see anything, and more people have Flash disabled than Javascript. At least, Canvas will degrade – you just won’t see the animations. It won’t replace Flash, but just like Javascript frameworks have done, it will make us less dependent on one technology for simple web applications. Can’t wait thanks for the post!
I have used Flash to make images and menus load faster and have smaller file sizes than any comparable format. The loading and file size is all in the way the swf is made. It is a shame that all the obnoxious adverts and splash pages have almost ruined a great tool.
HTML5 looks neat! I’d kill to change https://www.mytubedesign.com to HTML 5
Man, talk about link bait. This issue is old. These are OK examples, however Flash does them with much more finesse and a lot less development time, among other things.
Ironic that an article about things that make you forget about flash is filled with examples of people trying to replicate flash.
Stupid.
Just LOVE liquid particles!!! Wish I knew how to do stuff like that.
Look at the source code on the Ball example. It’s all JavaScript. Is it supposed to be HTML? If HTML is the answer to all of your animation needs doesn’t that cross a certain line where the tool is no longer about displaying web content, but doing other things poorly? I’ll stick with Flash.
I am a flash developer but i do admit that HTML 5 gonna replace it very soon
Yeah good luck with cross-browser performance, animation, filters and effects, audio handling, 3D etc etc. HTML5 & Co are going to work good on static classic web pages but Flash is light years ahead in creating new experiences.
Try to record web cam using html5 or stream a live TV channel 😉
Fer gawd’s sake, HTML 5 is still in its infancy. What the Flash naysayers don’t seem to get is it isn’t even complete and it’s already showing promise.
There were many who said Java would never be viable for creating applications, let alone games. And yet with improvements in its speed, it’s a major contender.
Will HTML 5 kill Flash today? No. Does it show such promise. A guarded yes.
@Attila F: Open Standards Video and Audio is already around (Ogg Theora and Ogg Vorbis). Eventually, it will.
The point that seems to be missed here is that no proprietary plug-ins were needed in the demos. Flash (originally Splash) was created to replace primitive animated GIFs (lighter weight and better animation). It expanded into other things. It’s not going anywhere anytime soon. I think eventually it will fall by the wayside as open standard based tech takes over.
THANK YOU @Jock
The only main advantage I see of using HTML 5 over Flash is it could be run on Apple IPhone/IPad while Flash donot, but most of the other IPhones like that of google support Flash, so this advantage is not that much bigger that I could take Flash market to HTML5.
Secondly HTML5 animations have three major drawbacks compared with Flash
1- It does’nt have code security.
2- Too much complex code that’s not easy to develop.
3- Browser compatibility issues (will take years to optimize them)
Also if we check the Flex based applications then HTML5 will be left way behind and then
we have “Adobe” attached with Flash that is constantly upgrading Flash, making it more faster, safer, reliable, adding different and unique innovations, no doubt HTML5 is running behind but why using spending so much time in writing so much code thats not secure, when we have huge number of components of Flash are available.
Also we cant have keyframe animation in HTML5 etc.
I cant believe this!!!!!! really html 5 can do that!!! OMG!! 🙁
html5, yeah sure….
You html maniacs eventually made it to build websites that feature (almost) the same tricks and animation as flash developers did 5 years ago!
Well done, see you in the future…
As we’ll be seeing Flash in the past.