virender
virender

Reputation: 4647

Ionic framework vs Famo.us

What is the difference between Ionic Framework vs Famo.us Framework. It is possible to use both framework in one project . Which One support smooth render graphic on mobile devices ?

Both framework support AngularJs?

Upvotes: 3

Views: 2949

Answers (2)

robro
robro

Reputation: 1800

Both frameworks work with AngularJS, but they come from a different direction and have different goals.

Ionic

is built on top of AngularJS and extends it, providing you with buttons, grids and other ready made UI elements to help you publishing your mobile app real quick. AngularJS focuses on data binding and the MVC structure of your app and doesn't really care about whether it's running in a desktop browser or on a mobile device. Ionic concentrates on the presentation of your app data and extends AngularJS to make it fit for use on mobile devices and supply you with design patterns that mobile users have come to expect. Since Ionic sits on top of AngularJS, you can't really have Ionic without Angular.

Check out Ionic's components to get a better understanding.

Famo.us

on the other hand strives for the fastest render performance. It just so happens that you can put regular HTML into a Famo.us Surface — which is the container that holds the content to be displayed. That content can be HTML, but doesn't have to.

Famo.us itself doesn't use the standard HTML reflow to position its surfaces in the viewport but its very own implementation of a render tree, so you're free to manipulate surface position and rotation, even in 3D space, with buttery smooth performance. HTML that is put inside a surface on the other hand uses reflows to position its elements just like you're used to. Read more about the render tree.

Famo.us can output to HTML, but can also render using WebGL or even Mixed Mode, combining DOM with WebGL. This allows for fancy graphic effects that wouldn't be quite possible with plain CSS. There's also tight integration with Easing and Physics to allow for playful and realistic animation.

Now that there's Famo.us/Angular, I don't see why you couldn't use Ionic and Famo.us in the same app, although I haven't tried it yet.

Summary

Ionic sticks with the regular DOM for rendering and focuses on mobile design / UX patterns. Famo.us disregards the DOM and lets you (read: requires you to) build / populate the render tree, provides physics and allows for more complex and fluid animations. This also means that using Famo.us comes with a learning curve. Good thing is: you don't have to go 'all in', since you can build certain views of your app with Famo.us and then use regular HTML/CSS for everything else.

Upvotes: 11

isaldarriaga
isaldarriaga

Reputation: 191

ionic lists work well when famous is loaded in the same index.html SPA.

Some things like touch to pan in angular-google-maps stop working when ionic and famo.us share the same page. Transitions from a ionic tabbed state to a detail view using ion-nav-bar animate badly too.

So i recommend you to keep things separated just by switching your app from famous.html to ionic.html as needed. each implementation having its own stack of dependencies and its own separated styles as they come in the sample apps.

you can transition by using document.location.href

i think you can find a way to transition to specific states from one world to the other by setting the proper state in the url.

Upvotes: 1

Related Questions