Appcelerator Titanium with Alloy Framework

In this post, I am going to tell about Appcelerator Titanium with Alloy Framework. I will also share my experience with Classic and Alloy Titanium Mobile app development with advantages and disadvantages. I wish to say thanks to my friends, who helped me with their reviews.

About Me and Titanium experience:
Let me start with my experience with wonderful cross platform mobile APP development framework “Titanium”. Before using this Ti framework I wrote code in C# (for Windows and ASP.NET web), PHP (WordPress just for my blog) and Objective C (iOS apps) and using my ASP.NET and HTML web skills, created few small apps in PhoneGap. With PhoneGap, I had lots of challenges in implementing smooth scroll, CSS styles issue in few devices, page transformations effects etc.
“According to me PhoneGap is good cross platform framework to develop mobile applications”
After some research, we found Appcelerator Titanium framework and My experience started from Version 1.x and I am seeing a lot of changes in each version release. They are good with support in fixing bugs, improving features and new functionalities, supporting new OS version API in short period and providing good API documentation for each and every API method and they have announced of extending their support to other OSs platforms like Windows Phone and Windows 8. There are certain limitations but, those can be ignored because it is cross platform. These kind of limitations can be covered with a workaround provided by support Team or by writing Native modules.

PhoneGap < – > Titanium :
Comparing PhoneGap and Titanium, PhoneGap shows the web page as installed APP. But if we can design the app smartly, we can achieve native experience. When coming to Titanium app, it feels and performs almost like a native app.

Here is more info at Titanium developer link http://developer.appcelerator.com/devlink/profile/1228020/naga-harish-movva. BTW I am Titanium Certified Mobile App Developer.

My working experience with Classic mobile APP development in Titanium:

When I started work on this framework there were no rules for project structure and no design patterns. So, I created my own MVC pattern with Ti.include instead of require. Later I tried replacing Ti.include with require, merged View code with controller code and name it as ViewController (View + Controller). This file contains the designs of each screen and event listeners and it is exactly the same as current alloy framework output resource folder. But using my own design pattern, I found managing the code folders effectively is a too hard and also encountered memory leaks in few areas.
“If you create an object, then it is your responsibility to release it”. – Objective C
Now, Alloy Framework in Titanium mobile APP development:
“Just one word, WOW!”

When I created a sample APP in Alloy framework, I noticed the performance of the app is much faster than existing Classic APP. In Alloy we can manage our view code in XML file and event listeners in controller and model for DB list objects. And we can create run time view from controller and we can access all views using $.VIEWID to change properties or add/remove views. We can write the same classic code to create run time views or we can call other alloy views or widgets and append to current window at runtime.
“By the way, I think Alloy is NOT PURE MVC..!”
See the folder structure in Appc words – Below is the information copied from README file of the project when it is created.
Here’s how your Alloy directory is laid out.
models – your model files go here
controllers – your controllers files go here
views – yep, the views go here. you’re getting it
styles – your style (.tss) files for your views go here
assets – all files here will be deployed into Resources
Folders not generated by Alloy automatically, but the developer can create and use.
lib – put your own libraries here and use require(‘name’) to load it
migrations – generated model migrations go here
widgets – pre-built, reusable components for your Ally apps.
Also, in the root is the alloy.jmk file and config.json. Alloy.jmk acts like a makefile and can be used to hook into the Alloy compiler to customize the build process. The config.json file is where you can declare runtime constants, and widget dependencies.

Advantages in Alloy development:

• Can maintain MVC folder structure (very useful for long run apps-scalability).
• Less memory leaks compared with our own MVC in Classic.
• Alloy has its own config file (config.json) where we can add app environment settings. We can have different values based on OS (Android, iOS) and Development, Production or Test setup.
• Different themes for our app in Alloy and TSS (styles sheet) works prefect. – Read more
• Alloy has a great place to maintain global variables/functions (alloy.js)

“This is a great place to do any initialization for your app or create any global variables/functions that you’d like to make available throughout your app. You can easily make things accessible globally by attaching them to the ‘Alloy.Globals’ object.” – Alloy JS

Disadvantages with Alloy development:

• Comparing with classic, runtime error console log is not pointing to right area.
• Classic we will have full control, But in Alloy end code is generated from view and controllers

I did not find many disadvantages.

There are few questions from developer and companies about alloy framework

1) Can we use alloy framework, is it stable?
Yes, we can start developing Alloy apps in Titanium. “Alloy is the main direction Appcelerator wants the Framework to go.” – Christian Brousseau

2) Alloy has any limitations than Classic?
Alloy doesn’t limit you in any way. Anything you can do in traditional Titanium development you can do in Alloy. You can still create things with the old Titanium APIs and use them along with Alloy generated code. – Tony Lukasavage

3) Can we continue code using Classic?
Yes, you can continue in Classic Titanium. Why, Because Alloy also generates traditional Titanium code after start, build and run. (Tip: check with generated Resource folder.)

4) Developer need to learn Alloy development separately?
Of course, yes. But it won’t take much time. Alloy view and controller is very easy to understand. If you aware of View properties and XML. That is enough to create view and same Classic Titanium way of code in controller adding $ before can be followed.

5) Can we use existing 3^rd party modules in our Alloy APP?
Yes we can use all existing modules in Alloy and our own CommonJS modules as well.

Alloy reference links:

http://docs.appcelerator.com/titanium/3.0/#!/guide/Alloy_Framework

http://docs.appcelerator.com/titanium/3.0/#!/guide/Alloy_Debugging_and_Troubleshooting

http://docs.appcelerator.com/titanium/3.0/#!/guide/Alloy_Best_Practices_and_Recommendations

Very important, the above information is own personal opinions and do not represent my employer’s views in any way..!