Archive

Archive for the ‘Actionscript’ Category

Optimizing Flash Performance

February 6, 2013 1 comment

With some recent experience related to application performance, I thought to share some strategies to optimize performance of applications made with Flash Professional. There are two main components that determine Flash performance:

  1. CPU/GPU usage
  2. Memory usage

In this article I will begin with discussing memory management guidelines. Several times we are using filters, loops, Timers SoundChannels etc in Flash applications which are playing an important role in application performance.

Easiest techniques for performance optimization:

  • Some objects or movie clips required just to represent some data, which doesn’t require user interaction in such cases normally we are not writing any code for that object. But still when user click on such object Flash Player checks for mouse interactions when these objects are present. You can save some CPU cycles by disabling mouse interactivity for objects that do not require mouse interactivity. Disable mouse interactivity.
  • The issue with Timers is more critical. If a Timer has not stopped (because its currentCount is less than its repeatCount or because a stop() method has not been applied to it), the Timer will not respond to garbage collection even if you remove its listener and null all references. A Timer’s listener function won’t be called again once you remove the listener, but the Timer still consumes memory. Several times we start timer to achieve function requirement, and even after completion of the functional part execution the timer running. Explicitly stop Timers for garbage collection. However, if you open, play, and then close a Flash game running on a mobile device repeatedly without ever restarting the game, you may see a noticeable problem.
  • For ENTER_FRAME event loop, (if required to use then only) use different listeners and different listener functions applied with related DisplayObjects only.
  • Avoid use filters. Keep in mind that whenever you apply a filter to a DisplayObject in Flash, its cacheAsBitmap property gets forced to true and Flash must use memory to store that bitmap. If anything changes about that DisplayObject, like its transform operations like size or rotation or a child updates visually, etc, it must regenerate the bitmap, thus using more memory. That old bitmap hangs around until gc kicks in.
  • Always use reverse for-loops. Avoid writing do-loops and while-loops.
  • Using correct type of display objects for each element
  • Use weak event listeners and remove listeners when no longer needed.
  • Strictly type variables whenever possible.
  • Explicitly disable mouse interactivity when mouse interactivity is not required.
  • Replace dispatchEvents with callback functions whenever possible.
  • Stop Sounds to enable garbage collection for Sounds and SoundChannels.
  • Use the most basic DisplayObject needed for each element.
  • Always use cacheAsBitmap and cacheAsBitmapMatrix with air apps (mobile devices).
  • Several times when we are playing with loop and require to create object for each iteration in that case. In such situation it would be great if we create one object outside the loop and reuse it repeatedly in loop.

Friends, I hope these would be helpful to optimization of application performance. Feel free to share more ideas and comments about the topic.

Enjoy RIA… 🙂

Object Oriented Concepts: Polymorphism

December 29, 2010 1 comment

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 ..  🙂

New communications protocol RTMFP Service

October 4, 2010 1 comment

Adobe introducing the service known as Cirrus. Cirrus (previously codename Stratus ) is technology preview service for developers to build applications using end-to-end peering capability features in Flash Player 10.1.

Flash Player is already the market leader in online video distribution over the web. With the introduction of RTMFP and advanced media compression technologies, Flash Player 10 is well positioned as the leader in real-time communications as well.

Using Cirrus you can build some interesting application like :

  • Video chat application
  • Multi-player games
  • Voice Over IP

You will get more interesting information from here.

Enjoy RIA… 🙂

Text Layout Framework Technical Introduction

September 29, 2010 Leave a comment

Recently. I got chance for hand on practice on Text Layout Framework (TLF) and I like to post an article on technical introduction of Text Layout core component, conversion component and edit component and implementation of Text Layout Framework new feature like Undo / Redo and some interesting features.

Text Layout Framework support complex scripts and advance features and layout features. TLF consists three components :

1) textLayout_core.swc
2) textLayout_conversion.swc
3) textLayout_edit.swc

The textLayout_core component is central part of framework, which deal with storage of text, creation of text containers and display text.

As the component name itself indicate, the textLayout_conversion component is used for text input output operation (conversion), in other words import and export text operation with framework.

If you want to allow user to edit text which is stored in textLayout_core component then the textLayout_edit component will play an important role.

Following are some important Classes and specific operations techniques needs to understand for use of TLF.

TextFlow

TextFlow class is responsible for managing all the text content, as TextFlow can have ParagraphElement (p) and DivElement (div) elements as child. A div element can have group of paragraphs. A paragraphs can have SpanElement, InlineGraphicElement, LinkElement and TCYElement elements as a children. TYYElement is used in Japanise text.

The following diagram represent the node hierarchy in the elements package of the Text Layout Framework.

Each TextFlow has a corresponding Configuration object which allows you to specify initial character and paragraph formats and the initial container format.

You can get more information about Text Layout Framework from here.

TextLayoutFormat

The TextLayoutFormat holds all of the text layout properties, which effect the format and style of a text flow at container level, paragraph level and text level. Once you set TextLayoutFormat properties you will have to assign it with text flow just like:

var textFormat:TextLayoutFormat = new TextLayoutFormat();

textFormat.textDecoration = TextDecoration.UNDERLINE;

textFormat.fontSize = 12;

textFlow.format = textFormat;

Also, you can change text flow attributes directly :

textFlow.fontSize = 12;

Importing Text

This is specially useful for importing dynamic text returned from remote service or HTTPService at runtime. Following are three different conversion operation for import and export operation of text.

TextConverter.TEXT_LAYOUT_FORMAT – convert to / from markup format

TextConverter.PLAIN_TEXT_FORMAT – convert to / from plain text string

TextConverter.TEXT_FIELD_HTML_FORMAT – convert to / from HTML

private var _textFlow:TextFlow; private var _textInput:String ='Lorem ipsum dolor sit ao ac orci porta tincidunt eget in lorem. Aenean vitae nisi vitae urna lacinia congue. Duis nec leo turpis.'; textFlow =TextConverter.importToFlow(textInput,TextConverter.TEXT_LAYOUT_FORMAT);

Here, you can change the text format for text input.

Exporting Text

Exports a TextFlow to a specified format. Supported formats includes FXG, HTML, plain text and TextLayout Markup. Also specify the type of the exported data in conversion type format, which support ConversionType.XML_TYPE and ConversionType.STRING_TYPE.

var outputString:String = TextConverter.export(_textFlow, TextConverter.TEXT_LAYOUT_FORMAT, ConversionType.XML_TYPE).toString();

To implement this with spark component you can use textFlow property as shown below :

Editing Text

TLF edit component provides controller functionality by three classes that you can use to select text, edit text and undo redo text.

The ability to select or edit text is controlled at TextFlow level by an associated interaction manager, which is defined by TextFlow.interactionManager property. To enable selection will have to use SelectionManage class. And to enable selection and editing both assign an instance of EditManager instead of SelectionManager

1) Selection Manager

To enable your text selectable, create an instance of SelectionManager and associate it with interaction manger of your TextFlow instance. For example if _textFlow is your TextFlow instance name then you will have to set interactionManager property as shown below :

_textFlow.interactionManager = new SelectionManager();

2) Edit Manager

To enable selection and editing, create an instance of EditManager and associate it with interaction manager of your TextFlow instance. It will look like :

_textFlow.interactionManager = new EditManager();

3) Undo Manager

To enable undo and redo feature create an instance of UndoManager and set it as argument to EditManager constructor. If you have _textFlow as instance of TextFlow then you can set UndoManager as below.

_textFlow.interactionManager = new EditManager(new UndoManager());

If you have multiple instances of TextFlow let say textFlow1 and textFlow2, and you want to use the same UndoManager for the both textFlow instances then you can set it as shown below :

var undoManager : UndoManager = new UndoManager();

_textFlow1.interactionManager = new EditManager(undoManager);

_textFlow2.interactionManager = new EditManager(undoManager);

textFlow.format = textFormat;

Friends, you can get more information about advanced text operation supported by Text Layout Framework from here.

Enjoy RIA.. 🙂

Adobe Flash Player 10.1 Release

April 6, 2010 1 comment

Adobe Flash Payer 10.1 release candidate is first runtime release of the Open Screen Project which enables uncompromised web browsing of applications, content and video across devices, with the support of broad range of mobile devices, including smartphones and other internet-connected devices.

You can get more details about the release from here.

For more details on new features and enhancements in Flash Player 10.1, see the complete list of New Features.

You get some interesting improved flash player support from here.

You can enjoy the release candidate from here and enjoy the Flash Brings the Web to Life demo from here.

Enjoy RIA…  🙂

New functionality for Text Component

April 1, 2010 Leave a comment

Yesterday, I got an update of preview release of  Squiggly, a good feature for adding spell checking engine for Adobe Flash Player and AIR.  By using its library you can easily add spell checking functionality in any Flex 3 or Flex 4 based text controls.

You can enjoy the demo application from here.

Get the superb feature package from here.

Enjoy RIA…  🙂

Pixel Bender

January 12, 2010 Leave a comment

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… 🙂