Tech Per

16 Jun

Google Kills The Browser Sync Plugin With Firefox3

I have previously written, that I wanted a Google Browser Sync like plugin, just for Thunderbird. Now, it seems like I won’t have the GBS plugin in firefox anymore either. This is really sad.

I saw the sad news over at the google operating system blog, which tells me, that google is going to discontinue the development of the Google Browser Sync plugin. The reason being, that the people of the project at google have other things to do now. Sad! Mostly because I use it, and with pleasure. And they cannot just release the code, because a big part of the service was the storage of the data on google servers. One thing is, that the development is discontinued, another thing is, that there will be no firefox3 version, which basically kills the plugin overnight very soon.

I guess the game is lost. There is one last chance though. Max Rathbone has started a petition, to help people tell google, that they want a firefox3 version. Go sign the petition. I just did.

If the petition to google fails, I hope Weave will succed in delivering as good a service as GBS did. You can see some of the new cool stuff here, which includes sync’ing of bookmarks, cookies, browser history, passwords, tabs and form data. But where will Weave store the data?

09 Jun

Patterns of GUI Architecture in Cairngorm and PureMVC

In the flex application we are currently developing, the need has arisen to get some more structure on the code. In the upcoming months, we are going to do a great deal of flex development, heavily expanding the functionality of the application, and of course we want to keep a maintainable application. Because of this, we are in the need of some structure and guidance on the architecture, hence the need for an architectural flex framework and some good patterns to follow.

In this post, I will discuss a specific area of the two current major architectural frameworks in flex, PureMVC and Cairngorm, namely how they apply patterns of GUI architecture.

What are Patterns of GUI Architecture?

As I previously wrote about in my post When Thin Clients Grow Fat, developing flex applications quickly reveal the need for the same kind of architectural guidance as when developing real, native, fat clients in frameworks like Swing and .Net Forms. To help architect such applications, some patterns on GUI architecture has been developed and described. Martin Fowler has some good descriptions of some of the more know, like Presentation Model and Supervising Presenter. These are not whole UI architectures like MVC, but smaller parts of architectural guidance, related to how the logic of the application relates to the api of the view framework.

How PureMVC Applies UI Patterns

PureMVC has a construct called a Mediator, which is just what it sounds like, an application of the Mediator pattern, to mediate bewteen the apis of the view and the apis of the rest of the application. This is a key construct, in how PureMVC implements the View-part of the MVC architecture, and is introduced to reduce the dependencies between the application and the view, hereby lowering the coupling in the entire system.

The PureMVC Framework Overview documentation has the following to say about mediators:

Mediators help us to create or reuse existing user interface components without the need to imbue them with knowledge about the PureMVC application they communicate with.

… View Components display data or accept user gestures. In a Flash-based application, they typically communicate with their Mediators using Events and exposing some properties for the concrete Mediator to inspect or manage. A Mediator connects a View Component with its data and communicates with the rest of the system on its behalf.

This, actually is not a very precise description of how to use a mediator in PureMVC. Luckily, PureMVC has an Implementation Idioms and Best Practices document, which lists an actual example, the LoginPanel example. In the example it shows, that only the mediator knows about the view, and that the view does not know about the mediator. Here is a source extract of the PureMVC documentation:


<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" title="Login" status="{loginStatus}">
  <mx:MetaData>
    [Event('tryLogin')];
  </mx:MetaData>
  <mx:Script><![CDATA[
    import com.me.myapp.model.vo.LoginVO;

    [Bindable] public var loginVO:LoginVO = new LoginVO();
    [Bindable] public var loginStatus:String = NOT_LOGGED_IN;

    public static const TRY_LOGIN:String = 'tryLogin';
    public static const LOGGED_IN:String = 'Logged In';
    public static const NOT_LOGGED_IN:String = 'Enter Credentials';
  ]]></mx:Script>

  <mx:Binding source="username.text" destination="loginVO.username"/>
  <mx:Binding source="password.text" destination="loginVO.password"/>

  <mx:Form id="loginForm">
    <mx:FormItem label="Username:">
      <mx:TextInput id="username" text="{loginVO.username}"/>
    </mx:FormItem>
    <mx:FormItem label="Password:">
      <mx:TextInput id="password" text="{loginVO.password}" displayAsPassword="true"/>
    </mx:FormItem>
    <mx:FormItem>
      <mx:Button label="Login" enabled="{loginStatus == NOT_LOGGED_IN}" click="dispatchEvent( new Event(TRY_LOGIN, true ));"/>
    </mx:FormItem>
  </mx:Form>
</mx:Panel>

and the class mediating this view component:


package com.me.myapp.view {

  import flash.events.Event;
  import org.puremvc.as3.interfaces.*;
  import org.puremvc.as3.patterns.mediator.Mediator;
  import com.me.myapp.model.LoginProxy;
  import com.me.myapp.model.vo.LoginVO;
  import com.me.myapp.ApplicationFacade;
  import com.me.myapp.view.components.LoginPanel;

  public class LoginPanelMediator extends Mediator implements IMediator {
    public static const NAME:String = 'LoginPanelMediator';

    public function LoginPanelMediator(viewComponent:LoginPanel) {
      super(NAME, viewComponent);
      LoginPanel.addEventListener(LoginPanel.TRY_LOGIN, onTryLogin);
    }

    override public function listNotificationInterests() : Array {
      return [ LoginProxy.LOGIN_FAILED, LoginProxy.LOGIN_SUCCESS ];
    }

    override public function handleNotification(note:INotification):void {
      switch (note.getName()) {
        case LoginProxy.LOGIN_FAILED:
          LoginPanel.loginVO = new LoginVO();
          loginPanel.loginStatus = LoginPanel.NOT_LOGGED_IN;
          break;
        case LoginProxy.LOGIN_SUCCESS:
          loginPanel.loginStatus = LoginPanel.LOGGED_IN;
          break;
      }
    }

    private function onTryLogin(event:Event) : void {
      sendNotification(ApplicationFacade.LOGIN, loginPanel.loginVO);
    }

    protected function get loginPanel() : LoginPanel {
      return viewComponent as LoginPanel;
    }
  }
}

This pattern is what is known as either a Supervising Presenter or a Passive View. These patterns both extract behaviour out of the view and into a presentation class coupled with the view. In addition, in both patterns, this is done in a “presenter knows the view, but the view does not know the presenter”-way. What separates these two patterns from each other is how much logic to extract. In the case of a Passive View, all logic possible is extracted from the view, putting all responsibility on the presenter to control and update the view. This allows for easier testing but also a lot more work on the presenter class.

So, which flavour is the mediator? In my opinion, the mediator comes closest to being a Supervising Presenter, at least if I look at the LoginPanel example. In that example, model instances are used in the view, and databinding is used (still within the view), to bind form fields into the model instance. In addition to this, the documentation for the puremvc mediator says:

A View Component should encapsulate as much of its own state and operation as possible, exposing a simple API of events, methods and properties.

The responsibilities for the Mediator are primarily handling Events dispatched from the View Component and relevant Notifications sent from the rest of the system.

This shows, that a mediator is supposed to put some burden on the view, while keeping itself lean.

How Cairngorm Applies UI Patterns

Cairngorm has no notion of a mediator, a supervising presenter, passive view or anything like it. Actually, it has been bashed upon by many, as it advocates a solution of simply data-binding of view component state directly up into the model. And to make matters worse, the model is simply a global state, expressed through a singleton.

Looking at the Cairngorm documentation and the examples (both the introductory contact management app and the “advanced” Cairngorm Store), only make this stand out even more clear. The views have lots of logic, and as such operates as what is known as the Autonomous View pattern. So, what is an autonomous view? Martin Fowler describes it as:

Puts all presentation state and behavior for a window in a single class.

which to me is a bit like having a no pattern pattern. Simply chunk everything together. This, combined with the fact, that the autonomous views in a Cairngorm based application are advocated to databind directly into one global model instance, makes for really bad separation of concerns between the view and the model.

Even though I think that most of us can agree on the above being a really bad solution, it does not make all of Cairngorm bad. You “just” have to know this up front, and do some extra work yourself. One way to solve this in Cairngorm, is to introduce your own presentation class, separating the view better from the model. In addition to this, you get the option of choosing something else, than a supervising presenter as PureMVC advocates. But, you are ending up coding something to fix a mischild of Cairngorm, something that is already build into PureMVC. In addition to this, if you do not want to databind directly into the model, you will have to think of a way to get databound data from the presenter back into the real model.

Conclusion

So is PureMVC better then? This is a question, that cannot be answered by this post alone. The UI patterns is just one part of both frameworks, albeit an important one. One could argue, that you get more out-of-the-box with PureMVC, the mediators being a builtin concept of the framework. The mediators and the communication from and to mediators through notifications, have been nicely worked into the PureMVC framework.

Further Reading

If you found this article interesting and want to know more, I recommend looking at these resources:

08 Jun

What Is The Big Deal With Flex?

Are you a Java developer with the thought: “What the f*** is up with all the flex hype here in the Java camp? Is flex not just the same old closed flash world like always?”. If so, then this post is for you.

In my recent post Flex Leads to Clash Between Java and Flex Communities, I wrote that many Java enterprise developers are looking into and actually taking flex into their fold of tools and frameworks. Why is that? How has Adobe come to convince us, that flash is a good thing for websites?

Well, here is my short list of reasons for liking it.

Flex Development Is Not Like Traditional Flash Development

You do not need a closed IDE, which operates with concepts like scenes and timelines. You work with UI components and containers as you now it. Like Button, CheckBox, TextInput and Box, Form, Panel, Canvas. These are all understandable concepts, for us Java programmers. In addition to this, you define the layout in a open, easily readable and editable xml file, like this little example:


<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
  <mx:ComboBox>
    <mx:dataProvider>
      <mx:ArrayCollection>
        <mx:String>AK</mx:String>
        <mx:String>AL</mx:String>
        <mx:String>AR</mx:String>
      </mx:ArrayCollection>
    </mx:dataProvider>
  </mx:ComboBox>
</mx:Application>

Working with mxml like the above, to declaratively define the UI is a nice thing. One can do it dynamically in ActionScript3 though. And what is ActionScript3 know? Well, to me, it is Javascript but coming close to a “real language” :-) in that I can add in type information, and get all kinds of nice compile time type-checks. Here is a small example of some AS3 code:


package net.techper {

  import mx.core.Container;
  import mx.controls.Button;
  import mx.events.*;

  public class MyButton extends Button {
    public function MyButton() {
      super();
    }
  }
}

Looks awfully familiar to a long time Java programmer, doesn’t it?

And did I mention. It is still just plain text files, with xml and as3 source in it. No binary, closed format, project files neccessary.

And what about building then. Adobe push Flex Builder hard, but you can do nice without it. The free SDK compiles nicely and there are several maven plugins for it too. Personally, I edit the sources with IDEA (which have basic flex support now, and getting better in the upcoming version 8), compile with maven and I like it.

You Can Apply It At The View Only

Flash shines at the client in the browser and not many other places. Adobe push their server-side framework Flex Data Services, but I see that mostly as a way for non Java enterprise developers to get started. A good Java enterprise developer eat architectures like FDS for breakfast, and as a consequence of this, can integrate their existing server-side architectures with a flex/flash frontend in no time.

After all, you can let the flex client call web-services, simple http calls, amf and even hessian services. The options are many and open.

The Output Looks Nice…Everywhere

You can do some cool stuff with the flashplayer. No doubt about it. And without doing much, the default output from flex looks nice too. If that is not enough for you, you can apply styles or complete skins, to change appearance. If that is not enough, you can inherit the Canvas component, and do you own drawing of the UI.

What is nice about this is, that it will look the same on all flash enabled platforms. And there are many flash enabled platforms.

Approachability Is Good

And with “approachability” I mean how easy it is to get started with. You download it, unpack, set your flex home, write your first example, and their you have it, your first RIA application running on flash.

Go play!

04 Jun

When Thin Clients Grow Fat

The great flex framework from Adobe lends itself to writing “real” applications in flash. By this, I mean large, real, fat clients, filled with business logic on a large domain model. There are already examples of this around, including Adobes own Photoshop Express. This is a clear shift in movement, when compared to what flash was used to before flex came around.

The Needs of a Fat Client

But when you do start to write such fat and rich clients in a new platform, you will quickly grow into the needs of support for something more, including:

  • The need for a system architecture framework to drive the structure of where to place code (avoid unmaintainable spaghetti)
  • An application framework, to help with life-cycle, larger ui components, helpsystem, …
  • Real domain modelling, to express the domain of the business you are making an application to support
  • The ability to perform extensive, automated testing of the application

These are the exact same requirements that you have when developing large, fat, rich clients in Swing, .Net Forms or your client-side technology of choice.

Is Flex There Yet?

So, does flex have an answer to your needs on these areas? I would say yes and no. The platform is still so new, that there are plenty of room for improvement. Luckily, someone are trying to solve those problems for us:

  • Architectural Frameworks: As the big contenders there is Cairngorm from Adobe and there is PureMVC from Cliff Hall and FutureScale . But there are also new kids on the block, like Mate. Even though the current frameworks are better than nothing, I think there still is plenty of room here, to think new and do better.
  • Flex Developer Understanding: Another, and maybe even more important aspect, is the general understanding in the flex developer community, for the need of applying such frameworks on ones codebase, when applications grow large. Given that the platform is still so new, and many are “jumping onto the wagon” from different camps, it is my gut feeling, that not many of these new applications are architected very well, in their initial versions.
  • Domain Modeling: Like the above statement, I think that many are missing this area, on their first go. The language, AS3, certainly does not need anything more. You can do all kinds of domain modelling in AS3, and even feel comfortable while doing it.
  • Testability: This is a black hole in flex. Sure, there are flexunit and projects like it, but the integration into continous integration buildsystems, running headless, are weak (if at all existing). And if you need to do automated testing out at the user-level (clicking around in the application, putting values into input fields…), you will need a license, to even get near the mx.automation package.

So, is flex there yet? I would say no, but it is getting close. And I am sure it will get there, eventually.

03 Jun

Flex Leads To Clash Between Java and Flash Communities

I will go out on a limb here, and say something totally general about two developer communities, and how they view each other. We define ourselves against others (those who do not are the true innovators), and now, I will go define myself against others :-)So what do I mean? Flex have spawned a lot of interest in the Java community, and it seems to bring hords of Java enterprise developers to the flex and flash world. A world, that we, as Java enterprise developers, have shied for many years. On the other hand, flash developers have suddenly got a framework and toolchain, to build “real” applications in flash.

This brings the flash and the Java enterprise developer communities closer, which, in my opinion, seems to result in culturel clashes. And actually, these clashes are a great thing for both communities.

Java Enterprise Developers Views of a Flash Developer

Here is how I think the general Java enterprise developer think of flash developers:

  • They are not “real” programmers
  • They only do nifty little graphics and animation stuff, to create adds or stuff like it
  • They have no real detail to programming as a field of study, hence no good understanding of good developer skills
  • If left alone with a programming environment, they will eventually create a mess
  • On the other hand: They are far superior in arts and crafts, which, to a Java developer, makes them kind of a guru/wizard in that area

Flash Developers View of a Java Enterprise Developer

Here is how I think the general flash developer think of Java enterprise developers:

  • They have no real attention to detail in the view, but only hacks it to “work”, but looks like shit
  • Can, most of the time, implement a design made by real designers, but, if left alone with it for too long with own additions, they will mess it up and make it look ugly

The Good Thing

While I do think there is some truth in the above statements, I also think the important message here is, that the two communities can learn from each other.

26 May

Where is IList.addAll() in AS3/Flex?

Being used to the excellent collection apis of Java, I come to expect that of other platforms too. The Flex platform has the IList interface, which amongst other methods, has the removeAll() method. Sadly, it is missing the addAll(Collection) method, so I am left to do this instead:

coll.removeAll();
var newElements : ArrayCollection = xxx as ArrayCollection;
for each (var o : Object in newElements) {
   coll.addItem(o);
}

Which sucks.

You could help me out by voting for the issue 15638 on adding addAll() method.

20 May

Making IntelliJ IDEA Run Faster and Better

I took the time to listen to the, about one hour long, IntelliJ IDEA Architecture and Performance video, by Dmitry Jemerov from Jetbrains. Most of the beginning of the video was not very intesting for me, but 37 minutes into the video, the good stuff comes :-) Here is a little extract, of some main points of Dmitry, on how to make IDEA run faster:

Optimizing IO

A tool like IDEA is naturally heavily IO-bound, in that it needs to keep track of very large amounts of files. Not surprisingly, you can achieve better performance, if you can make IDEA do less IO or optimize the IO, that it does perform:

  • Apparently, they (Jetbrains) has done experiments and measurements, that shows 10,000 RPM drives to show better performance in IDEA. If they say so, I have no reason to doubt it. I would not have chosen that, as my first experiment myself.
  • Avoid storing source, IDEA caches or any other files related to IDEA, on network drives. That one is quite obvious, I think.

Then, there are some more specific issues on IO, which are more or less related directly to Windows users. These tips can remove signifant overhead on each file access:

  • Disable antivirus scanning on (IDEA) system directory. I have heard this one before, as a more general advice, to optimize performance on Java desktop applications on Windows. Most (if not all?) antivirus software, scan jar files too. Dmitry mentioned, that a file close operation, which should take near to no time, can take up to half a second, with some antivirus software. Auch!
  • Regularly run disk defrag. Oh, how I just hate NTFS “performance”. Currently, my laptop drive is near full, and system performance degrades like hell. And defrag is hardly possible, when nearly no space is left :-(
  • Turn off Windows System Restore. I did this, and as a side-effect, I also got 4,5GB of diskspace back. Space, that windows system restore had taken. “Nice”. Of course, there is an clear down-side of this, as you are not able to restore windows from a previous sync point. But then again, I have never had that need. It isn’t that I haven’t had windows fuck up my disk, I just have never had any chance to use this restore shit when it happened.

JVM Based Optimizations

  • Use JDK6: There are plenty of performance improvements from Sun, that helps IDEA.
  • Setting -Xmx (max heap), but “reasonably sized projects”, like the source to IDEA itself, does not need more than 300-500 megs. So do not set it too large.
  • One exception though: If you feel like running IDEA with -server, then -Xmx1G or more should let IDEA’s caches live longer (due to soft-references living longer with large mem available in -server mode). My note: Be sure you have the physical RAM available!
  • If you are on a multi-core machine, enabling parallel garbage collection can help (reduces gc pauses). Note: Some have stability issues with this.

IDE Related Stuff

Here are some stuff, which have to do with settings or the like on the IDE itself, which can help it perform better:

  • Use latest version. Well, dugh! Of course they are gonna say that. I am sure there is some truth in it, but new features also take out some performance. Take an old IDEA 4 and run it on todays hardware, and I bet you will see great performance. But who would wanna do that.
  • Disable unused plugins (like the commander? :-) It must be mostly load-time that will benefit here?
  • Exclude unneeded folders. Actually, this one could have been listed under the IO-related bullets too, as it is to reduce IO/file surveillance. An example is to exclude build-generated stuff. My note: More often than not, your source depends on the generated stuff, so no good idea excluding it.
  • Set version control to “None” for generated code.
  • Do not disable “Synchronize files on frame activation” (since 6.0.2). Supposedly, they have done something great, for this file synch to not be a (big) problem anymore.
  • Use “Project” mode in the “Project view”, as the “Package” mode is slower. A bit of a surprise to me, but they actually know, that they have a performance problem when using “Package” mode. No problem for me, as I am nearly always using the “Project” mode anyway.
  • Disable expensive inspections: Some of the inspections IDEA performs are supposedly heavy. Sadly, there is no advice on which to disable, so…
  • Disable framework-specific validation (JPA, spring, …) on Make: I have done this myself sometimes, but mostly due to validation errors that were actually wrong, and was wrongly failing my build. But it does perform faster builds without. Also, not that big a problem, as I mostly build from outside IDEA, using maven.
  • Do not use method breakpoints: Apparently, you can experience slow debugging if you use method breakpoints. This is said to be a JDK issue.

This was the complete list of advice on upping the performance of IntelliJ IDEA as Dmitry said it.

Q and A

Then came the Q and A part of the presentation. Here are some of the interesting ones related to performance:

  • Q: Synchronizing a lot of changes from disk pegs one cpu/core. How come?
  • A: This operation is not parallelized (…yet, it will be in v8 with the new indexing framework)
  • Q: Restart required on plugin install. How come?
  • A: Blah blah, plugin might not work otherwise. Blah blah. We might make this better in v8. Blah.

A Bit About Version 8

Apart from the performance stuff, there were some bits of information on the upcoming version 8 in the video. Many of the things they are building seem to emphasize language indendency, as in, they are general operations or frameworks, that can support all languages. This includes the new indexing framework. I guess this is due to plans on supporting much more languages in their IDE, and I think I heard Python mentioned (but okay, the talk was at google, so… :-)

That were the highlights as I heard them, but go see/hear the video yourself, if you want the details.

19 May

IntelliJ IDEA 8 Will Kill the EncodingPlugin

…which is a good thing.

I just read the post New Approach to Encoding in IntelliJ IDEA, which outlines new features in the upcoming IntelliJ IDEA version 8 with respect to file encoding. It has long time been a problem, that IDEA only had an IDE-level setting for encoding of files. It was this problem, that led me to write the EncodingPlugin, which at least could warn you, to keep you from trashing files with other encoding, than the IDE-level setting.

With the new features coming in v8 on encoding, I am quite confident, that my EncodingPlugin will have no use in future IDEA versions. And that is a good thing!

17 May

Conditional Page Rendering in Java Web Frameworks - Best Practices?

This is a post, that requires your input :-) I want to harvest the information in your brains, on how your favourite web framework is best at not cluttering the view pages, when you need to show them differently for each user or state of the application.

Definition: Conditional Views

I have no better name, than “conditional views”. Often, when I create web applications, the views (pages) of the application, needs conditional expressions, which makes them show up differently, typically dependent on the abilities of the current user. This could be as simple as checking some role, but also “complex” as in checking some application domain logic specific conditions, to determine if an input field should be editable or not.

In simple JSP, it is something in the lines of this:

  <% if (someexpr) { %>
        <input name="onlyIfSomeExpr" type="text"/>
  <% } %>

and of course this can be put a little more nice, by using JSTL or tags like it, as this shows:

  <c:if test="${someExpr}">
      <input name="onlyIfSomeExpr" type="text"/>
  </c:if>

When It Becomes Messy

The above examples might not seem as such a big deal, but when the if-then-else parts of a view becomes many and in multiple levels, we quickly loose overview of when form tags close etc. It can quickly become really messy.

How To Do It Then?

Is there any good way, to keep the views simple, as the complexity in the conditional rendering of pages go up? I have tried many web frameworks over the years, but never found one, where this was not a problem. Tapestry has nice POJO-based, component framework, but still, @Conditional shows up as if-else in the templates. Grails/Rails have views that are basically JSP, but with other syntax. Etc.

Is there a great library, to help me solve this problem? Maybe some filter to post-process output? But still, I would have to markup the produced output somehow, to make the filter be able to do its work. I do not know. Do you?

16 May

64bit Flash Player on Linux - Do It Yourself

In a recent blog post, James Ward from Adobe write about where the 64bit support for flash player on linux is. The main point in the post is, that Adobe, by open sourcing the VM of the flashplayer in the tamarin project, has made it possible for us to do the 64bit support for them. He points out, that getting 64bit support is not just a simple recompile, due to the JIT compiler in Tamarin producing 32bit code. He then finishes the post with:

“…This IS open source! You can help get 64-bit Linux support for Flash Player!”

Is this what we had hopen for, when Adobe started opensourcing parts of the flashplayer? Is this really Adobe saying, that if we want 64bit support, we should go develop it ourselves? By the way, even if someone did (and I sure am not qualified to do so myself), that person would not be able to produce a 64bit linux player. Because that tamarin build would have to be integrated with the not-yet-open parts of the player.

And even if we could, would we do it? Is this the attitude and angle on opensource, that we want from Adobe?

© 2008 Tech Per | Entries (RSS) and Comments (RSS)

GPS Reviews and news from GPS Gazettewordpress logo