

3D on 2D HTML Canvas - fortes
http://gyu.que.jp/jscloth/touch.html

======
swombat
With cloth animations too! (demo 1)

Quite impressive... does use up a fair bit of cpu and is still quite slow....
and doesn't work in IE7.

I think Flash still has many happy days ahead of it, but this is still rather
cool.

For the record, it appears to be using a javascript version of Papervision,
the fairly widespread 3D library for Flash.

~~~
fortes
FYI -- it's significantly faster in Chrome than FF3, work a look.

~~~
gdee
At least the third demo has better visual quality in FF3 than in Chrome
though.

------
ahpeeyem
That's awesome, and a great demo of just how fast Chrome's V8 Javascript VM
is! Wow.

~~~
c00p3r
thank to x86 native code generation, the very smart idea behind V8.

~~~
kragen
V8 has a lot of good ideas in it; compiling to native code is one of them but
far from the only important one.

------
ph0rque
It's been a dream of mine (currently beyond my hacking capability) to build a
really simple 3D CAD app using JS on an HTML canvas (optimized for Chrome,
since V8 compiles JS down to bytecode). This, along with several other 3D
Canvas implementations, are a good step forward.

~~~
est
DirectAnimation was an interesting technology, but Microsoft droped it for
Silverlight.

~~~
felixmar
Silverlight 3 will have 3D support with hardware acceleration. This is one
area where i see Microsoft taking the lead on Adobe.

~~~
raphar
While silverlight fights flash and viceversa over 3d support, google has a
fast js virtual machine already implemented and delivered. With it you can do
3d directly from js. I dont know why google dont push a bit more with this
killer feature. Are they avoiding 'browser war II'?

~~~
prospero
V8 isn't hardware accelerated, and probably won't ever be. That won't matter
in every case, but there will always be situations in which V8 is not a valid
substitute for Flash or Silverlight.

~~~
anewaccountname
If V8 gets threading support and auto-vectorization, then if processors-
graphics cards ala Intel's Larrabee take off, it may be a non-issue.
Developers can just do a 3d engine in pure javascript and get roughly the same
order of magnitude of performance as a GPU.

~~~
prospero
All true, but that's a lot of ifs.

------
kragen
This is very impressive indeed. My own efforts from a few years back
(<http://canonical.org/~kragen/sw/torus.html>) are very primitive by
comparison.

However, you can still see the effects of Canvas's stupid approach to
rendering antialiased filled polygons.

------
webjunkie01
I think this dude ported papervision from AS3 to javascript. Really awesome!.

~~~
medearis
Agreed. Very cool: <http://gyu.que.jp/jscloth/parpevision.js>

Even on my relatively beefy comp, though, the miku animation was enough to get
my fan going full blast. Papervision otoh has the potential to build a real,
high-quality, 3d game. I don't see JS getting there any time soon, but
nevertheless an interesting proof of concept.

~~~
kragen
What are the problems you see, and why do you think they're hard to solve?

~~~
medearis
I don't see any "hard barriers" but a lot of soft issues that will take time
to overcome. As of now, there isn't even a uniform event handling framework in
JS. So, first, we'd need a good generic 3d framework. Next, we'd need a
significant speedup in performance across the major browsers. If OpenGL is a
model, there would probably have to be some graphics-specific optimizations
made, which might be difficult to get everyone on board for. Third, I'd either
need to buy a new computer or JS would need gpu access, because ATM this site
brought my relatively face computer to a grinding halt... and I don't think
I'm going to have money for a new comp for at least a year or two :).

~~~
kragen
You could tell people "download Firefox to use my spiffy 3D site" (or download
Chrome or whatever) just like people now tell them "download Flash Viewer 9".
Does Papervision in Flash take advantage of 3-D acceleration hardware? In
those ways I'm not sure there's so much of a difference between JavaScript in
browsers and ActionScript in Flash.

Graphics-specific optimizations are probably going to happen, if by that you
mean "fixing Canvas so it isn't painfully slow".

------
jacquesm
slow as molasses but impressive all the same.

~~~
bryn
It BLAZES on Safari.

~~~
ahpeeyem
Hey you're right, I can't notice a difference in speed/responsiveness between
Safari on OS X and Chrome on XP inside Parallels, whereas it's painfully slow
on Firefox both on OS X and XP+Parallels.

Does this mean Firefox is slow because of its Canvas implementation, and not
the Javascript?

~~~
jdavid
Firefox has not enabled by default "tracemonkey" yet. If you get one of the
beta or nightly builds it should be turned on.

~~~
ahpeeyem
But Safari doesn't have its own new, fast JS interpreter (Squirrelfish) yet
either - I'm only using v3.2.1
(<http://en.wikipedia.org/wiki/Safari_(web_browser)#Mac>)

------
tutwabee
Opera 9 seems to render this much faster than Firefox 3 on Linux, but it's
still not nearly as fast as Chrome on Vista.

------
joubert
Just WOW. Miku (demo 2) is my fav.

------
wallflower
Wow. How is that even possible? Is there a Javascript port of openGL in the
works?

------
arnorhs
It's a bit slow on firefox 3, but on chrome it's very nice :)

------
TweedHeads
Animated ads should be based on canvas or svg, not on flash or gifs.

~~~
est
I disagree. Flash might have some optimization on AVM, and some audio
processing dark magic using tools like HaXe.

Flash is like GDI+ or Cairo for the Web. And it may extend to many other
capabilities such as webcam, microphone, Argumented Reality, etc.

And RIA should get a nice authoring tool like Adobe Flash IDE or Flex.

Flash is not just graphics

------
liuliu
cool though. But still cheated. Like flash, there is no project transformation
here. They use two affine transformation to cheat. Silverlight seems to be the
only practical solution for 3d experience in browser.

