Flex vs ExtJS for internal system front end, what are their strengths and weaknesses?
Asked Answered
O

3

5

Looking back at an internal system I just built, the common server / page model with minor use of Ajax for some UI components. I'm not sure if I'm satisfy with the end result because it seems like we spent too much time on the frontend. Not a big fan of going through all the trouble for styling and making sure the CSS works right.

So I started thinking, are there better tools for the frontend?

How do Flex and ExtJS compare? maybe in these areas?

  • learning curve
  • functionality
  • layout (without maintaining CSS)
  • ease of implementation
  • testability (TDD in Javascript vs in Actionscript?)
  • performance
  • maintainability

Please do not close this, I'm just asking for feedback from ppl experienced in Flex, ExtJS or both.

Thanks all!

Overcrop answered 19/6, 2010 at 0:30 Comment(0)
C
7

I will start with my executive summary:

If I had to choose right now, I would go with Flex. Databinding and server communication are extremely easy, intuitive, and quick to set up. You'll find that if you're doing a lot of layout and the View of MVC-style frameworks, that Flex is probably going to get you set up more quickly, and it'll be easier to read.

Comparing Markup

Flex focuses a lot on MXML, which is the markup language. It's going to be brand new for most of your developers, so if they already know HTML/JavaScript/CSS, this might be a point off. The strength of Flex lies in that it's not limited like HTML. If you want a property, or a databinding, you can do it directly on a tag. Maybe not always best practice for everything, but you can.

ExtJS takes the approach of augmenting standard markup with JavaScript, so while your HTML certainly needs to be done well, it's really the JavaScript shining through, doing the work.

Components/Functionality

Flex is better at data handling. It uses E4X, which is an inline XML querying language that uses dot syntax. BookCase.Books.Book[@id=43].@title, for example.

ExtJS also does databinding, but it's more verbose, and not dead simple like Flex.

Flex has a lot of really nice built-in components for layout modeling, input, and charts. They're easy to use, have a common styling interface (generally), and can have custom styling and a subset of CSS, plus some proprietary extensions. ExtJS uses standard CSS markup, rather than just a subset.

ExtJS has more plugins and components than Flex, and the Menu control is far more customizable and looks better. Default styling is also a bit prettier in ExtJS.

Layout Engine

Flex wins this one hands down, in my opinion. If you want a column layout, you can either do a grid or a flow layout to achieve it, and in about 4 lines of MXML. The same in Ext requires a Javascript object to be passed through a layout class. IMO, it's more difficult to work with practically.

Implementation

Both systems are easy to deploy and maintain. Copy files, and both will work if you are doing continuous integration.

Testability

You can use jsUnit for ExtJS, and FlexUnit for Actionscript. How easy this testability is to manage depends entirely on your control of development style. Both frameworks will lead to a mix of UI with test-worthy code, with ExtJS requiring more separation by default.

If you set it up right, there is no clear advantage here.

Performance

Internet Explorer on Windows has the best Flash performance, sadly enough. If you are using a Mac, you may see slowness during initial plugin loading. Flex in production needs to be running a production release, and you need to be running the production Flash player, rather than the debug version. In our environment, production release + production Flash Player reduced the initial loadup by 4-6 seconds, so make sure you compare apples.

Animations will be faster in Flash, but honestly you're not really going to see a whole lot of a performance issue unless you're doing heavy data processing. If this application has a lot of animated charts, sliding animations, and things of that nature, you should go with Flash. That's what it's built for and it's good at it. If you're just going to be hiding and showing portions of the screen, and maybe doing basic animation, ExtJS will win.

Maintainability

Both have the serious potential to become monsters. Flex will be a monster if everyone codes everything in MXML and never writes scripts or external CSS. ExtJS will be a monster if you overarchitect how to handle the data and the layout managers.

The good news is that both can be successfully maintained in a developer friendly way, and both can fit into a continuous integration process, start to finish.

Hope this helps.

Chondroma answered 19/6, 2010 at 3:5 Comment(6)
Great answer. I completely agree. If you struggle with web front-end stuff and don't have any good reason to do HTML/CSS, then Flex is probably a better fit.Poetess
Great answer! I'd add that with Flex/Flash Player there is support for AMF, a binary data transfer protocol; which provides a much smaller size than XML for data transfer. Most server side languages support some form of automatic conversion from server side object to AS3 object so you don't have to do that processing manually on the client. I'd also add that Flex has a lot of tooling options including Flash Builder & Flash Catalyst, PowerFlasher FDT, IntelliJ, and 2 Visual Studio plugins. The Interactive Debugger and Profiler are great if you need them. I'm not sure what tooling extJS offersRufena
Yup, and you can always gzip XML payloads that you control as well. No work required other than 15 minutes of setup on your server. I also should mention that Flash is often faster at data processing, not just animations. Running through loops of XML data and arrays is usually faster, especially if the client is running Flash 10.Chondroma
A lot of things have changed since 2010. ExtJs 4 is out and Flex went open source. Will your answer be the same today?Defenestration
I have some pretty strong disagreements with the byzantine architecture of Ext 4. It's unwieldy, IMO, but still it is possible to build good things with it. The world is moving away from Flash, obviously, but I don't think ExtJS is necessarily where you should turn.Chondroma
have things changed since 2010, or are your thoughts still the same?Paramour
U
2

I agree with Jordan about the architecture and maintainability superiority of Flex over ExtJs, however, having developed large systems in both I will say this as conclusively as I agree with Jordan: that Flex as a front end is much slower than ExtJs. Generally once the data is received by the Flex front end, rendering it into, say a grid, is much slower than doing the exact same thing with ExtJs. Also, screen updates in Flex have that problem that Java applets have - grey areas that aren't refreshed that quickly. The user experience is much better than ExtJs, particularly if your data sets become large. Flex just does not perform quickly, no matter what browser you use.

The rendering in Flex is also not as razor sharp as it is in ExtJs. Look at the widgets and the text, and compare them side by side and you will see what I mean.

So in summary while development in Flex is superior to ExtJs, the user experience is the opposite and ExtJs wins there.

Undermanned answered 27/12, 2012 at 7:3 Comment(0)
R
2

Just FYI, for anyone stumbling onto this question as of late 2012, since Flex was open sourced by Adobe earlier this year (read: "abandoned") you should strongly consider whether or not it's the best choice for new development at this point. In fact, in Adobe's own words:

In the long-term, we believe HTML5 will be the best technology for enterprise application development.

While there are of course many HTML5 frameworks available, Ext is actually a nice transition for Flex developers (so I've been told, I've never used Flex myself). The component model, UI widgets, layout concepts and general development styles are fairly similar, and Flex developers I've worked with have tended to catch on to Ext concepts quite readily.

Reverence answered 27/12, 2012 at 16:56 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.