How We Built the GitHub Globe(github.blog)
github.blog
How We Built the GitHub Globe
https://github.blog/2020-12-21-how-we-built-the-github-globe/
106 comments
See also ENCOM Globe, tribute to Tron:Legacy https://www.robscanlon.com/encom-globe/
Wow, very interesting. Although I'm on GH every day, I seldom look at the base GH page and so I would not have noticed this for a long time. Many thanks for posting this. The article is very interesting.
And you don't see any of this stuff when logged in.
You do, just go to https://github.com/home
Their home page is really a work of art, just beautiful.
Wow, that's a really nice (and extraordinarily rich) landing page.
One thing I hadn't known about before was Github Discussions (beta): https://github.com/home#home-community
One thing I hadn't known about before was Github Discussions (beta): https://github.com/home#home-community
FWIW, this only works for me in Chrome, not Firefox.
What doesn't work? Link, page, CSS?
Everything seems to work for me. Firefox latest stable release
Everything seems to work for me. Firefox latest stable release
I get a static image in firefox - https://github.githubassets.com/images/modules/site/home/glo...
I get terribly jittery rendering in chrome (despite being on a powerful desktop that is doing nothing else).
I get terribly jittery rendering in chrome (despite being on a powerful desktop that is doing nothing else).
Like Normal_gaussian, it was just a static image. Works for me now, though. No idea what changed.
It works for me on Firefox mobile (Fenix).
Looks a lot like the globe on Stripe's homepage: https://stripe.com
They even had a post about it, too: https://stripe.com/blog/globe
They even had a post about it, too: https://stripe.com/blog/globe
Dating further back, it might be even closer to this old "Chrome experiment" from about 10 years ago: https://github.com/dataarts/webgl-globe
Pretty much. Basically the "show internet actions via the globe" has a pretty rich history. There was even an animated and projected globe in the lobby of the IBM research facility in San Jose.
Still, given that the "form" is well established, it is always interesting to me at least to see how they chose to represent the data. When Blekko was running Bryn Dole had done a visualization based on this theme were query requests were highlighted as streams from their point of origin (more queries, taller stream as I recall).
Still, given that the "form" is well established, it is always interesting to me at least to see how they chose to represent the data. When Blekko was running Bryn Dole had done a visualization based on this theme were query requests were highlighted as streams from their point of origin (more queries, taller stream as I recall).
Good design ideas are always 'stolen'. As long as it's not exactly the same clone then it's fine. Github's is different enough and looks cool so I don't mind the similarity. And as others have commented there is plenty of other examples in the past of global activity maps.
This seems to be a blatant ripoff* with no attribution, and since the opening line is the arrogant "GitHub is where the world builds software", I'm not cutting them any slack.
I'm also not forgetting Microsoft's checkered history with open source, or their current deals with government agencies like ICE and the DoD.
* I'm not saying they didn't build it themselves. For companies like Microsoft/GitHub, the design is the hard part and paying engineers is easy.
I'm also not forgetting Microsoft's checkered history with open source, or their current deals with government agencies like ICE and the DoD.
* I'm not saying they didn't build it themselves. For companies like Microsoft/GitHub, the design is the hard part and paying engineers is easy.
You’re grasping at a lot of straws here. Showing your business on a globe is pretty old idea. Stripe “ripped off” someone too. Shopify was doing this for cyber monday many years ago.
I also don’t think the ICE and DoD deals are relevant here at all (or to any of Microsofts’s other products)
I also don’t think the ICE and DoD deals are relevant here at all (or to any of Microsofts’s other products)
That's why I said it seems to be a blatant ripoff. I don't know the whole story but I see a similar blog post (but with a lot of corporate self-agrandizment) about a similar design and disagree with the take that I replied to.
The idea of that visualisation has been around since at least 1983.
Combine these two Wargames movie posters:
Globe: https://www.traileraddict.com/wargames/poster/1
Tracking: https://www.pinterest.com.au/pin/216876538281839025/
But sure.. it's all a MS conspiracy to steal credit.
Combine these two Wargames movie posters:
Globe: https://www.traileraddict.com/wargames/poster/1
Tracking: https://www.pinterest.com.au/pin/216876538281839025/
But sure.. it's all a MS conspiracy to steal credit.
I remember that Shopify used to have this as well for placed orders.
I've seen variations of these on basically every hackathon ever.
Nat joked about this when it launched: "The battle for webgl globe supremacy will bring peace in our time" -- https://twitter.com/natfriedman/status/1336331076503916545
FWIW I'm currently running a Twitter poll to see whose globe people like better. 8 hours in the votes are running 60% Github, 40% Stripe:
https://twitter.com/calcsam/status/1344396912896712706
FWIW I'm currently running a Twitter poll to see whose globe people like better. 8 hours in the votes are running 60% Github, 40% Stripe:
https://twitter.com/calcsam/status/1344396912896712706
Thanks! I knew I saw this globe somewhere else before. What a strange feeling ... a very strong deja vu, but mystery solved :)
A link to a repo of the actual code would be nice too for inspiration
Great way to visualise the data. I wonder if it will work its way into any plotting libraries...
A link to something similar (but not the same) https://experiments.withgoogle.com/chrome/globe
Not useful, all it does is lag the page and increase the cpu usage to 40% when you have hardware acceleration turned off.
Agree! They could have cached way more of this. A pre-rendered video would have had the same effect. A fun and impressive thing to build for sure, but its value isn't worth its complexity.
You can’t interact with a video.
To be pedantic you can. They would have to ship the locations along side the video.
Of course part of the art is that it is real time (ish). That may be harder to do with video. (But I guess it could be a live stream)
Of course part of the art is that it is real time (ish). That may be harder to do with video. (But I guess it could be a live stream)
Wow, thanks for this comment. It hadn't occurred to me that you could interact with it. Neat!
I wonder if I'm just odd, or if people not realizing it's interactive is widespread.
I wonder if I'm just odd, or if people not realizing it's interactive is widespread.
I just don't think the interaction is particularly valuable. I looked at the globe and hovered over one PR. Maybe I'm just not curious enough!
I work on WebGL in Chrome and I am curious why you have hardware acceleration turned off.
When activated after a while a few tabs would change their background (sometimes the entire page) to show the content of other tabs.
Interesting! If you can still reproduce this would you mind filing a bug at http://crbug.com/new, and pasting the contents of your about:gpu page as a comment?
AFAICT, hardware acceleration is enabled here (even tried to force-enable it in FF, on Linux), and the CPU load is still 55%.
This is amazing! Is it just me or is the performance of Github's globe really bad on Firefox? The FPS is super low for me on Firefox but fine in Chrome.
Performance is fine for me in Firefox, but it is using 3x the CPU of Edgeium, and more RAM, so I would guess the GPU acceleration isn't working in FF
Yeah, I'm getting a really low framerate in Firefox but it's perfectly smooth in Chrome.
I was pleasantly surprised that it's performing fine for me in firefox on a pixel 3a.
It looks smooth to me in FF.
You probably have hw acceleration disabled
Pretty clever using the timezone offset to approximate the user's location without using GeoIP. I hadn't noticed that but sure enough, my (approximate) location is in view first.
Eh. I'm in the southern hemisphere, and the Github Globe first appears in the middle of the Philippines Sea. They're just assuming everyone is in the northern hemisphere.
Hemispherism is pretty common in tech, kind of surprising to see it in a project to produce a globe though :)
Same.
I think the combination of timezone and language settings would work for the obviously problematic cases (eg, Australia vs Japan/China/Asia, and South vs North America. Africa is still a problem though.)
I think the combination of timezone and language settings would work for the obviously problematic cases (eg, Australia vs Japan/China/Asia, and South vs North America. Africa is still a problem though.)
That shouldn't matter for the timezone, though, no?
Using the timezone was Github's way of easily getting the right orientation of the globe for the viewer's location. In my case (and I'm guessing everyone in the southern hemisphere) that doesn't work.
Aren't most globes oriented that way for display though? They copied the normal angle used for physical globes so it's instantly recognizable I suspect.
Whoosh, that was his point entirely. Globes are Northern hemisphere biased because of the history of European colonialism.
It looks like it starts showing the globe North of about 5° South, which would get 89% of the world's population. Pan down just another 3° (include the population centres in Indonesia, without sacrificing anything in the North) to get to 94% of the population. Of course, Github's user base may be distributed differently.
Source: https://youtu.be/p-MGKz4qjJw
Source: https://youtu.be/p-MGKz4qjJw
Clever but a bit lame given the fact that I guarantee your IP address is already analyzed from a bazillion angles (incl. GeoIP) way before it hits the frontend process. Not sure why they can't use that information.
Because that information is not available in standalone frontend component. They would have to make an additional API request to get that when timezone is available locally.
It‘s because i could see your pull request on this globe. If they use GeoIp they tell me where you live. But they use the user suplied location to not tell me any secret i should not know. Its genious!
Wow, hardware acceleration makes a big difference here. I'm on a recent top of the line macbook pro and it couldn't handle it without hardware acceleration turned on. I wonder if they can/should disable the feature if it's off?
I am curious, why do you have hardware acceleration turned off?
To answer your question, the failIfMajorPerformanceCaveat flag allows sites to turn off their hardware accelerated features when hardware acceleration is off.
To answer your question, the failIfMajorPerformanceCaveat flag allows sites to turn off their hardware accelerated features when hardware acceleration is off.
Not the person you are responding to. I can provide a reason why it is off. Some software behaved differently/weirdly with hardware acceleration and often it is recommended to disable it. I have hardware acceleration disabled in Excel because of scrolling graphic bug.
I work on WebGL in Chrome. It's my job to fix bugs like these. I'm hoping to learn what specific bugs people are hitting.
It's sometimes necessary on Linux due to bugs in out-of-tree drivers or desktop managers.
A recent thread that turned out to be a lightdm bug: https://www.reddit.com/r/archlinux/comments/kl9map/cant_run_...
A recent thread that turned out to be a lightdm bug: https://www.reddit.com/r/archlinux/comments/kl9map/cant_run_...
Most people in my company had to turn it off in Chrome (or switch to Fx) because webpages became a mess on their MacBook. Think this is the issue (screenshot there representative of how it looks, at least) https://support.google.com/chrome/thread/35828402?hl=en
Yeah, I know a lot of people were hit by this one. It's a macOS GPU driver bug introduced around April. Apple has made several attempts to fix it but it continues to be an issue. https://crbug.com/1068170
> failIfMajorPerformanceCaveat
This sounded like a joke, but I wasn't 100% sure.
It's a real thing (code from Stack Overflow):
This sounded like a joke, but I wasn't 100% sure.
It's a real thing (code from Stack Overflow):
const context = canvas.getContext("webgl", {
failIfMajorPerformanceCaveat: true,
});
I thought it was a joke too. What an awful flag all around:
* Woefully ambiguous and underspecified - what is "major"? A 12 FPS drop compared to desktop? Below 30 FPS? Frame jitter outside a certain standard deviation? It will depend on the app (fast-paced frame-perfect game vs. "well I just want the animation to be smooth" necessarily have different requirements for performance), but this flag leaves it up to the browser to decide.
* Oh, it's meant as a general term for checking whether software acceleration and frame readback (and other yet unknown possible bottlenecks) are engaged, those are the "performance caveats" - but those are either "yes" or "no", there's no way to quantify that with "major", totally meaningless. Unless it's conditionally choosing to succeed even with software rendering if some unspecified performance threshold is met. The 2 sentences of documentation about this flag means I wouldn't know.
* If you Google the name of the flag, near the bottom of the first page you'll find an email thread where someone brought up points like this and was ultimately shot down and the flag pushed through because "the Maps team really needs this." The technical equivalent of legislating from the bench. I wish I could create new browser features to solve all my inconveniences too. Why the Maps team couldn't figure out how to measure the canvas FPS and degrade on their own is a mystery to me.
* To round it all out, the name is also really bad. "failIfMajorPerformanceCaveat" is a weird negative tense - why not "requireUnhinderedPerformance"? That's consistent with the universal standard of "require" (not "failIf", how goofy) and is a lot clearer about the supposed intention of the flag (to try to ensure performance similar to native GL rather than this ambiguous "performance caveats" thing).
Sorry, just a rant about shovelware in the browser stack.
* Woefully ambiguous and underspecified - what is "major"? A 12 FPS drop compared to desktop? Below 30 FPS? Frame jitter outside a certain standard deviation? It will depend on the app (fast-paced frame-perfect game vs. "well I just want the animation to be smooth" necessarily have different requirements for performance), but this flag leaves it up to the browser to decide.
* Oh, it's meant as a general term for checking whether software acceleration and frame readback (and other yet unknown possible bottlenecks) are engaged, those are the "performance caveats" - but those are either "yes" or "no", there's no way to quantify that with "major", totally meaningless. Unless it's conditionally choosing to succeed even with software rendering if some unspecified performance threshold is met. The 2 sentences of documentation about this flag means I wouldn't know.
* If you Google the name of the flag, near the bottom of the first page you'll find an email thread where someone brought up points like this and was ultimately shot down and the flag pushed through because "the Maps team really needs this." The technical equivalent of legislating from the bench. I wish I could create new browser features to solve all my inconveniences too. Why the Maps team couldn't figure out how to measure the canvas FPS and degrade on their own is a mystery to me.
* To round it all out, the name is also really bad. "failIfMajorPerformanceCaveat" is a weird negative tense - why not "requireUnhinderedPerformance"? That's consistent with the universal standard of "require" (not "failIf", how goofy) and is a lot clearer about the supposed intention of the flag (to try to ensure performance similar to native GL rather than this ambiguous "performance caveats" thing).
Sorry, just a rant about shovelware in the browser stack.
I can answer this. Sorry in advance for the novel.
I hate the name too, but the flag was a necessary compromise to get past an impasse.
The problem at the time was that fullscreen WebGL in Firefox was an absolutely terrible experience on some machines, because they did a readback of the full framebuffer from the GPU to the CPU every frame. This didn't just make that tab slow, or even just the whole browser. It actually bogged down the entire computer. It made the mouse pointer skip. It was beyond unacceptable.
My preferred solution was that Firefox should disable WebGL on these machines. But the Firefox team did not want to do that, because it sort of worked OK as long as the canvas was only a small fraction of the screen. They also didn't want to expose any way of specifically detecting or disallowing readbacks. But no fullscreen WebGL application could be launched to a wide audience when a significant fraction of users would have their entire computer bog down and mouse pointer start skipping just loading the page.
So why couldn't you "just" detect that the framerate was low and turn off WebGL yourself? The problem with that is the first few frames at page load time are often slow for various reasons, some GPU related and some not. You have to render frames for a couple of seconds before you can reliably measure the steady state performance, and during that time the user's mouse pointer is skipping and they're already having a really bad time. If you then decide to disable WebGL, all that loading time and bandwidth was wasted and you have to start again loading your fallback content. So yeah you can measure performance but it doesn't solve the problem. Users still have a bad time.
As for the name, it was suggested (perhaps jokingly) by a Mozilla engineer and I decided to go with it for the proposal because they were the ones that needed convincing, and I figured they were more likely to accept a name that they suggested themselves. Bikeshedding the name could easily have derailed the whole thing.
I still wish that Firefox had just disabled WebGL on those machines, or at least agreed to provide an explicit way to detect and/or disallow readbacks. Then we wouldn't have needed the vaguely specified compromise solution.
I hate the name too, but the flag was a necessary compromise to get past an impasse.
The problem at the time was that fullscreen WebGL in Firefox was an absolutely terrible experience on some machines, because they did a readback of the full framebuffer from the GPU to the CPU every frame. This didn't just make that tab slow, or even just the whole browser. It actually bogged down the entire computer. It made the mouse pointer skip. It was beyond unacceptable.
My preferred solution was that Firefox should disable WebGL on these machines. But the Firefox team did not want to do that, because it sort of worked OK as long as the canvas was only a small fraction of the screen. They also didn't want to expose any way of specifically detecting or disallowing readbacks. But no fullscreen WebGL application could be launched to a wide audience when a significant fraction of users would have their entire computer bog down and mouse pointer start skipping just loading the page.
So why couldn't you "just" detect that the framerate was low and turn off WebGL yourself? The problem with that is the first few frames at page load time are often slow for various reasons, some GPU related and some not. You have to render frames for a couple of seconds before you can reliably measure the steady state performance, and during that time the user's mouse pointer is skipping and they're already having a really bad time. If you then decide to disable WebGL, all that loading time and bandwidth was wasted and you have to start again loading your fallback content. So yeah you can measure performance but it doesn't solve the problem. Users still have a bad time.
As for the name, it was suggested (perhaps jokingly) by a Mozilla engineer and I decided to go with it for the proposal because they were the ones that needed convincing, and I figured they were more likely to accept a name that they suggested themselves. Bikeshedding the name could easily have derailed the whole thing.
I still wish that Firefox had just disabled WebGL on those machines, or at least agreed to provide an explicit way to detect and/or disallow readbacks. Then we wouldn't have needed the vaguely specified compromise solution.
Thanks for the background! Pretty cool have the author here and I hope you didn't take my venting too personally ;)
As a firefox user I appreciate that we were considered. Although maybe I've got a new bone to pick with Mozilla now, since not exposing hardware/software rendering mode or readback y/n is a weird hill to die on when things like canvas font rendering fingerprinting are much more reliable and precise (if their refusal was on privacy grounds).
With the history in mind, an ideal flag to me would have been more like an enum of "minimumRequiredGLExperience" valued like ["any", <benchmark value>, "parity"] where apps have a middle ground to say "even if we have SW rendering, maybe we'll still want GL if the browser ranks itself above the threshold value (which would be computed ahead of time and have a standard-ish definition, kind of like the scores on userbenchmark). While still somewhat nebulous, it would allow fine-tuning the experience for known target platforms.
I definitely understand the limited window of opportunity though, and rolling an entire feature like that above would be a big project so I can't fault anyone for going with the compromise. I just wish the name had been different or the documentation more clear - even the Khronos docs are wishy washy on whether SW rendering will for sure cause a failure, or if there's some implementation defined benchmark already that it boils down to. Which I realize is also something that would require work from the Mozilla side too, that they may not be willing to document for the same logic as not wanting to expose whether readback is happening in the first place!
Anyway, thanks again for responding, and I apologise for being a little abrasive in my first post.
As a firefox user I appreciate that we were considered. Although maybe I've got a new bone to pick with Mozilla now, since not exposing hardware/software rendering mode or readback y/n is a weird hill to die on when things like canvas font rendering fingerprinting are much more reliable and precise (if their refusal was on privacy grounds).
With the history in mind, an ideal flag to me would have been more like an enum of "minimumRequiredGLExperience" valued like ["any", <benchmark value>, "parity"] where apps have a middle ground to say "even if we have SW rendering, maybe we'll still want GL if the browser ranks itself above the threshold value (which would be computed ahead of time and have a standard-ish definition, kind of like the scores on userbenchmark). While still somewhat nebulous, it would allow fine-tuning the experience for known target platforms.
I definitely understand the limited window of opportunity though, and rolling an entire feature like that above would be a big project so I can't fault anyone for going with the compromise. I just wish the name had been different or the documentation more clear - even the Khronos docs are wishy washy on whether SW rendering will for sure cause a failure, or if there's some implementation defined benchmark already that it boils down to. Which I realize is also something that would require work from the Mozilla side too, that they may not be willing to document for the same logic as not wanting to expose whether readback is happening in the first place!
Anyway, thanks again for responding, and I apologise for being a little abrasive in my first post.
Thanks to the globe rendering in glorious 2fps, I've just learned that apparently I don't have HW acceleration because I'm using chromium on linux.
Chromium supports hardware acceleration on Linux. Some GPU drivers are buggy and have been blocklisted to prevent frequent crashes and rendering errors. The most common is Nouveau. https://bugs.chromium.org/p/chromium/issues/detail?id=876523...
Shopify did something similar, I'm pretty sure, for Black Friday
looks so cool
looks so cool
why is the octocat wearing a space helmet if there are plants growing below it? what happened on this planet to make the air unbreathable?
Some kind of chernobyl event, possibly caused by the ICBMs in the globe image?
What is the octocat standing on top of? Abandoned silo? Or live silo about to go hot?
Some kind of chernobyl event, possibly caused by the ICBMs in the globe image?
What is the octocat standing on top of? Abandoned silo? Or live silo about to go hot?
Perhaps the Octocat is following interplanetary hygiene best practices during their visit to Earth from the Octoplanet. [1]
1: https://sma.nasa.gov/sma-disciplines/planetary-protection
1: https://sma.nasa.gov/sma-disciplines/planetary-protection
octocat prime directive is 'helmet stays on'
Maybe the plants are grown in a CO2 rich environment, so that extra O2 isn't wasted where it's not needed.
Alt title: how we made yet another population density map, but this time using all of your CPU.
Based on the Satellite video it looks like the US is the only place on the planet coding more during the night than during the day.
I watched the animation from Nat the CEO and what struck me as odd was the volume of which Brazil does “activity” at night.
Clearly the USA is more active during the day, as is India and Europe. Brazil on the other hand is backwards. Anyone know why that would be? I’ve worked with Brazilians before during the day so that struck me as really peculiar.
Clearly the USA is more active during the day, as is India and Europe. Brazil on the other hand is backwards. Anyone know why that would be? I’ve worked with Brazilians before during the day so that struck me as really peculiar.
I think night schools and courses are quite popular there compared to other countries.
I'm not convinced of the performance, I heard my fans spin up when I first opened the new Github.com redesign a few weeks back and remember commenting on it to our developers ("how we destroyed your browsers performance" as a joke).
It's still a heavy thing to add to any page IMO. Which shouldn't be downplayed.
But it is very neat and I still like it.
It's still a heavy thing to add to any page IMO. Which shouldn't be downplayed.
But it is very neat and I still like it.
Performance != resource usage in this case.
They optimized for hitting 60fps without any concern for the resources they were using as long as it fit in that budget
I agree that using this amount of resources in the browsers of visitors shouldn't be taken lightly (they could be on battery for example).
They optimized for hitting 60fps without any concern for the resources they were using as long as it fit in that budget
I agree that using this amount of resources in the browsers of visitors shouldn't be taken lightly (they could be on battery for example).
That's a good point which I didn't consider when I read the top end of the blog post.
ohhhh well thank you it takes me a few seconds to login :d
Related: WebGL globe showing live Wikipedia edits https://umaar.com/globe/
I've also tried to visualise worldwide COVID data on that globe, however performance degrades making it completely unusable.
I've also tried to visualise worldwide COVID data on that globe, however performance degrades making it completely unusable.
Looks very similar to https://globekit.co/
I recall Stripe's globe was built using that.
I recall Stripe's globe was built using that.
I love an animated webgl globe as much as the next person but did no-one check scrolling on mobile? Maybe it's just me but it captures vertical scrolling preventing moving down the page.
It's a common gotcha when embedding Google maps on mobile.
Here's a mobile capture for reference https://files.catbox.moe/e965m9.mp4
It's a common gotcha when embedding Google maps on mobile.
Here's a mobile capture for reference https://files.catbox.moe/e965m9.mp4
Works fine for me. Just don't try to scroll by tapping the globe.
Isn't the bottom part of the display where people start scrolling though?
If you want something like this on your site, here are the resources. As a company that built a rotating globe years ago to visualize our growing user base around the world using our apps, I wanted to share a link to the demo here. Being that we did this years before WebGL became available in all major browsers, we used canvas rendering and shapes of countries from open databases. It is supposed to work across all devices so try it whatever browser you are on now:
https://qbix.com
Please scroll down to where the globe image appears and click/tap it. Feel free to switch countries and click around. I would love to hear your feedback.
PS: We have open sourced all this stuff, so if anyone here wants to put a globe on their website, just load our Q.js from https://github.com/Qbix/Platform and then render the Q/globe tool and Places/countries selector tool with your own options. Unlike the GitHub globe, you can also have users click on countries in the globe to select them, and if you need you can pull in the flags, languages and all the other stuff per country.
https://qbix.com
Please scroll down to where the globe image appears and click/tap it. Feel free to switch countries and click around. I would love to hear your feedback.
PS: We have open sourced all this stuff, so if anyone here wants to put a globe on their website, just load our Q.js from https://github.com/Qbix/Platform and then render the Q/globe tool and Places/countries selector tool with your own options. Unlike the GitHub globe, you can also have users click on countries in the globe to select them, and if you need you can pull in the flags, languages and all the other stuff per country.
Thank you! Tested on an iPhone 5 and perf is fine! Mad props.
[deleted]
When someone puts a video game in-front of me and asks me to turn it into an app, I will be searching for this article for hours.
[deleted]
It's funny that the marketing & design folks keep doing this (IBM in the 80s, Akamai in the 90s through today, and so on). It looks super cool and informs the viewer of very little.
(Full disclosure: I ported a prototype version of my company's globe data viz in 2013 using Three.js - it's terrific! Those folks are the real heroes in this story.)
(Full disclosure: I ported a prototype version of my company's globe data viz in 2013 using Three.js - it's terrific! Those folks are the real heroes in this story.)