Deciding on Ionicframework

ionic-v1
1

I have few queries on selecting Ionic framework for our Hybrid app project. Since I have not used Ionic before, few queries may seem idiotic. But i would request all to share their thoughts.

Q1. How easy it is to customize any ionic components as per project requirement in both JavaScript and CSS level?

Q2. How much overhead ionic components create in terms of DOM, Memory usage?

Q3. In case of collection-repeat, say i want to display 10 items out of 1000 items at a time. So at any point in time only say, will there be only 10 divs and will only new data be injected in the previous created divs?

Q4. Say, I have selected Ionic for our project but don’t need all the UI or other components in it. So does Ionic gives the flexibility to exclude those components from the framework itself and use the rest?

Q5. How easy it is to include an external library into Ionic if required?

Q6. How easy to debug and Ionic app and the tools available?

2

Q1:
ionic uses scss/sass for there styling.
You can import the ionic.scss in your own scss file -> overwrite variables for colors, paddings, margins, borders, … and so on.
You can also use an own icon font very easily.
I think there will be no need to customize javascript components, but the most components are directives, services -> load them in your own directive/service and extend them

Q2:
overhead… this is a very subjective question. If you are using it right it will not generates really overhead. :wink:
It has some special tags and structures but you will have this too if you are trying to implement it on your own.
But there is a whole team that takes care of it ;).

Q3:
collection repeat is there to not show only 10 items at once… it is there to show all items fitting the viewport + 1 or 2
So if 20 of your items can be set in the viewport they should be visible (for ux reasons). if you try to scroll it could be that one you can parts of the previous/next item out of the viewport.
So you will a fixed number of dom-nodes e.g. 12 or 20

Q4.
There is no way to exclude something, yet.
Maybe they build something in the future like bootstrap or jquery ui do.
But all in all the whole bundle has a size of ~300kb… and there is already angular, … included.
And you only load it once at the app start.

Q5.
This is not an ionic issue.
It is javascript … include what you want…
I am using requirejs with some tricks to load external libs dynamically, like jquery, an own angularjs version, external directives and so on.

Q6.
it is Javascript -> develop and test it in chrome or firefox and use the debugtools/ webdeveloper tools.
Chrome provides remote device debugging so you can also debug the execution on the device (mac-safari too :wink: ).
In modern browsers you have WebDev tools included or plugins like firebug for firefox (firebug).
There you can set break points, add logging and so on.

Ionic is based on cordova so you can build your app over the bash or serve it instantly to mobile devices and add watchers to automatically update app while programming and file changing.

But keep in mind… it is still beta and not even reaches final 1.0 … so if some points like creating custom packages disappoint you … this framework is young but very mighty. They have connections to angularjs team, so they are save for the future.