Did these guys just reinvent the Web?
javaworld.com
javaworld.com
http://www.w3.org/TR/css3-transforms/#transform-property
"A transformation is applied to the coordinate system an element renders in through the ‘transform’ property. This property contains a list of transform functions. The final transformation value for a coordinate system is obtained by converting each function in the list to its corresponding matrix like defined in Mathematical Description of Transform Functions, then multiplying the matrices."
On a side note: this looks like something that should work (transformation/transition) with javascript disabled -- we've (rather) recently gotten drop-down menus that don't require javascript -- seems like a bit of a step backwards to require javascript for (some uses) of basic transformations if that's being used as part of the essential ux for a page...
The example shown on famo.us is identical to MrDoob's Three.js example that uses CSS3:
http://www.mrdoob.com/lab/javascript/threejs/css3d/periodict...
Edit: looks like it's the other way around -- according to MrDoob's G+ post from last year, he based his Three.js CSS3 example directly on the design created by famo.us: https://plus.google.com/113862800338869870683/posts/QcFk5HrW...
Honestly, without going into the source code, I was like, this is matrix transformation, this is matrix transformation.. then I saw matrix3d and I was like yeaah!
I believe that no software can excel without a good mathematical foundation. What I see coming is that this approach will be extended by P2P Load-Balancing. Similar to what Bitcoin Hackers [1] were doing and still do [1].
--
[1] http://community.websense.com/blogs/securitylabs/archive/201...
[2] http://bitcoin.stackexchange.com/questions/1364/how-can-i-st...
PS: Page 3 on the article answers the headline: No!
Whether or not there's anything wrong with that is left up to the reader. :)
I really don't understand this meme about the web being 'open'. Much of the native desktop software I use is open source. Practically none of the web services I use are open source. There is not much chance of a 'GNU project' for the web (i.e. reimplementing an open google and twitter and facebook and so on). Open source web services of significance are few and far between and when it comes to controlling our data usually the best we get is a proprietary API that may or may not get shut down or changed tomorrow.
The web gave us RSS which was good[1] but since then it has been pretty much a non stop stream of proprietary APIs and platform lock-in. Even things built on RSS tend to be proprietary APIs rather than open standards: take Google Reader for example. Before it shut down it should have been trivial to pull your subscriptions out of it and point your clients at a new replacement rss-syncing server (like you can do with an email client). But it wasn't because there was no damn standard for that, just proprietary APIs as various people wanted to lock you into their cloud service. The standards that have emerged have been, of course, ones that generally involve lock-in to proprietary platforms, like OAuth.
[1] interestingly many of the new generation of web developers seem to dislike RSS.
Many sites still use JavaScript that way, but some use it for major programs that do large jobs. For instance, Google Docs downloads into your machine a JavaScript program which measures half a megabyte, in a compacted form that we could call Obfuscript because it has no comments and hardly any whitespace, and the method names are one letter long. The source code of a program is the preferred form for modifying it; the compacted code is not source code, and the real source code of this program is not available to the user.
So they're planning on releasing open source and charging for components on top.
I've sometimes thought about building a full fledged ui framework on top of it but it doesn't work (exactly the same) in all browsers. And I suspect offloading everything to the gpu by default will lead to other sorts of performance issues but I'll have to test this.
Framer also includes spring physics and is fully integrated with Photoshop. You should check it out if you build prototypes.
EDIT: ahh, the http://famo.us/ example doesn't work in FF either, it redirects to a boring splash page. I didn't notice the redirect the first time!
Do iOS/Android handle CSS matrix well? Because if you could punt on FF/IE support, it seems like you could do some interesting mobile interaction stuff.
Mr Doobs did the same demo, even better since he used the framework he created ,three.js :
- http://www.mrdoob.com/lab/javascript/threejs/css3d/periodict...
> a javascript engine and framework that solves HTML5 performance
And doesn't work in Firefox. Aweso.me!
It now redirects to famou.us/c/ in Firefox for me.
But most importantly: didn't Intel release around this time last year JIT compilation of Javascript to run on their HID (GPU onboard CPU)? (wouldn't that make slow-execute javascript a non-issue?)
I'd recommend checking the Ajaxian article[1] that sums it up. You can find the source on Github [2]. You can play around with the River Trail interactive shell [3] too.
--
[1] http://ajaxian.com/archives/intels-parallel-extensions-for-j...
Of course, faster JS is never wrong.
- http://desandro.github.io/3dtransforms/
As for the article... the author confuses "rendering" with "layout":
- "the primary part we need to rewrite is the part of the renderer that creates and multiplies the matrices"
- "We use the CSS3 primitive -webkit-transform: matrix3d, which lets us compute the composite matrix and skip the browser's renderer"
Which leads to some absurd claims:
- "We were 14 times faster than compiled C in Chrome"
Before reality kicks back in:
- "rendering goes through DOM"
- "Obviously, this isn't exactly the reinvention of the Web"
And this is how you sell a DOM scenegraph engine to people with more money than common sense:
- "a W3C standard that must be supported by all browsers"
- "all text in Famo.us applications is searchable"
- "enable rapid application development"
- "smooth, high-functioning UI across all platforms"
- "one of several enabling technologies"
- "allow enterprise users to touch-interact with big data analytics"
- "spark a new breed of gamified enterprise apps"
I think it's time browsers took a step back and gave more control to developers.
It's time for a major rethink of what a browser should be/do.
Mobile devices have turned the process of installing an app into something 'close enough' to the experience of browsing the web that I think a lot of consumers wouldn't notice if the twitter web site disappeared (except that would be big news, and they wouldn't be able to avoid all the complaining).
Conclusion... I don't know, but I think our current concept of a browser and the web might be reaching the end of it's usefulness. More data needed.
Warning: unpopular view ahead. It's a bit ranty, too.
That's because we're hell-bent on doing everything in browsers in the first place. Somewhere along the way, we collectively decided that write-once run-anywhere would become reality, damn the consequences. We just wouldn't call it that anymore - to do so would raise the spectre of desktop java which has essentially shit the bed. Instead, we'll call it "standards".
It's a most peculiar definition of "standards" though. These standards are a shifting target, receiving regular modification. Every major vendor can claim compliance regardless of whether they are actually compliant - after all, vendor prefixes. And many front-end developers extoll the virtue of these 'standards', apparently believing that the libraries and tooling that hide the inconsistencies from them are actually a solution instead of a band-aid.
We've been trying for "write-once-run-anywhere-but-don't-call-it-that" [WORABDCIT] for years. And we've made such progress - in another decade we may actually have consistent standard support across browsers. Of course, we haven't had this for the last decade so I'm not sure why we're perpetually hopeful that we will in the next.
And that's not even getting into performance. Because these 'standards' are built atop so many layers that applications built on them can very, very rarely provide performance like an application actually built for a native platform does. Leading to a whole discipline of computer science with a goal of performance that merely approaches native speed on a consistent basis.
Back when I first started in my career, I remember building native application UIs that were poorly coded, inefficient and bloated. Hell, I used MFC for love of K&R. Yet this crap still ran faster on a Pentium III than the majority of "web apps" run on the latest hardware.
A native application is nearly always going to be faster than javascript through a browser. For most applications being developed, it will provide excellent performance - even on ARM -- without any tuning, tweaking, shortcuts, or loopholes. It will give an experience consistent with the rest of the platform, so that users aren't having to learn a new UI paradigm with every hot new app.
You can even integrate technologies into a native app that still allow you to communicate with back-end components over http/https - go figure. A well-written native library is cross-platform (thanks to meaningful standards), so that only the UI bits would differ.
The cost is more time building. A loss of some flexibility. Levelling up some basic skills, perhaps raising the barrier of entry a bit. A step back from RAD practices that have become so rapid that it's become common for a new "app" to be deployed knowing it will break under stress and worry about fixing it later. Not saying that this didn't happen before - but I am saying it wasn't accepted as the norm to the degree it is now.
But nah. Native is yesterday. Why on earth would we want to take fullest advantage of modern hardware to provide a good user experience? Let's continue to reinvent the browser. We'll keep on with WORABDCIT because sooner or later, we're bound to come up with standards that are finalized and implemented consistently.
Really. We will.
With native you have to redo your work multiple times that is not efficient java had the right idea but their implementation is a nightmare.
We need something that would be as simple as using a browser but would act more like a java interpreter under the hood.
But I wouldn't want java or javascript as a language.
We need something that trows exceptions every time you attempt to do something the wrong way like Python because a log of beginners will try and if the language allows it there's going to be a lot of messed up code.
> Did these guys just reinvent the Web?
with NO, you hyperbolic twit.
JAVAWORLD!!!!! lol.
At at least they admit its just hyperbole... right?
I had to look it up, so this might save some others the trouble.
Any time a commenter cries ad hominem, there will be a sub-thread arguing about the definition of ad hominem.
This was a particular bad reference since the title was very rhetorical and not meant to be taken literally.
[0]https://twitter.com/onesleepynerd/statuses/34425107788713164...
(BTW: It took me a while to figure out that if you close the dialog window, you can click the buttons at the bottom for more demo's.)
Unfortunately they are only using the webkit-prefixed properties, so their demo doesn't work in Firefox or IE. I'm guessing they wrote their demo a couple of years ago and never updated it.
There are some problems with CSS3 3d-transforms: 1) Text looks blurry, just look at the dialog window in the demo. 2) Some mobile devices (e.g. old iPads) have limited GPU memory. If you use too much (by setting 3d-transforms on large surfaces), the browser (or your app) will crash.
By the way, the answer to the question in the title is: No. And if they don't open source their code, they won't get a lot of traction.
Yeah... "the vendor specific CSS3 primitive" and "no plugin, no download, massive hack". Would be a closer representation.
Tried it on my phone and the performance was good but still noticeably stuttering. Could be an interesting approach if they cut down the hyperbole and carry on improving.
But even bigger question than the performance is, what kind of 3D user interface would be more effective in conveying a message than a clean, regular 2D website that everybody feels familiar with. Curious to see if they will bring some UI design innovations here
edit: I've opened that page in Firefox, it won't show the demo. I guess it won't show it on IE also, but I haven't tried. So who's their target? 25% of the users?
If someone can invent a way to have buttery-smooth HTML5 performance on mobile devices, they'll have solved a significant hard problem. This solution? It's just a hack.
http://www.sencha.com/blog/the-making-of-fastbook-an-html5-l...
Metaphors are powerful.
The animations were pretty smooth anyway, but my cursor would skip frames over the content.
Cool stuff but I wouldn't call it re-inventing the web
...then went downhill:
"...and in JavaScript."
My understanding is that when a browser renders a page, the output bitmap is kept in a render buffer, which then gets composited with other buffers when being written out to the display. Filling the render buffers is slow (largely on the CPU), and compositing is fast (largely on the GPU). Using the 3D transform effects moves elements on the page into separate buffers.
Performance would be improved by having fewer buffers, and by re-drawing buffers less frequently.
Best case is to have a single buffer rendered once, I think that's what you're referring to by Addy's suggestion. But, if you're going to have elements moving relative to each other, it is faster to render them both once, then re-composit multiple times on the GPU, rather than re-render the whole scene on the CPU each time there is a change. That at least is what I mean by, "moving computation to the GPU."