Sencha Inc. | HTML5 Apps

Blog

Sencha Ext JS Customer Spotlight: Altus Ltd.

June 29, 2012 | Martyn West

Altus Logo
Altus is a self-funded products and consultancy company targeting the financial services sector. We are based in the historic city of Bath, and have about 40 members on staff. We have used Ext JS for our last three products; two being developed using Ext JS 2, with the latest, the Altus Transfer Gateway, using Ext JS 4.

The Altus Transfer Gateway (ATG) is a product that fund managers and fund platforms can use to help them transfer accounts and their held assets between two parties, the ceding and acquiring platforms. These transfers are performed electronically by sending ISO2022 XML messages over the SWIFT network, using the UK funds market practice group (UKFMPG) message set.

On the server-side we use SQL Server for our database, with C# web services sitting behind an Ext.Direct router implementation. There are also a few Windows Services that handle our inbound and outbound SWIFT communications, and other scheduled tasks that need to be performed as a background process. The client is written exclusively in Ext JS 4, currently on version 4.1.0.

Screenshot
One of our heavily customised trees displaying an account transfer, its account and investor details, and its contained assets

Screenshot
A page displaying tabbed grids for viewing and managing documents and messages sent and received over the SWIFT network. Message content can be viewed using our custom XML viewer.

Why We Chose Ext JS?

Ext JS gives our clients and us a true desktop-like experience across browsers and operating systems without having to deploy any software or browser plug-ins on client machines. Our target market is financial institutions, which have complex enterprise software and browser deployments. Being deployed through the browser is extremely important to this market, where any changes on the desktop generally lead to huge projects managing the upgrade or rolling out software to a very large number of machines.

After using Ext JS for so long, it’s easy to take for granted all of the rich components you get: fully featured grids, with both client and server side sorting, filtering and paging are simple to include and configure. Rich tree controls provide us with a great way of viewing hierarchical data, and the simple form production with extensive field support really set the framework apart from the competition.

Ext JS gives our clients and us a true desktop-like experience across browsers and operating systems without having to deploy any software or browser plug-ins on client machines.”

With Ext JS, prototyping is also incredibly quick. It enables us to test product ideas early, and cheaply, so we can determine if there’s enough market demand to make it worth pursuing. For example, we wrote a prototype of ATG in a few days, covering all of the main screens, so we could take it to potential clients and see if there was a market for our idea; there was, so we started development on the server-side shortly afterwards. We started the client-side with the release of Ext JS 4 developer preview.

Ext JS 4 is such a leap forward. Our applications are large and complex, so maintainability is incredibly important. The new Ext JS MVC architecture and class loading system helps massively, promoting extensive code reuse and enabling us to stay productive, so we can concentrate on what we need to do, not how. During development, we can dynamically load the classes we’re building with minimal wiring up. For deployment, we can use the SDK to build a single minimized JS file that not only makes deployment simple, but also helps performance for our clients.

Given that we skipped Ext JS 3, Ext JS 4 has given us our first opportunity to use Ext.Direct for client/server communications. The call batching support alone is worth the investment, saving a very large number of HTTP requests, particularly at application startup time. The automatic call retries, and the fact that all of the complexity of making calls is handled for you really does make it feel like you’re calling a client-side method.

The browser-native charting is also a great addition; its high performance, flexible, and does not require any browser plug-ins. We use charts to enable our client’s performance against their configured SLAs, and those of the other parties they deal with, to be visualized in an easy to understand manner. It’s great that they use the same model/store backend as other components, making their production a straightforward process.

Screenshot
Our SLA reporting page, showing our performance measured against our SLA’s when responding to the selected product provider for the different types of messages.

Business Value of Using Ext JS

ATG consists of over 600k lines of server-side C# (including an application framework we’ll be using for years to come), and over 75k lines of client-side JavaScript, not including blank lines or comments. Most of the client-side code was written by 1-2 developers, with one or two others chipping in during big feature pushes or bug fixing phases. We delivered the initial version of the product inside 12 months. Without Ext JS, this would not have been possible; it would have been too big an undertaking. Ext JS provides so many features that it feels like you’re simply assembling and laying out components rather than writing huge amounts of code.

Our Advice to New Developers

Read the API documentation, use the forums and learn your way around the Ext JS source code.

The superb community is one of the best things about using Ext JS, in our opinion. Our posts on the forums generally get quick and concise replies. When you’re struggling to solve something, or find out how to approach a task, remember that somebody has almost certainly attempted the same thing before. There will likely be a thread that will help you find a solution, or give you hints on where to look. Getting involved can also give you insight into why things work the way they do, and how to approach a solution or workaround.

Finally, while the API documentation is a superb resource, not everything you need to know is in there. As Sencha engineers will tell you, don’t be afraid of the source code; familiarity with it will help you a lot, and may even give you some ideas for extensions you want to write!

Final Thoughts

I used to write complex client desktop applications, with extensive custom controls, and plenty of eye candy and animation. I never thought you could get that kind of experience on the Web, but Sencha has done a superb job letting us do that with Ext JS 4. My colleagues and I look forward to what’s coming in the future.

There are 8 responses. Add yours.

Westy

3 years ago

Fame at last! :D

frank

2 years ago

Nice, isn’t it?

AwesomeBobX64

2 years ago

Hats off to you guys for making use of those famfamfam icons as well. They’re a huge help for my custom shopping cart app.

Hudson Kisitu

2 years ago

this is really so kool :D !!!

Any Bina

2 years ago

Very useful article so far! I just pleased to read about this. love this entry and all these information also. I got some good information about Altus products. Thanks for this allocation. LOL

Nick

2 years ago

nice,isn`t it?thanks,was a very helpful article

buchservis-tm

2 years ago

I give oglasy with Any Bina. I too very much was assisted by kool

momentalnyj zagar

2 years ago

Rather interesting material. it was pleasant to familiarize.

Comments are Gravatar enabled. Your email address will not be shown.

Commenting is not available in this channel entry.