Application Architecture

Like many of today’s developers. I started my IT career as a Flash Developer, and spend much of my time on learning new things from my senior friends, books and blogs about Flash Platform and get idea that there are lots of things to learn like Software Development Life Cycle (SDLC), Software Design Patterns, Coding Standards and many more. With expanding knowledge, I understand that architecture, frameworks and coding standards are important. Before starting discussion about application architecture, would like to share about preface for this post.

There are different technologies are available, we pick one technology, get knowledge for that, practice on that technology’. We live in technologies limitations or boundary and competing with other technologies. It is difficult enough to truly master a single platform. Of course many developers are experts in multiple languages, but mostly their knowledge and development practices of each language are different from each other.

For example, It you want to develop an application in two different languages (let say) Flex and Python. Your knowledge of Flex doesn’t give you any advantage for the Python application development. But I would like to say that knowledge of architecture or framework will help you here for the application development in both the languages. And that’s the reason behind the post on application architecture.

From a set of frameworks, I selected PureMVC as my framework of choice.

Before starting about PureMVC, let’s discuss about what is framework. As I understand Frameworkis a reusable set of libraries or classes for a software system, which follow some rules throughout the application. These rules are known as Design Patterns. So in other words we can say a framework is a collaborating set of design patterns. Frameworks are helpful as it give us the flexibility to implement the fastest solution to given problem.

Currently there are lots of discussions going on between Flash Platform & HTML5 features, development tools, and usage and development standards. But I think there is one topic ‘architecture‘ which is common and useful for all technologies or languages, application architecture/ framework is the heart of application standard, performance and scalability. Technology doesn’t matter for that. So  for the reference example, I have selected my favorite platform to explain application architecture. The Adobe Flash Platform is superb for developing rich experiences, including websites, games for web desktop and mobile users. From last few years lightweight, interactive run time has become the ideal choice for expressive media-centric web software. There is a major benefit of Flash Platform can experience as it has expanded to the desktop and well with Adobe AIR.

Goals of PureMVC

PureMVC is lightweight framework based upon well known Model-View-Controller design pattern. Main goals of PureMVC frameworks are:

• To separate application’s coding into three different tiers: model (data), view  (UI) and controller (business logic)
• For speedy implementation with scalability and maintainability
• Reduce complexity from developer

Also one major benefit of using well known formal framework is common design patterns and way of adding development. From organizational point of view, usage of such great standard produce clean coding standard of applications and reduce dependency on developers, reduce knowledge transfer time for new developer. I think it’s a best and most attractive benefit of using standard and well known framework. Here are some reasons why I like PureMVC:

• It is easy to learn, great documentation, samples and tutorials, easy to use and also easy to extend.
• It facilitates loosely coupled application architecture (Publish and Subscribe- type), scalability, maintainability and portability for you application.

Developers agree that separating an application’s code into different part based on its functionality. These separations are three major areas: model, view and controller. Let’s have a quick overview of these terms: the model is for your data, the view is for user controls, user interaction, and the controller decides how model change when view is clicked and how view should updates when model updated. You can get basic idea about PureMVC framework from below conceptual diagram:

A forth singleton Façade, simplify development by providing single interface for communication throughout application. Below is the base overview of each singleton:

• Model: manipulating the data model and retrieve data from remote services
• View: mainly refer named mediators that adapt view component.
• Controller: named mapping command classes, which are only created one needed.
• Façade: initializes core singletons (model, view and controller) and provide a single interface for communications.

Will have to use Façade and other actor classes (like Mediator, Proxy/delegate and commands), to interact with singleton as shown below:

Note: In next Part, will update sample applications implemented with PureMVC framework using different programming language.

Object-oriented JavaScript

JavaScript is a prototype-based scripting language that is dynamic, weakly typed and has great functions. It is a multi-paradigm language, supporting object-oriented, interactive and functional programming style. JavaScript is the most popular scripting language on the internet, and works in all major browsers, such as Internet Explorer, Firefox, Chrome, Opera, and Safari. As its scripting language so it’s lightweight programming language. It’s usually embedded directly into HTML pages. And it is an interpreted language means that scripts execute without preliminary compilation.

JavaScript was formalized in the ECMAScript language standard and is primarily used in the form of client-side JavaScript, implemented as part of a Web Browser in order to provide enhanced user interfaces. This enables programmatic access to computational objects within environment. JavaScript uses syntax influenced by that of C. It also has many names and naming conventions from Java. JavaScript and Java are different language. Java is frequently used to program games, mobile phones and other devices and also for websites. JavaScript is powerful language that runs inside a web browser. Its role is to provide access to different elements of the pages so that they can be removed or updated. For example, it can send request to Web Server to get more information and update specific part of page without reload the page.

And JavaScript perform such task by accessing the Document Object Model (DOM), a model or structure similar to a family tree. JavaScript is an event-driven language. There are some events triggered automatically like load event and there are some event triggered by user interaction like click, tap on touch-sensitive screen or mouseover and mouseout.

You will get more information about JavaScript from here.

Constructor Functions

In JavaScript syntax, a constructor function represents the class that contains the template from which new object instances are created. Constructor functions create and initialize (set the default state of) properties in the new objects. The difference between a constructor function and a method function is that a constructor function uses the special this keyword to represent a reference to the new object that is being initialized. A method function typically only performs some action on a given set of an object’s data.

The following example illustrates one way to create a Rectangle constructor function that could be used to initialize the height and width of new Rectangle objects:

function Rectangle(w, h) {
this.width = w;
this.height = h;
}

You can also create a constructor function by using function literal syntax. Function literal syntax provides the same functionality as the syntax used previously and is merely an alternative way to write the constructor.

Rectangle = function(w, h) {
this.width = w;
this.height = h;
}

Instance variables

Instance variables are any variables (properties) that are defined in a constructor function and are copied into each object instance of that constructor. All object instances have their own copies of instance variables. This means that if there are five object instances of a Circle class, there are five copies of each instance variable defined in the class. Because each object instance has its own copy of an instance variable, each object instance can assign a unique value to an instance variable without modifying the values of other copies of the instance variable. You can access instance variables directly from their containing object instances.

The following example defines four instance variables—make, model, color, and speed—in a constructor function. These four instance variables are available directly from all object instances of the Car constructor:

function Car(make, model, color) {
// define a Car class
this.make = make;
this.model = model;
this.color = color;
this.speed = 0;
}

The following object instance objCar contains all four instance variables. Although a value for the instance variable speed is not passed to the Car constructor, objCar still has a speed property whose initial value is 0 because the speed variable is defined in the Car constructor.

// objCar.make = "Subaru"
// objCar.model = "Forester",
// objCar.color = "silver"
// objCar.speed = 0
var objCar = new Car("Subaru", "Forester", "silver");

Instance methods

Instance methods are any methods that are accessible using an object instance. Object instances do not have their own copies of instance methods. Instead, instance methods are first defined as functions, and then properties of the constructor function’s prototype object are set to the function values. Instance methods use the keyword this in the body of the defining constructor function to refer to the object instance they are operating on. Although a given object instance does not have a copy of an instance method, you still access instance methods directly from their associated object instances.

// increase the speed of a Car
function Car_increaseSpeed(x) {
this.speed += x;
return this.speed;
}
Car.prototype.increaseSpeed = Car_increaseSpeed;

The following example defines a function named Car_increaseSpeed(). The function name is then assigned to theincreaseSpeed property of the Car class’s prototype object:

var objCar = new Car("Subaru", "Forester", "silver");
var newSpeed = objCar.increaseSpeed(50);

You can also create an instance method by using function literal syntax. Using function literal syntax eliminates the need to define a function and the need to assign a property name to the function name. The following example uses function literal syntax to define an increaseSpeed() method that contains the same functionality as the increaseSpeed() function defined previously:

// increase the speed of a Car
Car.prototype.increaseSpeed = function(x) {
this.speed += x;
return this.speed;
}

You will get more interesting information about OOP with JavaScript from the video tutorial give below:

Friends, lets share your ideas

Object Oriented Concepts: Polymorphism

Today, I thought to spend some time on object-oriented concepts. Mostly, developers look into this kind of OOPs concepts based articles in two kinds of situations either for application development or interviews preparation !!! Anyway, let’s focus on Polymorphism.

As it’s well known that Polymorphism is an object-oriented concept. Polymorphism in AS3 can be approached from two direction or way. One approach is to use Inheritance. The other approach is through Interface.

Abstract Class base Inheritance

Inheritance means to extend a Class. For example,

public class SampleClass extends BaseClass

SampleClass inherits all the public / protected properties and methods of BaseClass. And the BaseClass can be referred as super class of SampleClass. In this kind of situation ActionScript provides the ability to override methods of super class. Only those properties and methods which utilize the public or protected namespaces can be overridden and super class ‘s private properties and methods are not accessible to the class which extending the super class.

Let me take an sample and well known example to explain it:

 

public class Animal
{
        protected var animalName : String;
        public function Animal( animalname:String )
        {
           this.animalName =  animalname;
        }
     
        public function getName():String
        {
            return animalName;
        }

        public function talk() : void
        {
        }

        public function eat(): void
        {

        } 
}


 

 

Abstract class Animal, provides basic functionality the animals in app will use. For example, each animal has name. Now we extend the Animal class and create an animal.

 

public class Dog extends Animal
{
        public function Dog()
        {
            super("dog");
        }

       override public function talk() : void
       {
           // code
       }

       override public function eat() : void
       {
           // code
      }
}


 

 

The Dog Class extends abstract class Animal. So the Dog class is known as concrete Animal class, which override the public methods of base class.

 

public class PolymorphismDemo extends Sprite
{
         public var animalsArray : Array = [ ];
         public function  PolymorphismDemo()
        {
             var dog : Animal = new Dog();
             animalsArray = [ dog ];
             for each( var animal:Animal in animalsArray)
             {
                  trace(animal.getName());
                  animal.eat();
                  animal.talk();
             }
      }
}


 

 

You can observe that inheritance being used across the Flash platform. For example, any object on stage is extending DisplayObject, all events are extending base class known as Event.

Polymorphism through Intereface

Now, we are discussing the second approach for polymorphism through Interface. Interface is used to create class that implement a specific contract.

 

public interface IAnimal
{

         function getName() : String;
         function eat() : void;
         function talk() : void;
}


 

 

You can see Ianimal declares methods as its declared in abstract animal class in example of first approach. But if you observer something is missing from above methods is public namespace and brackets containing function body.

Interfaces allow only public function declarations.

You can’t declare properties, static or private methods in interface. Because interface represents a contract that lets outside objects know that public methods can be accessed on a class that implements the interface. Since outside objects can’t access private methods. Public properties can’t added to an interface for good encapsulation. And in case if its required to access properties of Interface then will have an great option getter and setter for properties in interface.

 

public class Dog  implements  IAnimal
{
        public function Dog()
        {
        }

        public function getName() : String
        {
            return "dog";
        }

        public function talk() : void
       {
            // code
       }

       public function eat() : void
      {
           // code
      }
}


 

 

Above Dog class implements IAnimal interface. And with interface there is no need to use the override syntax. By using the second approach ( with interface ) classes much more reusable.

Enjoy RIA .. 

Flex 4 Application on Mobile Device !!

Today I seen an superb demo of ‘flex 4 application running on google nexus one’ by Harish, an Adobe Evangelists.

And there is a list of the nice Key points described, and finally it comes to the Flex Mobile Framework.

You can enjoy the demo.

It would be a great feature for flex developers !!!

You can get more details from here.

Enjoy RIA…

Pixel Bender

Pixel Bender kernel language is designed for hardware-independent description of image processing algorithms. Pixel Blender provides high-performance graphics programming language mainly for image processing. Also supporting XML – based language for combining individual pixel-processing operation into more complex filters, and provides an interactive development environment, and a utility for converting a Pixel Bender file into a byte-code which can be used in Flash Player 10.

You can get more information about the Pixel Bender Toolkit from here.

You can get more information about the interesting feature from the superb demo.

So friends, Enjoy RIA…

Adobe Flash Platform – Game Technology Center

Finally, Adobe provides a centralized space to host best practices, code sample and examples around the Flash gaming space from where game developers get information and share information regarding gaming environment. There are some nice articles or information listed below related to adobe gaming technologies:

1) Adobe Flash Platform Gaming Technology Center

2) An introduction to developing games on the Adobe Flash Platform

3) Developing games for Nokia S60 Touch devices

4) Building a game with Flash Builder using Cairngorm Framework

5) Creating a Massively Multiplayer Online game with Adobe Flex 3

You can get more information from here.

Enjoy RIA…

Adobe Flash CS5

I had seen the declaration of Adobe about beta of Flash Professional CS5.

Personally, I think that for the person who has experience of software development field, it’s very normal known situation about release plans change. I believe only good features and functionality is the factors for which, developers are waiting.

You can get more information about Flash Professional CS5 from here.

Adobe Social Service To Develop Social Applications

Adobe had released a service to use a single set of APIs to integrate your application with social networks including Facebook and MySpace. Developers can easily develop social applications by using the APIs and also these services are insulates developers against underlying social network changes, the service adopts to those changes so as a developers you need not have to take tension to update your application.

Developers can get information, to use the new API to develop social network application, from here.

You can download the Social Service Library from here.

And as usual environment provided by Adobe to share the social application development problem at here.

Enjoy RIA…

Adobe Flash CS5 Applications for iPhone

Adobe make it possible to create applications for Apple iPhone using Adobe Flash Platform. So it provides a golden chance for flash developers and designers to get new users market using ActionScript 3.

You can enjoy the video regarding iPhone Applications.

You can get more information from here.

Enjoy RIA…

Adobe WorkflowLab

A new AIR application to provides environment to share project information including tasks, applications and instructions between designers, developers and project managers.

The application is developed using Adobe Flash Platform and Creative Suites 4 including Flash Builder 4 and so on.

You will get more information from here.