cheers und Grüße nach Berlin,
Sebastian

cheers,
Sebastian

p.s.: Passende Meetings sind bereits in der Vorbereitung

Mehr Informationen gibt es hier.

Grüßen,
Fabian

Problem

Leider hat diese Erweiterung auch seine Schattenseite: Denn wenn man sehr viele dieser in der Flash IDE erstellten Flex Komponenten in einer Flex Anwendung einsetzt, kann es schnell zu Performance Problemen kommen.

Zu dieser Problematik findet man aktuell sehr interessante Beiträge, u.a. in den Blogs von scalenine: “Performance Issues Using the Flex Component Kit for Flash“, Behind the UI: “Flex Component Kit: CPU black hole” und Patrick Hansen: “Flex Stateful Skins vs. Stateless“.

Das Performance Problem liegt in einem enterFrameHandler des UIMovieClips (siehe Original Source), welcher bei jedem Event.ENTER_FRAME checkt, ob sich die die Größe oder sich der State (welcher über Frame-Lables auf der Timeline des MovieClips definiert wird) der Flex Komponente ändert. Das ist notwendig, da ein Flash MovieClip keinen Validierung bzw. Invalidierungsprozess wie bei einer UIComponent besitzt. Nicht unbedingt die eleganteste Lösung, denn jeder Entwickler aus der Flash-Welt kennt die Performance-Bremse, die von unzähligen MovieClips mit unzähligen ENTER_FRAME Handlern ausgelöst werden kann

Lösungen

Derzeit sind zwei Lösungen zu finden:

1. Verwenden von sogenannten “Stateless Skins” nach Patrick Hansen

Soll ein Skin eingesetzt werden, diesen als “Stateless” und nicht als “Statefull” Skin in Flash definieren.

Ein Statefull-Skin ist ein MovieClip, der seine States über die Timeline definiert. Diesen nutzt man beispielsweise, wenn man bei Flash eine Button-Komponente wie folgt erstellt (installiertes FCK vorausgesetzt): File new -> Templates -> Flex Skins -> Button. Dieser Button hat all seine States “up”, “over”, “down”, “disabled” auf der Timeline definiert.

Screen: Timeline eines Buttons als Statefull-Skin-Komponente

Besser ist dagegen ein Stateless Skin. D.h. für jeden State wird in der Flash IDE ein eigenes Symbol angelegt und über einen Identifier verlinkt. Diese Symbole erben nicht von UIMovieClip und haben somit keinen enterFrameHandler.

Screen: Verlinkung eines ComboBoxArrow-DisabledSkin als Stateless-Skin

2. UIMovieClip Erweiterung von Guillaume Malartre

Diese Erweiterung überschreibt Adobes UIMovieClip, um den enterFrameHandler “auszuschalten”. Nachteil ist hierbei, dass keine Größenänderung mehr stattfindet, sobald sich die Größe der Parent-Komponente ändert und die “eigene” Flex Komponente nach der Initialisierung darauf reagieren soll.

Frohes Flex-Tuning

-Jens
[ www.websector.de ]

Die erste Ausgabe beinhaltet u.a. Interviews mit dem Ribbit-Jung Chuck Reebman sowie mit Ryan Steward über Flash Catalyst und ein Video-Rückblick auf einige US-Flash Events. Außerdem zeigt Lee ein “behind the scenes” über seine Flash Tutorials von gotoAndLearn.com.

Das Ganze ist mit viel Humor und super professional gemacht. Die Videos sind mit fetten Beats unterlegt und vor allem das Silverlight-Intro hat es in sich

Absolut lohnenswert, sich den Podcast gleich über den iTunes-Store kostenlos zu abonnieren! Übrigens, die Videos sind jetzt für iPod und iPhone optimiert – genial!

Thank’s Lee for such an awesome magazine!

-Jens

Es lohnt sich die Folien dieser Vorträge (Vortrag 1, Vortrag 2) sehr genau zu studieren. Denn auch wenn Cairngorm als Architektur-Framework schon einige Jahre eingesetzt wird und viele Flex Entwickler mit Cairngorm gut vertraut sind, herrschen noch sehr unterschiedliche Meinungen und Strategien beim Einsatz des Frameworks, nicht zuletzt wegen der mangelhaften Dokumentation.

Auch wenn sich Cairngorm in der Grundstruktur über die Jahre kaum weiterentwickelt hat, haben sich die aktuellen “Best Practices” bei Adobe Consultings wesentlich geändert. Ein Grund mehr, auch seinen eigenen Einsatz von Cairngorm zu überdenken.

Hier ein Überblick über die Experten-Tips:

1. ModelLocator
• ModelLocator ist im wahrsten Sinne des Wortes ein “Ort für Models” D.h. der Model Locator hält typisierte Model Objekte. Dazu gehören u.a. Presentation Models, globale Informationen (z.B. UserVO), globaler Applikation-State. Dazu gehören aber keine Eigenschaften wie z.B. “address”, “country” usw.
• Schluss mit den unzähligen “ModelLocator. getInstance()”! Der ModelLocator wird nur einmal im (Haupt-)View über getInstance() aufgerufen. Alle weiteren Views werden ihre notwendigen Models injiziert (Stichwort: Dependencies Injection ). D.h. ein View wird nur mit seinen notwendigen Daten per Referenz “befüllt”, z.b. mit seinem Presentation Model (siehe Punkt 2) oder einem Top-Model-Object. Aber auch mit dem ModelLocator selbst, falls es notwendig ist.
2. Presentation Model (PM)
• Vorab: Wer mehr über den Einsatz von Presentation Models erfahren möchte, hier zwei sehr empfehlenswerte Artikel:
  - Martin Fowler: Presentation Model
  - Paul Williams: Presentation Patterns – Presentation Model
• PM präsentiert das Verhalten und die State eines oder mehrerer Views, d.h. soviel Code wie möglich wird von dem View in sein PM ausgelagert. Dazu zählen: View-Daten (z.B. gefilterte Listen von Produkten), View-States (z.B. selectIndex eines ViewStackes), View-Logik (z.B. State eines Absende-Buttons innerhalb eines Formulars)
• Ein View beobachtet über Bindings Änderungen von Model-Daten.
• Ein View kennt sein PM, aber ein PM nicht die Views.
• Über das PM wird die View und Business-Logik getrennt. Sollte ein PM zu viele Verantwortlichkeiten erhalten, empfiehlt es sich, Teile der Business-Logik in weitere externe Klassen auszulagern
• PM verarbeitet auch Fehler, z.B. bei serverseitgen Abfragen von Daten (siehe auch Punkt 3)
3. Updaten von Model-Daten
• User-Gesten vom View werden direkt an sein PM weitergegeben, um von dort Cairngorm-Events abzufeuern. Das Event landet wie gehabt im entsprechenden Command.
• Commands sollten keine direkte Referenze zu Models haben und somit die Model-Daten selbst nicht updaten. Stattdessen schicken die Cairngorm-Events Model-Callback-Funktionen als Referenzen mit, welche dort (z.B. im PM) direkt geupdated werden
• Serverseitige Daten werden über Delegates abgearbeitet, welche über Responder das Ergebnis weitergeben. Dabei wird empfohlen, für die Responder eigene Klassen anzulegen. D.h. die Commands brauchen nicht das IResponder-Interface zu implementieren.
• Im Command werden Responder-Klassen erstellt, welche ebenfalls ebenfalls eine Referenz zu den Callback-Funktionen erhalten, welche von den Cairngorm-Events “übermittelt” werden. Damit können die Responder innerhalb ihrer result- oder fault-Methode diese Callbacks aufrufen, welche dann Model-Daten updaten. Um das Fault-Handling zu vereinfachen, wird zudem eine Super-Klasse für die Responder emfpohlen, welche das Error-Handling bereits implementiert
4. Controller
• Große Controller sind zu vermeiden: Statt den Controller unübersichtlich mit unzähligen “addCommand(…, …)” zu befüllen, bieten sich SubController an oder einfach auch Methoden für bestimmte Mappings, wie z.B. addAccountManagementCommands()
5. Views
• View erhalten ihre Daten über Binding zu ihrem Model (PM)
• Logik der Views wird weitgehendst in PM ausgelagert (siehe Punkt 2). Dazu zählt aber nicht die Logik des User-Interfaces, wie z.B. Animationen, Drag und Drop, Stylen von Grafische Elemente, usw.
• Custom Components sollten keine Referenz zum ModelLocator haben. Stattdessen sollten die notwendigen Daten injiziert werden (siehe auch Punkt 1)
6. Unit Testing
• Aufgrund des massiven Einsatzes von PM sind Model-Daten gut testbar! Falls nicht, sind in den PM noch zu starke Abhängigkeiten.
• Business-Logik in eigenen Klassen halten. D.h. raus aus Commands, Delegates, Responders.
• Zum Testen von Delegates empfiehlt sich das Verwenden von Factory-Klassen, welche mit Einsatz von Interfaces ein “produktives” und ein “testbares” Delegates liefert
7. Cairngorm Plugin für Flex Builder
• Absolut empfehlenswert für noch schnelleres Arbeiten: Cairngorm Plugin bei Adobe Open Source

Übrigens: In den o.g. Folien der Präsentationen der Adobe Consultings findet Ihr auch eine Menge Code-Beispiele, die es sich ebenfalls lohnen, genauer unter die Lupe zu nehmen

[NACHTRAG v. 13.01.2009] Ab heute ist die o.g. Cairngorm Präsentation von der Adobe MAX in San Francisco als Video auf AdobeTV online (via: Ted Patrick ). Hier könnt Ihr sie selbst noch einmal verfolgen. Prädikat: Sehr lohnenswert!! [/NACHTRAG]

-Jens
www.websector.de

Was ist Flex Authority?

Original-Text:

Flex Authority provides the Flex developer with expert content that is easy-to-read and expertly edited. We bring you the important information you need to be the best developer you can be – “Your Guide to Efficient Flex Development” – while making each issue engaging and informative.

We’ve also designed the format of each issue for easy reference. Our journals are not thin magazines; they’re slick mini-books, 6 by 9 inches (just the right size to put in your briefcase or pocket), perfect bound like a book, printed on high quality paper in full color.

Our Editor-in-Chief is Jeffry Houser, producer of the Flex Show, so we are deeply involved with the community. Our first issue, “Flex and AIR”, was out in mid-August, and premiered to many rave reviews. Our second issue, “Components: The Building Blocks of Your Application”, is coming out this month. You can see the table of contents of our first issue online and read Jeff’s editorial for that issue as well.

Flex Authority is available as a print subscription for $49.95 plus postage, as a PDF subscription for $27.95 (print subscriptions include PDFs as well), or as a single issue sale in both print and PDF format – Print issues sell at $14.95 each (plus postage) while PDFs sell at $7.95 each. They can be ordered from https://secure.houseoffusion.com.

(Allgemeiner) Review der aktuellen Ausgabe “Flex And AIR: A New Age Of Desktop Development”

Vorab durfte ich bereits die aktuelle Ausgabe (Issue 1) begutachten und kann sagen, dass es sich diese Ausgabe wirklich lohnt! Einen kompletten Überblick über den Inhalt gibt es hier: http://www.flex-authority.com/flex-and-air/

Trotz der schweren Aufgabe von Print-Ausgaben, sich gegen die Schnelllebigkeit von Inhalten und der Informationsflut durch Blogs, Foren usw. zu bewähren, sind die Inhalte sehr informativ und lesenswert. Die Themen sind breit gefächert, aber dennoch nicht “abgenutzt”. Schön auch, dass mehr oder auch weniger bekannte Leute aus der Blogger-Szene dort als Autoren wiederzufinden sind und auch Interviews mit Ihnen durchgeführt wurden (z.B.  Jeffry Houser , Interview mit den Merapi Team Leaders ). Jede Menge Beispiel-Code (auch zum Downloaden) runden das Ganze ab. Sehr angenehm ist auch das Pocket-Format, auch wenn die Illustration / Gestaltung für mich sehr amerikanisch (etwas kitischig) wirkte

Gewinnspiel

Das Gewinnspiel besteht aus zwei Teilen und mitmachen können alle flexughh-Mitglieder!!!

1) Das Jahresabo (Vol. 1 Issue 1 bis Vol. 2 Issue 2, insgesamt 4 Ausgaben) sowie zwei Ausgaben der aktuellen Ausgabe werden beim nächsten Meeting unter allen anwesenden Teilnehmern verlost.

2) Da das Meeting bereits “ausverkauft” ist und auch alle anderen etwas von dem Gewinnspiel haben sollen, verlosen wir ebenfalls drei Ausgaben unter den flexughh-Mitgliedern, die nicht beim nächsten Meeting dabei sein werden.

Einzige Voraussetzung ist, dass Du in der flexughh-Gruppe bei XING angemeldet bist und eine Email an raffle@flexughh.de mit Deinem Namen, Anschrift, Telefon und Email sendest. Deine Daten werden nicht an Dritte weitergegeben, lediglich die Daten der Gewinner an Flex Authority zur Gewinnübermittlung.

Achtung: Einsendeschluss für Teil 2 ist bereits am Montag, 08.12.2008, 17 Uhr!

Viel Spass!

[NACHTRAG] Gewinner [/NACHTRAG]

Die Gewinner wurden gestern während des flexughh-Meetings ermittelt. Die Gewinner der Teilnehmer aus der flexuhh-XING-Gruppe (Teil 2) findet Ihr hier. Alle erhalten in den nächsten Tagen Post von “Flex Authority”.

Vielen Dank für Eure Teilnahme und viel Spass beim Lesen und Coden

-Jens

Hier findet Ihr alle Videos aufgeteilt in 5 Sessions:

• Teil 1
• Teil 2
• Teil 3
• Teil 4
• Teil 5

-Jens

Für Fragen zu den Tutorials gibt es außerdem ein eigenes Flex-In-A-Week-Forum.

Und nicht zu vergessen, bei allen weiteren Fragen zu Flex gibt es ja noch die flexughh-Meetings, wo Ihr Euch regelmäßig mit weiteren Flex-Begeisterten aus Hamburg und Umgebung austauschen könnt. Übrigens, das nächste Meeting ist am 25. August

-Jens

Wer seine Flex App im Kleinen bekannt machen möchte kann hier auch einfach einen Kommentar posten oder es auf einem Usergroup Treffen vorstellen.

InsideRIA, eine Kooperation von O’Reilly und Adobe, sollte man eh in seinen RSS Reader aufnehmen. Die Artikel sind alle von bester Qualität.