The all new Ext JS charting engine was completely rewritten for its latest version, Ext JS 4. The new charting system was developed by Sencha, in cooperation with the founder of Raphael JS.

What makes this system so great is that it is able to calculate, render and animate a large array of amazing charts using JavaScript. As all modern browsers possess a build in JavaScript engine, Ext JS 4 no longer needs to rely on flash to create its charts, as it did with previous versions. Not only does this allow charts to lose any dependency with flash or external plugins, it also means that all components of the chart are rendered directly into the browsers DOM. This allows the charts with their data, fully accessible by JavaScript, making them extremely flexible and customisable.

Creating A Simple Chart

Creating a chart in Ext JS 4 follows the same process as creating nearly any component, using the new class system.

Ext.create('Ext.chart.Chart', {
       //CHART CONFIG
});

When you first create your chart component, it has no knowledge of which type of chart it shall become. This is defined within the charts configuration using series, axes and a store. This is the same more the majority of cases in a real world scenario. When you draw your axes for a chart, that chart could potential be many different types (Line, Column, Area, Scatter etc.).

Ext.create('Ext.chart.Chart', {
    animate: true,
    store: Ext.create('Ext.data.Store',{
        fields: ['category', 'data1', 'data2'],
        data: [
            {category: 'User 1', 25, 33},
            {category: 'User 2', 11, 54},
            {category: 'User 3', 46, 98}
       ]
    }),
    axes: [{
        type: 'Numeric',
	position: 'left',
	fields: ['data1','data2'],
        title: 'User Values',
        minimum: 0,
       	maximum: 100,
        grid: true
    },{
        type: 'Category',
	position: 'bottom',
	fields: 'category',
        title: 'User Categories'
    }],
    series: [{
        type: 'column',
        axis: 'left',
        xField: 'category',
        yField: ['data1', 'data2']
    }]
}); 

As shown in the code sample above, I have added 2 axes and a column series using the data from my store, thereby creating a Column Chart. This is a chart in its simplest form with the absolute minimum of required configuration to produce a chart.

The data for a chart comes from a store, specifying which fields represent categories, series, axis values etc. The hardest part of creating charts for a web app that work, is getting your data right. As you can see from the previous code sample, the chart uses the fields defined within the store to specify how the chart is rendered.

What Else Can You Do With Ext JS 4 Charts?

Since the charts are rendered using JavaScript, manipulating the data is really easy, therefore has allowed Sencha to provide a huge amount of customisable options.

• Legend with specified Position
• Specify minimum/maximum axis values or leave for Ext JS to calculate for you
• Create linear gradients to be used with chart components
• Chart animation
• Chart Shadowing
• Series Highlighting, callouts and tooltips
• Chart themes to customise the look and feel of a chart
• Specify the size, style and rotation/direction of chart labels
• And many more…

What makes these additional configuration options so great, is that they all work and flow completely flawlessly, solely using JavaScript.

In my personal opinion the Ext JS 4 Charts are one seriously amazing part of the framework, great job Sencha.

Follow me on Twitter for more, @webdevluke

 

Ext JS 4 is the latest version of the popular JavaScript framework developed by Sencha, Ext JS.  Since the last version, Sencha has been boasting that Ext JS 4 will be the best, most comprehensive version of the framework to date, including many new features and performance improvements. Here is my review of their latest version.

New Features – 4/5

They have really gone to town, introducing new features in this latest version of Ext JS. The main features that were introduced were the following: -

• JavaScript Charting Engine
• MVC Application Architecture
• Drawing Vector Graphics
• New Class System
• New Data Package
• Dynamic Theming using SASS

Sencha have made a real effort to provide a framework that has crossed all the T’s and dotted all the I’s, and I believe that it has done that. The new Charting engine works well and very fast, relieving many of us to know that we don’t need to rely on flash anymore within Ext JS to render charts.

However, on a negative point, it seems that in order to implement so many new features, a sacrifice in attention to details was made. Although all these features work most of the time, it seems that they were rushed into the framework and not fully integrated within all other related components within the framework. This was annoying to begin with, but forgivable due to the sheer amount of changes that the development team has made in this update.

Overall I feel that the new features really add value to Ext JS 4 and are a definite improvement upon the previous version.

Ease of Use – 3/5

Ext JS has never been popular for how easy it is to use. There is a steep learning curve in order to master its full potential. However, this latest release of Ext JS has made great steps into opening up the framework to a larger audience that previously were unable to pick up the complexity of the framework.

Ext JS 4 now has more complete documentation, better guides and simpler syntax which makes the framework more attractive to new users. However, the documentation has a fair amount of mistakes and incomplete entries within the documentation which is disappointing.

Upgrade Transition (3 to 4) – 3/5

Due to the large amount of changes and additions to the framework in version 4, upgrading your version within existing Ext JS apps was never going to be a simple task. With syntax changing, the class system revamped and some classes condensed or removed, there was always going to be a difficult migration. The Ext JS development team did make an effort to ease the migration process by providing a compatibility layer for this transition. However, this was more of an after thought and did not work nearly as well as first hoped. The migration documentation and compatibility layer were also delayed repeatedly at the first releases of Ext JS 4 which left some of the community unhappy.

Overall I felt that migrating a larger Ext JS 3 app over to 4 is a mammoth task, one which takes a lot of patience. I feel that Sencha should have given this a lot more thought right from the off, rather than leaving until late to consider it as an after thought.

Performance – 2/5

The performance is one of the biggest let downs for me. The hype leading up to the release of Ext JS 4 was promising a huge performance increase, greater than any version before. Although, after it was released, people were realising that the performance for many components and rendering had actually decreased.

After running tests on the rendering and loading time of several components, we realised that Ext JS 4 was running at about 1/3 of the speed of version 3, which was particularly irritating because we were promised faster performance.

Documentation – 3/5

Another one of Sencha’s supposed improvements was that the documentation was to be more complete, easier to follow and easier to use. They did manage to achieve some of their goals, however the documentation that was released had several poor aspects.

• Functionality was faulty
• Missing methods and classes
• Incorrect information and typos
• Slow load time

There seems to be a lot of strife within the Ext community in regards to the vital need for complete documentation. This is something that at least Sencha have admitted and are working on currently, and to give credit, when credit is due, they have made some good improvements already.

Support – 3/5

Obviously if you want the best support, you need to pay for it, and the paid support for Ext JS isn’t bad. However it does seem clear that the support for normal users is very limited. The community help each other overcome problems they find, but the Sencha support from these forums isn’t that great. Help being given to maybe one in ten people, and if a problem arises that is more complex than the average problem, it is discarded without response.

Overall I think that the support is so-so. Sencha have a lot on their plate fixing and improving the framework, but the support is nowhere near what it could be.

Updates & Patches – 2/5

Sencha does provide relatively frequent updates to its users, providing beta and developer previews prior to the official launch of Ext JS 4. However, often the releases promising fixes and additions fail to live up to expectations, sometimes not achieving what was promised at all.

Another issue I have personally found with updates & patches is the priority in which they are dispatched. I understand that paying premium customers are going to be given priority, but what eludes me is that when a bug is reported and solution provided to Sencha by the general population, they are not always allowed access to the fixes they have provided. Personally this seems like Sencha are happy to receive but less inclined to give back.

Browser Compatibility – 4/5

I know from experience of web development, how difficult it is to cater for all browsers, new and old. However I feel Sencha really do deserve credit in this department as 95% of browsers work as intended, unless users have made custom modifications. Catering for browsers back to IE 6 is a nightmare and am perfectly satisfied with the effort made here.

Overall – 3/5

However fond I am of the Ext JS framework which I would rate very highly compared with other JavaScript frameworks, this release has left me disappointed. Developing JavaScript frameworks is not an easy task and I feel that Sencha made a mistake by promising us a release date as soon as they did, which in turn, pressured them into making a release. I feel that the framework wasn’t ready to go and the testing run had failed to reproduce the flaws that the framework had. Given an additional couple of months development time, while taking compatibility into consideration from the beginning and giving the framework that extra polish, we would be looking at a 5/5, but instead I feel I can only give it a 3. I hope that Sencha learn from their mistake on Ext JS 4 and the next version will be an out and out success.

 

There has always been a debate in regards to the best option for businesses to acquire the SEO services their business needs, and there is no real answer. There are 3 main routes that can be taken when contracting out your requirement for search engine success. Each has their own pro’s and con’s but really depends upon what the business is looking for in terms of an internet marketing solution.

Agencies

Agencies come in 3 different packages, you have your boutique agencies that specialise in just SEO, your all-in digital agencies that cover everything digital and agencies that offer SEO services as a secondary service. Obviously agencies offering SEO as a “value adding” service are not going to be as up to date and knowledgeable as some more SEO focused agencies, however if you are using them for other services, they maybe worth considering. In reality though, you are most likely to be choosing between Boutique and Full Digital agencies when looking for solely SEO services.

Boutique Agencies

A boutique agency offering SEO, is only focused on SEO. They most likely will have staff specialised in specific areas, such as link building, social media, content writing etc.

Pros

• Up to Date knowledge of latest SEO trends
• Access to good resources for social media & link building
• Focused solely on getting you results

Cons

• Often have no development or design knowledge
• A lot of cowboy companies around offering just SEO
• Not focused on conversions and sales, only rankings

Full Digital Agencies

A full or All-In digital agency will generally be full of very smart, switched on people who keep up to date with the latest trends in design, development and SEO. You will find that a full digital agencies approach to SEO is more rounded, they understand how to turn rankings into sales and page layouts and functionality to keep the users happy. Often SEO consultants will be more well rounded in their skill set, knowing abit about design and development from other colleagues in the office.

Pros

• Up to date on latest trends
• Focused on the overall success of your website
• Often well established with proven success
• Can provide design & development to support SEO

Cons

• Not as specialised on SEO as a boutique agency
• Design & development can sometimes hinder SEO success

In-House

In house SEO experts work well in highly specialised industries, they will know the companies market inside out. Having an in-house SEO expert can also mean that they are less current with their knowledge of search trends and updates, due to the lack of discussion between employees in the same job.

Pros

• Easy to communicate
• Greater knowledge of the business processes
• Dedicated to one business

Cons

• Less up-to-date knowledge of SEO
• Lack of resources for social media and link-building
• No one to discuss SEO related problems or ideas

Freelance

A freelance SEO consultant is usually up to date with the latest search trends and is highly specialised in their field. Dealing with a freelancer is more of a personal experience, since you will be talking and discussing with a single person everytime.

Pros

• Up to date SEO knowledge
• Care about their clients more as it is their personal reputation on the line
• Communication through a single person

Cons

• Lack of resources that agencies possess
• Often work part-time with no set working hours
• Work alone, so have no support or colleagues to discuss ideas and problems

Conclusion

So where should you turn to get your businesses ranking and performing well online? Well there is no real correct answer, only personal preference. If you are a large corporate company, generally an established digital agency due to their experience and resources or an in-house team. However, if you are a small or medium sized business, a freelancer or boutique agency may suit your needs better, especially if your after a more personal experience.