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:
<cfwindow source="some.cfm" />
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:
<cfselect name="mediaid"
bind="cfc:art.getMedia()"
bindonload="true" />
<cfselect name="artid"
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.
Archived Comments
I think you pretty much nailed this one.
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.
When I started working on a big .com startup in November 2007 I chose to move to CF8, ModelGlue and Transfer.. A steep learning curve to say the least although one which has proven to be very rewarding.
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.
Starting as someone with close to 0 JS experience, I started with CF8 Ajax features and then moved onto jQuery. The main thing to be careful with jQuery is testing your code on IE.
The main reason I had to look at jQuery is that CFAjax Grid was a bit on the slower side.
All very good points.
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
Ray,
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);
});
i think the built-in tools will always allow you to go from zero to something incredibly fast, at the cost of limiting your top speed so to speak. They have a much much gentler learning curve (you can usually copy and paste your way to something that at least looks pretty good), but the magic tags have limits, and they are hard limits. This isn't a bad thing - cfwindow and friends can give you a quick taste of the "new hotness" in web ui development, and, if you find you want/need more, there are loads of great js frameworks to choose from.
Another thing to mention is which is better from a skills point of view. CFAjax is good for ColdFusion. Period. Useless in Django, Ruby on Rails, PHP, .Net, etc. jQuery works across the board. I, for one, would like to have a skillset that doesn't limit me.
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.
Use CF ajax tags first, get it working and then substitute with jQuery UI or something else when really needed. (like.. when the included JS are really too slow for the performance of your app)
Take a look at http://cfjqajax.riaforge.org/ if you haven't already. CF8-style ajax tag that uses jQuery.
Just to spin this topic a little, what about Ext? I started out using prototype way back (pre CF8. heck, I've still never cfwindowed....) and have since moved to Ext, which has tons of very slick widgets if that is your pleasure as well as a framework that can do just about anything with.
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.
jQuery - hands down, no contest.
http://www.gruppo4.com/~tob...
@ScottP: That plugin is slicker than Slick Rick.
jquery is the winner. javascript is really easy to learn and jquery documentation is really useful.
i really don't see the point paying for cf ajax stuff.
@radekg: Eh? It's kind of hard to do database queries with jQuery. ;) Seriously though, this was a blog article on using ajax with CF via the built in Ajax features or along with jQuery. I'm not sure how your comment applies here.
@ Jeff Self - Your comment was exactly what I was thinking. The CFAjax features are rather nice and easy to use, but can only be used with ColdFusion. If you program in multiple languages why not learn something that you could use in everything you do? Sure, you would have to write some of the data pieces that are speicifc to whatever language you are working in, but the core jQuery pieces would be the same.
CFAjax is nice when you are first learning and don't know a lot about JavaScript. When you learn more, then it becomes less flexible to you.
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. :)
Akira - to be fair to Adobe, I don't think most users will be mixing CFAjax + custom YUI stuff.
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.
I used to use the libraries in CFIDE, but Yahoo keeps adding good stuff to the library so I downloaded the new one and started using it. But then I learned combining it with tags like <cfmenu> makes the vanilla YUI things break. :)
It's a problem of js tag order and js tag versions. That's all.
One thing that hasn't been mentioned is that jquery and other pure javascript libraries are updated much more often than ColdFusion. If something doesn't work, it might work next week when the next release comes out. Also, there is incredibly healthy competition right now among the various libraries and they're becoming more mature and powerful very quickly.
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.
@David: Well let's be fair here. It is a heck of a lot easier to update jQuery than it is ColdFusion (or .Net, or PHP for that matter). Not to disparage jQuery in any way whatsoever, but I really don't think that is a fair comparison. It <i>is</i> true that for <i>purely</i> Ajax considerations, you can get 'newer' libraries quicker by using jQuery, Ext, etc, out of the box. I don't think we should expect Adobe to release a hotfix, or a whole new version, every time YUI is updated.
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.
@Rayond: I think you misinterpreted my comment a bit. I was not trying to disparage ColdFusion (which I love) at all and it didn't even occur to me that Adobe should try to release a new update every time YUI is updated. I was only stating one of the reasons I prefer to use a pure javascript library for ajax stuff.
@David - Gotcha there. Sorry, I'm still hurting from radekg's earlier snip. ;)
I was initially impressed with how simple CF8 made AJAX widgets, and started following the underlying libraries after that. Since then, I have become a heavy user of EXT. The newer versions offer some incredible widgets that, at least for now, jQueryUI is nowhere near. If I don't need widgets, then absolutely I will turn to jQuery. The speed and chaining is just amazing.
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 prefer using own JavaScript instead of CF8 Ajax. Why? Try to validate a site, using CF8 AJAX, as XHTML Strict. You will fail!! When writing own stuff, you can wrap all JS with CDATA comments, so it becomes valid! Just my 2 cents.
Ok, so this is a bit OT (but it's my blog, so I'm allowed, right?), but when was the last time the average user cared if a web site was XHTML Strict? If it displays right in the top browsers, does it really make sense to wrap your JS in cdata? I mean maybe I'm just being old school, but I find all this concern about strict html to a be a bit... well, silly. And impractical as well. You won't convince me that <br/> is that much better than <br>.
I -know- I'm going to get flamed for this. ;)
Well Ray you're really old school ;)
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.
I feel the need to leave the comment that when I just Googled "ColdFusion 8", this blog entry was the 5th result. The 5th result.
That is mad nuts.
I've given up wondering about how and why pages get high rankings in Google results. For example, I know that having text link ads on the site reduces my Page Rank, but I've yet to see any drop in traffic since I've used them (and frankly, I need the ad money to help pay for the server).
To be honest I don't think you have anything to worry about rankings wise. Your site is very well established, contains constantly changing, quality content and is an authority in the Coldfusion world.
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. :)
I wasn't being critical or even analytical.
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.
@JamesAllen: I've seen even quicker responses at times. I think I've seen my blog posts picked up < 1 hour.. which is scary.
@David: To be honest, any talk of SEO might as well be Magic to my ears. ;)
That's brilliant Ray! Although it's what I'd expect with a site like yours as you constantly post quality content and must have tons of inbound links from related sites.
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.. ;)
My last OT post on the thread - I promise. ;)
@JA: Now I just need to turn my power to evil and my plan will be complete! :)
Ray,
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.
has anybody replace the ext lib from the coldfusion server 9.0.1 to upgrade from 3.1 to 3.3 and see if CFAjax 8 things still work?
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..