Here are some thoughts from a company that uses Famo.us.
There are few more case studies on their YouTube channel and other videos, check it out;
Forgot that Famo.us was discussed a bunch at last week's meetup; this post reminded me that I meant to look at it. I, however, go into looking at new UIs with skepticism as I have been down a lot of wrong roads on this one, i.e.,
- jQuery Mobile (not Angular friendly)
- Mobile Angular UI (ended up
fighting with framework on simple things)
- Topcoat (worked fine in
Firefox, broke in Android native browser)
When I did need something slightly fancy, e.g., the mobile menu slider, I was able to build one with very little CSS (30 lines) and just used the Angular ng-class directive to activate it. See https://github.com/larkintuckerllc/hellomean6 for example.
Little worried about getting bogged down in a heavy framework that diverges too far from standard HTML; mostly because then I often find out that things get very hard once I need to do something different.
@sckmkny Famo.us is more about the UX than anything in my opinion. Having your web application run like a native application because it uses the GPU for it's animations and not the CPU on the client, definitely falls into UX for me.
I can't say much about Famo.us because I've yet created a prototype app with more than 2 "Scenes." You can take a look at some Famo.us code course at Famo.us University.
Personally I'm still very much caught up on Meteor's Framework, to then implement Famo.us on top of that.
Just for completeness, I went ahead and marked up a "fancy" menu slider in a few minutes with no CSS or JS libraries to demonstrate just how easy it is today to do animations with CSS today. http://jsfiddle.net/sckmkny/4bLgvsgy/22/
Point being, today there are all sort of ways to get interesting (animated) content just using plain old CSS. e.g., http://designscrazed.org/css3-animation-examples/
BTW.. Went through the Famo.us tutorials and realized that going that route would be a major switch for me (away from HTML and CSS). Not sure that makes sense to me.
It would only take browser "manufactures" to say okay we are now rending all animations through the GPU @ 60 FPS and that could possibly end it for Famo.us. I'm not sure it would be that easy but I can imagine it couldn't be that hard either.
One thing about JS and CSS that I've noticed is it does become jittery is when you have a lot going on, on your page, or have multiple transition after another.
For example, I created a 2 column layout. The 2nd column can hide or show, and it squishes the other column's width, no biggie. Then I wanted to be all cool and have an image fade in, into column 1, and the blur using CSS "filter", I was able to do all of this, but the transition of the column 2 from being hidden or showing wasn't smooth, then I removed the transition of the background image, and it was back to normal. Sometimes, it seems smooth and other times a little bit jittery, so CSS / JS doesn't seem to be consistent in animation transitions.
Developers are used to nesting HTML elements because that's the way to get
relative positioning, event bubbling, and semantic structure. However, there is
a cost to each of these: relative positioning causes slow page reflows on
animating content; event bubbling is expensive when event propagation is not
carefully managed; and semantic structure is not well separated from visual
rendering in HTML.
Like I said before I really haven't used Famo.us too much, because I'm focused on learning other things right now. Famo.us framework purpose seems to be on constantly delivering native like development for your applications, it does have an interesting learning curve.
If developing a multi platform application, that appears to be native, is something that is extremely important to you, then Famo.us seems to be the framework to currently work with. Which is why I mentioned this to be more of a user experience enhancement more than anything.
@Mak Thanks for diving into the Famo.us documentation and gleaning a key differentiator between plain old CSS transitions and animations and what the folks at Famo.us are doing. Knew that I was missing something.
Getting ready to work on a fun mobile web project that will require a fair amount of animation (nothing like your kids to motivate you) and will see how it goes with my plain old CSS approach. If I run into performance issues, am thinking that I might need to take a harder look at Famo.us.