Saturday, July 17, 2010

FlashBuilder: Missing "Delimiter" from SyntaxColoring->ActionScript

I choose to change my code editor theme in Flash Builder (eclipse) to dark black (voodoo?) without having to download it from any of the openly distributed free eclipse themes. I started from the scratch and was almost finishing and i noticed that in Flash Builder eclipse preferences, Under Window->Preferences->FlashBuilder->Editor->SyntaxColoring->ActionScript, we have a missing "Delimiter" option with custom color. However, I could very well see it present under the CSS category. I was just stuck at my theme as my delimiters : (colon) and ; (semi colon) being matched with the background black and hence appear hidden breaking my theme.


Thursday, April 8, 2010

Flat View, Package Explorer in FB4

The new Flash Builder 4 comes with package explorer. Flex Builder 3 developers see this an instant eye transition in viewing project contents. Well, if you think you need some more time to move to the new package explorer in v4, you can still view the older folder structure of v3 in v4 by enabling a panel   Window->Show View->Others->General->Project Explorer (drag the panel next to package explorer so you can switch easily). No this is not your old v3 explorer though, it just gives you the old feel.

In Flash Builder 4, I like the toggle option for Flat View vs Hierarchial View. Here is the option to switch -




Flat View



Hierarchial View


In-house java robot for loading testing your webservices?

Most SOA based architected applications need to have webservices load tested before we assess the quality of code. Tools like QTP, OpenLoad, NeoLoad etc. provide you with infrastructure and sophistication to achieve this with a price tag attached to it. There is also an open source alternate Apache JMeter. If you are interested in build an in-house java code that just serves your purpose, you should be good to start here

What do you want to test?
  • Take one webservice call and test it for the load. Say webservice that fetches list of customers in the database with a matching property criteria (say search of customer from UI)
  • You can simulate a constant load of say 50 users
  • You may want to setup a step load, of say 10 initial users ramping at the rate of 5 users every two seconds
  • Or more….


 If you have a network monitor tool or a http proxy debugging tool, you can watch while you perform your screen action how data is going over the network (of-course http only). This will give you an idea of what the input payload is to the webservice end url. Say take an example of Customer search screen where user search criteria options are sent to the webservice and the results are fetched

An important point to remember is “Load Testing is not test the client front end UI but loading the middle tier to see how the database server is responding, how your application server is handling the threads, memory, CPU utilization etc.”

Let’s create the input SOAP Request in a flat XML that can be parsed in your java client which is ready to fire. Say a sample here is search a customer with SOAP request containing firstName starting with ‘Jam’ (ex: James, Jamey, Jamoe)



Simulate a constant load of say 50 users?

Lets first start with One User trying to send SOAP Request to end url



Works for one User? Lets Test it first. Yup, it works.. lets move on…

You can create instances of this thread class in a for loop (want load of 50 users, loop it on counter of 50?), kick of all threads. You can customize this code logic with how you want to see the workflow / actions the way you want to.

You may want to de-couple some of these into small functions where a constant load will just read the input SOAP one by one (50 times) and at one go you can hit the out.write(); that just flushes all at one go.

You can simulate a step-up load by implementing a timer and kicking in the users the way you need it. You can also add markers on the time taken for the requests to get served thread-wise

Want to implement a record and customize script kind of tool? Try JPCap utility which provides you with a http sniffing. Capturing the input and providing a nice interface with tons of data points, you get to keep your job for 3 months atleast.

Friday, April 2, 2010

Some Interview Questions on Flex

  • Difference between ArrayCollection and ListCollectionView?
  • Difference between ArrayCollection vs Array?
  • Difference between Sprite and UIComponent and how do you add a spite to a canvas?
  • Difference between DisplayObjectContainer and DisplayObject?
  • what does listData contain in ItemRenderers? What is the Type of listData?
  • How do you access methods in DG from external itemRenderers?
  • What is the data type of the dataprovider property in DG?
  • What are the different data types that the data provider can take? How does it resolve different data types internally in the framework?
  • What collection change event gets fired when data changes in arrayCollection?
  • What are the advantages of using arraycollection as a dataprovider instead of array in DG?
  • DataGrid extends which class?
  • What Class does all list base controls extend? and implement?
  • Difference between style and a property?
  • How do you create a new style for a brand new component just assembled with assets in createChildren() in action script extending UIComponent?
  • What will happen when you removeChild() and addChild()?
  • what does clear() do in graphics class?
  • What are non-visual components in flex? What class do they extend?
  • Where is finally used and what does it do?
  • What is overloading a constructor? How do you overload constructors in flex?
    - Action script does not support overloading constructors
  • What is invalidation Cycle? What are its uses?
  • How do you make a component participate in invalidation cycle?
    - Implement IInvalidating interface or extend UIComponent
  • What are - IStyleClient, IChildList, ILayoutManager, IToolTipManagerClient, IInvalidating, IValidatorListener, IFlexModule, IAutomationObject, IPropertyChangeNotifier, IRepeaterClient, ISimpleStyleClient, IStateClient, IConstraintClient ?
  • Why there is no invalidation cycle for createChildren()?
  • How do you make component participate in event mechanism?
     - Extend EventDispatcher or any subclass of it or implement IEventDispatcher
  • What is the DOM of a flex application?
  • Where do you normally use IFlexDisplayObject?
  • Or How do you create skinning for a component?
    - To add skin properties to component implement the interface or extend DisplayObject
  • What is a MovieClip? IUIMovieClip?
  • What is localToGlobal and globalToLocal?
  • What are explicitHeight, explicitWidth, unscaledWidth, unscaledHeight? When does flex call measure()? (when explicitHeight= NaN or explicitWidth=NaN)
  • What happens in measure()?
    measuredHeight, measuredWidth, measuredMinHeight, measuredMinWidth are set.
  • What is layoutChrome()? When does it get called?
    - before updateDisplayList() flex calls layoutChrome(). It gets scheduled to get called in next render update when invalidateDisplayList() is called
    - It is used to define the border area around the container
  • You are developing a custom component and you want to use some variables that should not be exposed outside. What is the best way to do it?
  • I'll keep adding to the list as i encounter interesting questions.

Friday, March 26, 2010

Running out of logical names for a Class Name?

Look at mx.collections.GroupingCollection2.as in sdk4

3608: 'GroupingCollection' has been deprecated since 4.0. Please use 'GroupingCollection2'.

Early migrating your projects from Flex 3.x to Flex 4 (SDK) + FlexBuilder3 to FlashBuilder4 without many code changes

For a project with close to 1000+ files in codebase, there are un-doubtedly many challenges in performing an early code migration.

It’s always tough to sell your manager an idea of migrating code base to a new version. In Medium to small corporate firms, Most Managers play multiple roles of Project Management, Technical Management and Client management. Delivery manager would slightly share or buy most of what project manager informs about technical challenges or deliver dates negotiation due to challenges. There are some advantages and disadvantages for lead / front technical guys who want to prove that the new version is going to help codebase/product in long run with tremendous enhancements. Most of these managers are typically client oriented and think in terms of numbers in most occasions and are considerably less caring about migration efforts / future code enhancements especially when there was huge effort in building a stable version, well appreciated and satisfied by the client

As a Lead or Front facing Technical guy, you are pretty excited about the release & all the news floating around about Flex 4, Flash Builder 4, Coldfusion Builder and you spread your thought across to the manager making decisions claiming that it would be great to migrate codebase for a long term plan. Having worked on the long ran Beta’s (from Adobe) Technical guys know most of the new features released in these new versions

Thanks to Adobe for giving us backward compatibility with the new version of Flex 4 SDK in Flash Builder 4. If you are working on a larger project implemented with Flex 3 and wish to migrate from Flex 3.x SDK to Flex 4 SDK and FlexBuilder3 to Flash Builder 4 (for developer IDE enhancements), start off here :

  • Export Latest copy of your Source code from repository
  • Create New Flex project in Flash Builder

Export Latest copy of your Source code from repository

Assuming you are on SVN, Switch your perspective to SVN Repository Exploring Perspective and on your source trunk, Export a latest copy of your Source directory –

Hit OK and your Code is now exported to C:\flexsourcecode

Create New Flex project in Flash Builder

Start your FlashBuilder.

Right click in your package explorer and choose New -> Flex Project

Choose your application server type, debug folder, etc. (omitted here).

Proceed and

  • Select "MX only" radio option
  • Add any *.swc to your libs directory
  • Choose appropriate setting for your Framework linkage
  • Hit Finish

Your project will be listed –

  • Copy your source code (earlier exported into C:\flexsourcecode) into the newly created project here
  • Copy any *.swc into libs if you forgot to add earlier
  • You can get rid of the test.mxml file (delete)
  • Right Click properties on the project and delete the test.mxml and set your mainapplication mxml as default here

FB builds your project and reports any changes to be made.Here are the changes I had to make:

  • In Flex 3, mx:Label textDecoration="bold" property value is wrong in Flex4
  • In Flex 3, mx:Label fontStyle="bold"property value is wrong in Flex 4
  • For the above two use fontWeight instead
  • In Flex 3, mx:states, mx:AddChild, components:xyz paddingTop="0" paddingLeft="4" paddingRight="10" paddingBottom="8", paddingType in this scenario is not supported in Flex 4. You will get compiler error
  • Plus Lots of warnings...

For most you will be done here.

As you run, you notice that your CSS will not be picked up.

Pull up your CSS file and add the following line in the beginning –

You should be done now.

Do a few testes running your application. Now that you have confirmed that your application works with Flex 4 SDK (mx set only) and Flash Builder 4 (not the right way though, I mean you are not using spark components, fx namespace yet), you can sell the idea of buying Flash Builder 4 for developer productivity and enhancements.

Migrating the code to newer Flex 4 (not just via backward compatibility) would take time and can wait and go on as you do this step.

From Flash Builder 4 docs - In some scenarios you may want to use only the MX components that were available with Flex 3. For example, suppose you have an existing Flex 3 project and you do not want to introduce the new Spark components. But you do want to take advantage of features introduced with Flex 4 and Flash Builder 4, such as the new states syntax, compiler improvements, and other language features. In this scenario, you select the MX Only component set.

Thursday, March 25, 2010

Which one do you like?

"Application Startpage" or "Start Page"? I like the later but i wish they were consistent.. doesn't matter :-p !!

Tired of Seeing CF Builder Start up page?

If you have just installed Coldfusion builder, you will be shown the coldfusion builder start page every time you quit and re-launch the IDE. To get away with start page, Find the Menu option-> Window->Preferences->Coldfusion->Startup->Show Welcome page on startup and uncheck it. Flash Builder doesn't do this magic everytime you quit and relaunch, Keeps it simple. I like that.

Wednesday, March 3, 2010

Some Un-reproducible errors with Flex

Here are some errors i've encountered working on the flex and these are not reproducible (rare to see..)


RSL Error when loading application (swf)



Hidden frame for tracking browser history opens up



Famous error 2032


Tuesday, March 2, 2010

Random SOAP Faults in application (Part II - Finding the Cause of problem)

This is in continuation to my last post where some of our end users running low b/w were encountering random SOAP faults in the flex application.

To debug the problem i have requested access to one of the end users machines to see what was going on. Spending good amount of time trying to work with the end users machine didnt give any clue though. I have found that while the end user recieves the SOAP Fault in the flex application, the response sent by the server for that specific request returned just fine with HTTP 200 OK with SOAP body and header looking just perfect in fiddler (http debugging tool). I didnt have a clue on what was going wrong when the response looks perfect.

Next, I took the SOAP body from the fiddler and started looking into the Flex framework, SOAP Decoder to analyze if something is wrong with the response body content, content lenght etc. After spending more time, Everything went through fine. The response was indeed getting decoded fine and everything looks perfect. Since these SOAP Faults were random and cannot be reproducible often, it was making the client frustrating putting us through difficult situations. Time is ticking without any solution yet.

I thought of the idea of trying to deploy a debug build for one release where i enable flex framework logging. I really thought this would give hints to what is happening internally.

Call this function in your creation complete of your flex application and it would enable debugging all the messaging, rpc logs in the framework.

This link would give you complete details on what to do next to enable logging in flashlog file. After I deployed the debug build into a custom environment, I have installed debug version of flash player on couple of end users machines, configured the flashlog settings and asked them to run their tests on this custom environment swf. I should say i was really lucky to get helpful hand from the end users who were willing to nail down this problem as there was no pattern for reproducing the problem.

After couple of days, I got this error SOAP Fault hit once by the end user running the debug flex build. Without any delay i got the flashlog.txt on their machine and looked for the traces of the problem.

Without much help from flexcoders@yahoogroups or the adobe-flex-forums, I spent a lot of time trying to debug through the flex framework to identify the problem. After going through the framework code i have bottomlined it to the fact that the culprit was FIDDLER. The message is not reaching the flash player properly.

This link on the msdn gives how fiddler works. Since fiddler acts like a proxy, messages go and come via fiddler. Unfortunately Client was running old version of fiddler...In some scenarios, even though fiddler recieves the response message fine HTTP 200 OK, it doesnt throw it back to IE properly (so FP doesnt recieve it fine). One of our QA person, running old version of fiddler encountered the problem and the cause was identified by running the same scenario 20 times, with fiddler on, Flex shows SOAP Fault events vs Without fiddler on, it never shows SOAP Faults.

When the end users removed fiddler things started to work since last one week without any random SOAP Faults in the application. It looks to be problem with older version of fiddler 1.x and not with newer versions as we could not reproduce the problem in newer versions. I hope this saves someone's time. I would encourage running network sniffers instead of HTTP Debuggers for debugging purposes for these reasons



PS: The thoughts shared in this blog post are purely experimental based on what we encountered inhouse and may differ

Monday, February 15, 2010

Random SOAP Faults in the application - Part I (Avoiding HTTP 504 errors)

This is in continuation to my earlier post where some of our end users running low B/w were experiencing random soap fault events using our application. I dont have a solution outright but i have made attempts to minimize a lot of these errors


This is the description of the fault errors we were encountering -
  fault String = "SOAP Message cannot be decoded. Raw Response : null"
  fault Code = SOAP Decode Error

So where do i start, what do i nail down? I knew, I wanted to first simulate a low bandwidth in my office machine. Talking to our network administrator was of little or no use (no offense!). I kept googling searching for tools that can reduce the network bandwidth only on my machine. Thanks to Vaideki, who found me this link that helped a lot (a link on raymond's blog archive)


I downloaded Shunra Nimbus from this URL that would exactly simulate a very low bandwidth only on my machine in the network. After installing it, all i have to do is select the speed i want (the reading is in kilobits or divide by 8 for kilobytes) and hit the play button. Browse to the URL http://www.speedtest.net to check the upload and download time.


Now that I have the lowest possible band-width set on my machine, I started to run my application with fiddler on, so i could monitor the http traffic going over the network. Due to very low speed, I have found some interesting results. The amount of time taken to load my swf file (which was around 1.5mb) was really high. I turned on RSLs to reduce the size of my actual swf. This bettered my download time but boom, errors... errors.. errors...


I was seeing them as HTTP 504 Errors in the fiddler. During the creationComplete() were were loading the WSDL's (multiple) and one or two will load fine and then rest will give HTTP 504 errors.


The problem was we were loading multiple wsdl's in a sequence. I changed the code to load these multiple wsdl's sequentially by waiting for LoadEvent.LOAD. After the first wsdl is loaded, it fires the LOAD event and then proceed with loading the second wsdl and so on... This completely got rid of the HTTP 504 errors when running very low bandwidth..



Tuesday, January 26, 2010

FaultEvent.FAULT night-mare when network b/w is low / load is high on the server

I have a task ahead tomorrow to resolve why the flex code randomly hits FaultEvent.fault event handler when the network bandwidth is low and the load on the coldfusion server is high. Watching the HTTP requests through Fiddler (HTTP Debugger) confirms that the request and response packets go through fine without any soap faults / http errors. So the big question ahead is why does some users encounter fault events randomly instead of hitting the ResultEvent.RESULT when the response looks fine on the network http debugger?

Herez a glimpse of what we have -

- We have a CF coldspring implementation exposing webservice operations.
- Flex app loads the wsdl's on load

As the user logs in, we invoke operations on the webservices -

Our end users are running 0.45 Mbps upload and download speeds... Has anyone encountered something like this before? Whats going wrong is a big question for me.... WS code is just a wrapper on the bottom line HTTPService in as. Guess I get a chance to reproduce the scenario and i get to debug through the flex framework to see which piece is actually getting me into this..

Sunday, July 26, 2009

Does size matter?

Gone are those days where we used to tightly stuff a lot of files & folders - setup's, dvd's copies, music collection and some movies into the 20GB HDDs.... These days everything comes in larger sizes. So is Flash Catalyst Beta 1. I was stunned to see the size of it after installation, (is it still a bug? or for real?) - 5.36GB? Wish the number is wrong... wow...



Wondering why its showing "Adobe Flash Catalyst" instead of "Adobe Flash Catalyst Beta 1", hmm... thats a bug... Icon overriding is also a bug...

Saturday, July 25, 2009

Auto doc snippet generation in IDE's...

What is Auto doc snippet generation? Its a very simple feature that i think should atleast be optionally be provided in every IDE tool to enhance overall project coding experience. Let me describe what this simple feature should do (I am not aware of any tool/plugin which is already available so far)...

     Just as you declare a variable, and just as you are done, ';' should auto generate the doc skeleton, create a //TODO:write comment snippet auto-select it and get you ready to just type what it is supposed to do.

        

    Just as you write a function and as you "}" (close) the function, it should auto generate the doc skeleton, create a //TODO:write comment snippet auto-select it and get you ready to just type what it is suppsed to do. As you change your function signature it should introspect existing doc skeleton and alter the argument types, return types etc. without having to manually go and edit it.

   

    

    Just as you close a loop (ex: for, while etc.), it should auto generate the doc skeleton, create a //TODO:write comment snippet auto-select it and get you ready to just type what the logic is for..

     

    Just as you write an if condition, it should auto generate the doc skeleton, create a //TODO:write comment snippet auto-select it and get you ready to just type what this condition is for..

      

     I've worked on a lot of projects but none of the projects were fully documented. Every developer has his/her own way of writing a piece of code. Even when you have a code monitoring tool, peer code review process, strict code guidelines to follow on every project (which is predominently seen in product based companies than services based companies and a less often in some companies who just want to get things working without having to bother much about spending time in writing code comments), there is always a scope of the code being written is left undocumented. There are some companies who enforce strict documentation on the code written but at the end they see themselves doing just 50-60% of it overall. I would say there are atleast 70% or more of the larger audience who concentrate on putting their brain at work by writing the actual code and get things working and leave their baby code undocumented unintensionally due to other work priorities. Developers may change and a new developer joining in is always targetted to face the tough time with the gaint code. Even the developer who wrote the code 4 months ago doesnt completely remember what's written unless he spends some time by going through the code again.

    How does a fully-documented code look like? Many people like to read the lines of code as they glance it and seeing a lot of comments written due to auto-doc snippet generation sometimes might disturb them. I do agree, but we can always have preference options to show/hide doc snippets, fold/unfold doc snippets.. everything is possible. As the application code grows larger and larger with tons of frameworks out there, the code is crying out loud - "If you dont document me now, i'll kill you or someone in the long run"...

Wednesday, July 22, 2009

Life Cycle Data Services 3 - New !!

With Adobe's showering a bunch of products into beta (almost at the same time), CF9, CFBuilder, FlashBuilder, FlashCatalyst, Flex4, LCDS3... wow..thats a lot.... Yesterday i had a chance to look at the video tutorials posted on the labs for the new lcds 3 beta features. Adobe's Romania team scores high in delivering these server spice into flex. From my LCDS 2.5+ experience, this was really a new ball game. Here are some of the highlights -

  • Model driven development brought into Flex with Fiber (language?)... Model View perspective in flash builder (earlier flex builder), create models from the RDS View connected to db from within flash builder, create services for the operations, generating model driven forms from within flash builder to quick test your model
  • Easy creation of filters from within flash builder
  • Annotations
  • localization, validation, data formats
  • Reliable messaging - this is one of the best features. Having AdvancedChannelSet, AdvancedMessaging This feature ensures that messages sent over the wire do not get dropped out due to network fluctuations (on and off). Before it tries to give you a feedback saying message sending error it does try to resend it for some time (configured) so it gets around the problem of fluctuating networks.
  • Message Throttling - Video streams for bad network are always hit. With this feature, you have more control on how your data messages can be handled with care to ensure to fit it in your network. You have options to pamper the inbound messages and outbound messages. InBound Messages have policy options - ERROR, IGNORE, NONE and OutBound Messages have policy to ERROR, BUFFER, NONE..

Its amazing to see the new developments...