
Autumn - robin_reala
http://oos.moxiecode.com/js_webgl/autumn/
======
auton1
Other fun ones here:
[http://oos.moxiecode.com/blog/index.php/experiments/javascri...](http://oos.moxiecode.com/blog/index.php/experiments/javascript-
webgl/)

~~~
readerrrr
Playable ping-pong:
[http://oos.moxiecode.com/js_webgl/ping_pong/](http://oos.moxiecode.com/js_webgl/ping_pong/)

C64 Music video:
[http://oos.moxiecode.com/js_webgl/c64_shader/](http://oos.moxiecode.com/js_webgl/c64_shader/)

Attack on the Death Star with an X-Wing:
[http://oos.moxiecode.com/js_webgl/xwing/index.html](http://oos.moxiecode.com/js_webgl/xwing/index.html)

~~~
mVChr
Some more of my favorites, these are not only fantastic coding examples but
also artistic or humorous.

Endless Forest:
[http://oos.moxiecode.com/js_webgl/forest/index.html](http://oos.moxiecode.com/js_webgl/forest/index.html)

Particle Waterfall:
[http://oos.moxiecode.com/js_webgl/waterfall/index.html](http://oos.moxiecode.com/js_webgl/waterfall/index.html)

Gold Rays:
[http://oos.moxiecode.com/js_webgl/godrays/index.html](http://oos.moxiecode.com/js_webgl/godrays/index.html)

Spiders 2 (Hammertime):
[http://oos.moxiecode.com/js_webgl/spiders_2_hammertime/](http://oos.moxiecode.com/js_webgl/spiders_2_hammertime/)

Stopping by Woods on a Snowy Evening:
[http://oos.moxiecode.com/js_webgl/woods_xmas/](http://oos.moxiecode.com/js_webgl/woods_xmas/)

EDIT:

R-Type on the SNES!
[http://oos.moxiecode.com/js_webgl/snes_retro/](http://oos.moxiecode.com/js_webgl/snes_retro/)

~~~
dntrkv
If you turn on the Gold Rays one in the background and watch the Stopping by
Woods on a Snowy Evening one, the music and voice over just go so well
together, I didn't realize it was a different tab playing the music at first.

------
rglover
Stuff like this makes me think about how we'll live in the future. I read the
book Ready Player One last year (fun fiction read) and the story is set in a
world where most people live inside of a virtual world accessed via VR
headsets/suits (e.g. Occulus Rift).

Seeing this makes me think of a future when we'll be doing the same and
instead of looking at this in a browser, we'll actually be able to stand under
a tree and watch the leaves fall.

~~~
Kronopath
And hearing what you say makes _me_ think of a _present_ where I can stand
under a tree and watch the leaves fall. Because it's October, the air is cool
and crisp, and there's a park nearby. The resolution is much better too.

As technologists, we have to make sure not to get too caught up in our own
bubble. We have to remember what kind of a job our technology actually does
for people, what kind of a role it actually plays in their lives. And I think
the VR enthusiasts right now have a tendency to lose sight of that.

~~~
y4mi
but doing this in the rift would take at most 30 seconds... doing it in real
life is an actual chore which takes at least 30 minutes if you also consider
the way back.

~~~
lotsofmangos
A half hour walk to watch leaves in the park doesn't sound like much of a
chore.

~~~
tedks
Are you kidding? Who has time for that? 30 minutes to sit around staring at
trees?

This rendered like crap in my browser, but I'd probably take a 2.5-5 minute
break once a day to look at leaves. That'd probably be about all I could
stand. What's the difference between 30 seconds and 30 minutes staring at
leaves? They're leaves. They all look the same and they all act the same.
They're mostly the same color. They don't do anything interesting.

There's a disturbing undercurrent in industrial societies of fetishizing the
"natural", and I think that's the only reason anyone would enjoy sitting in
the cold looking at a goddamn _tree_ for a half hour -- to make a tribal
statement about how ~enlightened~ they are because they can ~appreciate~ the
~beauty~ of ~nature~.

I mean, you're probably a developer, aren't you? Your time is _valuable_. Why
waste it looking at a tree? Just keep this open in a small tile on your
desktop and glance at it once every few hours if you really like leaf videos.

~~~
lotsofmangos
Are you attempting satire? Is very hard to tell.

edit - just in case it isn't satire. I habitually watch trees quite a lot. I
have been obsessing a bit recently with how light reflects off particularly
waxy leaves making the colours change with the sky. It doesn't particularly
matter that they are trees though, I can watch buildings in much the same way.
Is more to do with an appreciation of light.

------
zerr
Can anybody explain what's special about WebGL demos? I mean, don't we already
know that WebGL exposes possibilities of OpenGL to JavaScript through browser?
Am I missing something?

~~~
acdha
As others have pointed out:

1\. I click in Firefox and it just works

2\. I click in IE and it just works

3\. I click on my iPhone and it just works

… repeat as desired …

That's never been true of OpenGL (or 3D in general) before so there's always
been this divide in what people consider possible for a web app (i.e.
convenient, easily shared) and the conventional software model where someone
needs to download and install something first – a big step up in delay and
complexity, and a reasonable hesitation for the security-conscious.

The excitement comes from the fact that now none of that is necessary for many
uses – if you're working on a non-AAA game, 3D object viewer, interactive
diagram, etc. etc. etc. you get support for 70% of web users globally without
having to take on the expense of desktop development and support or supporting
so many different toolchains. This isn't a big change for the major players
who are still going to do that for other reasons but it simplifies a ton of
casual usage.

~~~
richardwhiuk
It really isn't true. It doesn't just work. I'm running Chrome 38 on a modern
desktop PC and it doesn't render at a reasonable frame rate.

~~~
Someone1234
You're missing the point.

WebGL runs everywhere that is objectively a Good Thing™. Your criticism is
aimed at the optimisation rather than the technology.

The person who created this could, theoretically, add a little slider to let
you adjust the visual quality to meet your PC's performance characteristics.

Additionally WebGL can also be utilised for things which only get rendered
once (e.g. single 3D frames). Like generating 3D graphs for one suitable
example.

~~~
jonas21
> The person who created this could, theoretically, add a little slider to let
> you adjust the visual quality to meet your PC's performance characteristics.

If they wanted to, they could even auto-scale the quality based on frame-rate
to ensure that everybody had a good experience.

------
bhouston
Beautiful. Love the god rays. I believe this actually from last year as it
uses [http://threejs.org](http://threejs.org) version 58. :)

------
melling
It feels pretty good to click the link on my iPad and see the leaves. Apple
was the last hold out for WebGL. Hopefully, we'll see a big spike in WebGL
usage.

~~~
foobarfizzbuzz
Can you please explain how Apple was the last to hold out for those of us who
are ignorant on WebGL.

~~~
robin_reala
Mozilla were the first to implement (Vladimir Vukićević’s work) with Opera
around about the same time. Chrome jumped on board a few years later, and IE
as of version 11. Apple was the holdout for basically unknown reasons (they’ve
had a working version preffed off for ~5 years now) but the basic assumption
is that graphics card drivers needed to be hardened to provide a secure
execution environment for shaders. It’s one thing to buy a game and give it
root, quite another to load a webpage that could start a WebGL process in the
background and load executable code onto the graphics card.

~~~
acdha
Security is definitely the likely candidate (it was for Microsoft as well):
even on Yosemite, where they enabled WebGL by default, there's a per-site
permissions interface similar to things like location services access.

------
4ad
Nice demo. Is there any reason why every WebGL demo makes my browser burn the
CPUs and drain the battery? Equivalent native code that produces output of the
same quality does not have this much of an effect.

~~~
tux3
If web sites were allowed to execute native code on your computer, this would
be a huge security risk.

Instead we have more restricted web languages, but at the cost of performance.

Basically.

~~~
4ad
Well, first, even assuming JITing JavaScript is expensive and produces
expensive code, shouldn't WebGL demos mostly stress the GPU and not the CPU?

Second, web sites are not allowed to execute native code, but all the modern
JavaScript engines compile down to native code. My intuition tells me to
expect the performance of compiled JavaScript to be low, however I have seen
endless benchmarks that say that's not the case and JITed JavaScript should be
plenty fast.

However I feel this disconnect between those benchmarks and reality. The
benchmarks say it's fast, while in fact I perceive it to be pretty slow and a
resource hog.

------
chatmasta
Seeing this led me to investigate WebGL security vulnerabilities, since the
shader code runs out-of-sandbox.

Interesting discussion: [http://security.stackexchange.com/questions/13799/is-
webgl-a...](http://security.stackexchange.com/questions/13799/is-webgl-a-
security-concern)

~~~
zurn
By "out of sandbox" you refer to the fact that shaders are statically
transpiled into safe code, rather than getting executed in a dynamically
memory-safe and sandboxed environment?

I agree the approach raises some doubts, as it gives untrusted web content a
degree of indirect control over what kind of "safe" shader code gets passed to
the GPU shader compilers. But the first-order issues are addressed by the
specced security model
([https://www.khronos.org/webgl/security/](https://www.khronos.org/webgl/security/)).

~~~
chatmasta
Yes that's what I was referring to. I've only read the linked SO discussion,
but it seems like security on that compilation step is a focus point for the
companies implementing WebGL. Still, any time you're manually bound checking
at compilation, there's a chance for error. (A SO comment mentioned something
about open acceptance tests for this.)

Microsoft says the security is too bad to develop for, but that could be a
play for DirectX (whatever it's called now) more than a real security worry.

Point is, it seems like a lot of the WebGL security is based on "don't worry,
we tested everything!"

------
Igglyboo
Anyone know why he put all of his scripts in a <font> tag? Is he just trying
to hide them or is there an actual reason?

~~~
pauldino
Looks like it's just an accidentally unclosed font tag in the #info div.

------
dstaheli
Wow, I'm a Chrome user, but I'm impressed with how much better this performs
in IE.

~~~
snarfy
I believe there is an extra layer of indirection in chrome. IE can implement
WebGL using DirectX, while chrome uses OpenGL, which under windows is a
wrapper over DirectX. This may not be true of all video cards/drivers but I
believe it's the default implementation of OpenGL under windows.

~~~
pmr_
OpenGL has never been implemented in terms of DirectX on windows. No idea what
you are talking about here.

~~~
tsemple
When Vista first came out, Microsoft forced OpenGL to be a layer above
DirectX. But they pretty quickly backed down and let people build direct
OpenGL drivers again.

~~~
snarfy
Ah, this is where I got it from. I didn't realize they changed it back.

------
pyre
My experience: Ran for maybe 30s and then the tab crashed. Looked beautiful
though. _Chrome Version 38.0.2125.104 MacOSX 10.9.4_

Edit: Didn't crash second time around. Still Beautiful.

~~~
mrjj
Chrome lo-o-oves accident crashes.

------
skrowl
Cool demo. I like it.

I'm looking forward to a plugin-free web! Now if only we could get people to
upgrade from IE8 and 9.

------
dceddia
At first I wasn't sure if there was background noise, or if it was just my
laptop fan spinning up.

Fun demo.

------
AshleysBrain
Beautiful! However I tried it on my Nexus 5 and it looks like a bunch of stuff
is turned off and the display is kind of pixellated. Is there a way to run it
full-res mode? Modern mobiles have surprisingly powerful GPUs.

~~~
andy_ppp
Are you using up to date Chrome? The Android browser is a the new IE.

~~~
hobofan
I tried it with the latest Chrome on my Nexus 5 and as AshleysBrain said, it
is really pixilated in contrast to the desktop version.

------
miohtama
Wow, smooth on Firefox on Nexus 5! Never seen mobile friendly WebGL before.

~~~
daredevildave
Try [http://swooop.playcanvas.com/](http://swooop.playcanvas.com/) :-)

------
haihaibye
[http://davmlaw.github.io/ProceduralGraphics/fall.html](http://davmlaw.github.io/ProceduralGraphics/fall.html)

------
diltonm
On Ubuntu 14.04 on Chrome with nVidia GTX-660 it ran smooth and was very
beautiful. The CPU usage didn't look bad overall too.

~~~
barrkel
It was much smoother in Firefox for me than Chrome (Ubuntu 12.04 with GTX
660).

------
emmanueloga_
Now, if only I could replace my chromecast stand-by screen with this... :)

------
Shivetya
Now if I could only set up items like this to be my desktop background.

------
kentf
Beautiful, thanks for sharing.

------
CaptainSwing
really beautiful..

thanks for sharing

------
srcmap
works well in ipad with touch - very nice!

------
jbverschoor
super nice

