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).
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.
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)
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.
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.
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.)
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.
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.
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.
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, 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.
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.
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:
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.
You'll actually find that the majority of the work for drawing this is happening on the GPU. I didn't even come close to maxing out my CPU with a stable 144fps.
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.)
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.
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.
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.
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.
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
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.
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.
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.
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?
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.
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.
They even had a post about it, too: https://stripe.com/blog/globe