Posted in jQuery | Posted on 02-11-2009 | 6,341 views
Andy asks:
Ray, Don't take this wrong as I know that you're a very big fan of jQuery. I'll preface this question by stating that it truly is a question and not an argument. As someone who has pretty much mastered the ColdFusion AJAX stuff I am compelled to ask - What is the draw of jQuery and what does it do that CF8 out of the box cannot do?. What is the advantage of using jQuery over CF8's AJAX tools?
Good question, and let me say, I don't mind a good argument. While in some ways I can be as sensitive as my 7 year old daughter, I don't mind arguing about this, so let's start a little argumentdiscussion, shall we?
First and foremost, let me repeat something that I've said in comments here before and I've said both in context of server side languages as well as JavaScript frameworks. The "best" one is the best that allows you to be the most productive and produce the best quality output for your client. End of story.
That being said, let's first talk a bit about what we mean when we say 'CF8 Ajax' (and to make it simpler, I'll simply use 'CFAjax' to refer to Ajax support in ColdFusion 8). I look at CFAjax as four main areas of support:
- Plumbing
- Widgets
- Debugging
- Security
I don't talk much about debugging because, well, Firebug won the war a long time ago. I have written about ColdFusion 8's security support in terms of Ajax control before. It's ok, but really meant to be used within the context of a full suite of security rules and settings. Most people focus on the plumbing and UI widgets.
By plumbing I mean the low level things ColdFusion 8 does to support Ajax. This includes things like JSON support, cfajaxproxy, and probably the most useful change of all - the simple returnFormat argument. These additions are very helpful and you should not ignore them if you are using another framework. They are - for all intents and purposes - framework agnostic and will work with CFAjax, jQuery, Spry, Ext, etc.
What does that leave? Well, widgets for one, but we also have a whole other area that CFAjax doesn't really cover - manipulation. jQuery is definitely the winner here. Period. If you want to work with the DOM in any way, then jQuery has you covered.
UI widgets... well, that's another matter. You most likely read my blog entries on jQuery and UI widgets (my last entry on jQuery dialog). If I remember right, there are about 5-6 jQuery widgets now. ColdFusion has a window, a pod, a grid, a slider, a tree, and I am probably forgetting one, but, about the same number of components. When it comes to ease of use, I think CFAjax is the clear winner. Don't get me wrong, jQuery makes it easy, but if you don't know JavaScript, you can't beat this:
The flip side of this is customization. I haven't always had luck with customizing the look and feel, or behavior, of the CFAjax widgets, while there seems to be a much greater level of support on the jQuery side, both in the 'official' widget side and in the plugins.
I think what it comes down to is ease of use. I blogged a lot about CFAjax when ColdFusion 8 came out. I was getting used to JavaScript and Ajax again (Spry had been a big help) and ColdFusion 8 made it incredibly easy. Now that I'm more comfortable though I find the power of jQuery more to my liking.
What other comparisons can we make? CFAjax has no native animation support... but to be honest, I find most animations incredibly annoying. I'm willing to admit that I'm in the minority though and jQuery's support of this is rather nice. I like how they recognized that for common UI features like show, hide, that it made sense to easily tie these to animations. CF has forms validation built in... but... well... most people I know don't use it. I know I don't. jQuery gets the point here even though it's not native but available via a plugin.
Another facet of CFAjax is the binding support. Borrowing from Forta's post, consider this:
2 bind="cfc:art.getMedia()"
3 bindonload="true" />
4<cfselect name="artid"
5 bind="cfc:art.getArt({mediaid})" />
While I can certainly do this in jQuery and other frameworks, you have to admit that that syntax is pretty darn powerful, especially when you consider the developer who has 0 JS experience. (Note to self - how would one even do bindings in jQuery?)
So I rambled on a bit. Let me try to come to some sort of conclusion here that makes a bit of sense.
You always want to use the tools that make you the most productive. Using myself as an example, I was most productive with just the CFAjax stuff at first. It took me a while, but now I'm more productive with jQuery. If I were to join some new team of developers, I'd have to work with them to find the best tool we can use together. Using jQuery though (or Spry, or Ext) doesn't mean you can't use the other facets of ColdFusion 8's Ajax support.
Make sense? Discuss please.
I started off quite like the example you gave, 0 js experience and was very happy w/ the built in cfdiv/cflayout but as you mentioned, they fall short on customization from a UI standpoint. That's where I started looking for alternatives.
Now that I've got my bearings I'm strictly using jQuery because, well, the sky is the limit.
Along with that I also chose to go the CFAjax route utilising the inbuilt functions (this is with the first release of CF8).
However, while they were useful I soon found that they were *massively* bloated. I think at one point the JS includes were adding 700k to the download size.
I also found a nasty memory leak in CFWINDOW which led me to have to switch to JQuery.
It was the best move I could have made! Not only was the download size slashed (initially went from 700k to about 130k) but everything suddenly became a lot simpler yet massively more powerful.
I kept one facet of CF8 Ajax and that was the brilliant CFAJAXPROXY which forms the core of all my sites operations. The rest I have built with JQuery and a number of useful plugins.
It really is an essential toolkit and one that I will never be without on any future website projects.
The main reason I had to look at jQuery is that CFAjax Grid was a bit on the slower side.
But you hit the nail on the head with manipulation of the DOM for the jQuery points.
Form validation is a good one, its possible to overwrite the cfform.js file on the server so it could use jQuery :) so those could be combined.
On the other hand, i never use that and end up using a
(Pre CF8) ,CFC by Rob Gonda called ajax.cfc it comes with a js model you include on any page and makes for light js coding for ajax to cfc communication. I use this for forms submits as well as forms validation, the amount of js code that i have to write with the amount that gets written for me and i still have to write with CFAjax is much less.
I end up using jQuery to handle all the events and fire off the calls to ajax.cfc
anyway my $0.02 worth
Good discussion
I think one of the major distinctions that you could make here is the for people who want to do more than the simple out of the box Ajax interaction that CFAjax offers (for those that like and understand JS) there really is no comparison - jQuery. CFAjax for me is designed to add functionality to a web site for those don't know JS.
And binding actions to forms with jQuery is as simple as this:
$.get( urlToCFC,
{method: "myMethod", arg1:"value", arg2:"value"},
function(msg){
$$.html(msg);
});
Lets be honest. You've got to know more than one technology anymore. We're now looking into working with ESRI ArcGIS Server 9.3. It allows you to get its data with Javascript API's or Flex API's. What javascript framework do they use? Dojo. So now, I've got to learn this one as well. Its really pretty overwhelming. The amount of stuff we have to learn on an ongoing basis is staggering. Too bad management doesn't seem to realize this.
Take a look at http://cfjqajax.riaforge.org/ if you haven't already. CF8-style ajax tag that uses jQuery.
It can be on the heavy side if you use a lot of the widgets, but you can reduce the js by just including the parts of the library you actually use.
http://www.gruppo4.com/~tobia/cross-slide.shtml
i really don't see the point paying for cf ajax stuff.
What I don't like about Adobe's implementation of the tags is that they seem to load every ajax library under the sun onto the page. Also, they are using an older version of the YUI libraries and if you write a page using the newer YUI stuff, the CFAjax tags will break the YUI.
I prefer to use jQuery for the easy stuff and YUI for the heavy lifting now. :)
In this comment, CFAjax refers to ui/binding aspects of CF, not the complete package - again - we need to be sure we 'pick on' the right things when we do nitpick CF (or jQuery for that matter). Nothing about CF's default YUI libraries prevents you from using the plumbing.
It's a problem of js tag order and js tag versions. That's all.
Off subject, I have used dojo a lot. It has a very comprehensive feature set that makes sense if you're building an application that needs a consistent set of widgets. jquery UI is promising but doesn't seem to be there yet. I have not used jquery much yet, but do intend to use it for websites that just need some splash here and there.
Now - one could make the argument - why not make it easier to upgrade the libraries. That could possibly be done, but from what I know of the 'process' at Adobe, this would necessarily still be a complex operation due to all the testing/QA/etc that must be done.
The EXT includes can get fairly large, but since my web apps are entirely internal to a corporation, it's really a non-issue.
I -know- I'm going to get flamed for this. ;)
In germany we care about web standards. All websites i created the last 3 years are valid xhtml strict! If you take care about standards, you will have much less trouble, fixing css for IE.
That is mad nuts.
All these factors are *exactly* what Google loves and so not ranking you highly would make no sense. As long as you provide quality, relevant content Google will rank you well - at least that's how I see it. I'm not always sure PR is the most important thing to be honest.
I was amazed yesterday when I found my latest blog post (on a blog I rarely update) appeared 4th on the results for 'microsoft script debugger vista'. It took less that 24 hours for it to appear there. I know it's a specific search term but it still tickled me that I ranked that quickly on the first page. Google knows that my blog post is relevant and so gave it the ranking it deserves so that people can find it.. Spot on. :)
Just noting how funny it was that this, of all of Ray's (excellent) blog posts, appeared 5th on a generic, broad search for "ColdFusion 8".
Mad. Nuts.
@David: To be honest, any talk of SEO might as well be Magic to my ears. ;)
The more 'active' Google consider your site the more the bot will visit to make sure it's as up-to-date as possible.
I truly believe that the majority of SEO is simply based on running a quality site with valuable content.. Google's algorithms have been refined so much over the years that I feel it just 'knows' what should be ranked..
The people who slave over SEO and do not get the results they want are usually running a pretty poor site in my experience..
You've got some real power here Ray to get the word out on anything you want pretty much.. ;)
@JA: Now I just need to turn my power to evil and my plan will be complete! :)
One key (well maybe two) that you did not mention is that CF 8 AJAX components are not based on the latest iterations of YUI or EXTjs. This is really critical and is one reason we stopped using the builting components.
For Example CFGRID AJAX is looks great, but can not be easily customized without attaching custom EXT code. For example I needed both an autosearch and pagination on the same grid. Can do that by default with CFGRID.
No if you use jqGrid for jQuery you can and for that matter do way more that CFGRID ever can (unless they upgrade to at least ver 2. of the components).
Also page size. the Sheer number of extra libraries that the CF AJAX components load that you don't need is unecessary.
Ok that may have been more than 2 points. I will say though cfajaxproxy with jQuery rocks.
I am tempted to take advantage of the Sencha ExtStudio to take advantage of the allready loaded ext lib on the server for the coldfusion apps..
[Add Comment] [Subscribe to Comments]