
JQuery vs. AngularJS: A Comparison and Migration Walkthrough - daniellmb
https://www.airpair.com/angularjs/posts/jquery-angularjs-comparison-migration-walkthrough
======
jasode
JQuery vs AngularJS comparison is reasonable because many developers will know
JQuery and wonder what that new AngularJS thing offers them. That's why the
following epic stackoverflow answer has 6000+ upvotes:

[http://stackoverflow.com/questions/14994391/thinking-in-
angu...](http://stackoverflow.com/questions/14994391/thinking-in-angularjs-if-
i-have-a-jquery-background)

Also, bloggers will often compare them as the following article does (HN
discussed it previously):

[http://okmaya.com/2014/03/12/the-reason-angular-js-will-
fail...](http://okmaya.com/2014/03/12/the-reason-angular-js-will-fail/)

So yes, JQuery vs AngularJS is like comparing apples & oranges but one way to
reach the understanding of _why_ it's apples and oranges is to explicitly
compare them!

While many line-item features of AngularJS and JQuery do not overlap, they
_do_ overlap in devs' mindshare to program a web page. Hence, the comparisons
will continue.

------
daniellmb
If you already understand both jQuery and AngularJS, it may seem a little
silly to compare them. Like comparing a motor to a car. Yet, this article will
help those that know about jQuery, and want to learn more about the strengths
AngularJS has to offer. Specifically, the comparison shows what both of these
tools are good at, and empowers you to know what one best fits the needs of
your application.

There are a several factors that will help you decide whether or not to use
AngularJS. In my opinion it's not so much how complex the user interface is,
although that is certainly relevant. The first thing to consider is where you
want to put your application logic, server-side or client-side. The more
things you want to push down to the client, the more likely AngularJS will
better fit your needs. Are you creating a single page application where url-
to-resource routing is done in JavaScript, or will that be handled server-
side? Will you be merging data with templates on the server, on the client, or
both? I suggest you look at the "too long; didn't read" chart in the article,
and see if you need the features AngularJS provides. How important is it to
you that your client-side code is testable? While it is possible to unit test
jQuery code, the way most developers write nested callbacks tightly coupled to
event handlers, does not lend itself easily to isolated testing. Finally, you
need to decide if your team wants to embrace the declarative style of
application development advocated by AngularJS. Such as using the directive
ng-click vs. $(elm).click(). This will most likely require a change in
mindset, and should be carefully weighed.

~~~
drinchev
Yep. Totally agree. Actually I was freaked out when I saw the article title,
asking my self : Did I miss something?.

Backbone and Angular are more comparative than Angular and jQuery. Also
Angular is using a similar to jQuery language jQLite [1].

1:
[https://docs.angularjs.org/api/ng/function/angular.element](https://docs.angularjs.org/api/ng/function/angular.element)

------
debacle
I don't understand. The comparison breaks down in the very first example -
where is the example of Angular's excellent DOM abstraction and compatibility
magic?

"And then I refactored something that was bad to make it faster."

There's also a typo in the jQuery example.

There's no comparison. jQuery provides way more for actual DOM magic than
Angular does.

> As I have outlined in this article, AngularJS can do everything that jQuery
> does and much more...

But you didn't. You didn't even provide an Angular implementation of your very
_first_ example.

~~~
nlh
Agreed 100%. This would be hugely helpful for me (and others I hope): I get
where Angular shines (heavy-lifting for single-page apps). The part I'm
missing is how to do the day-to-day jQuery stuff in Angular. Change CSS
classes on button clicks. Hide & show elements on drop-down changes. Etc.

In my mind, Angular is still "for building a rich app", whereas jQuery is "for
adding a bit of magic to an otherwise static page" (I know that's not really
true, but it's what I use it for.)

I'd love to get fluency in Angular - or at least a great understanding of it -
for that latter case. Is it usable for the day-to-day "magic" bits of an
otherwise normal webpage? (Other than the 2-way data binding example which I
see all the time and understand).

------
carsongross
Java Socket Programming vs J2EE: A Comparison and Migration Walkthrough.

------
angersock
One of the annoying sticking points with Angular for me has been that it
really doesn't play nicely with jQuery or jQuery-derived components (like a
lot of the awesome stuff in the jQuery-UI package).

Like, sure, I get it, I get it, you're a framework for doing all this high-
brow enterprise single-page app stuff, you own the DOM, you have DI patterns
for testability, yadda yadda yadda...why the hell is it so hard to use, say,
flotr2 to draw charts with you?

Why does your documentation not show the (common!) example of wrapping working
and existing jQuery (or AJAX, or whatever) libraries into directives/services
in The One True Angular Way?

Sure, polymer and web components and all that happy horseshit will make things
better--years from now. Some of us are trying to deliver functionality
_today_. It's like the devs/community don't even acknowledge that this is a
problem.

------
Raphmedia
At first, I was confused. "Oranges vs. Apples!". But then, I saw the file
size. I understand the article as in if you use Angular in your app, you
shouldn't be also using jQuery. It is also a good way to introduce Angular to
someone that has experience with jQuery. That being said, "orange vs. apples".

------
_mtr
> 1 Framework Comparison

jQuery is a library, not a framework!

~~~
ape4
Don't several frameworks use jQuery?

~~~
klibertp
Yeah, precisely _because_ it is a library and can be used with many different
frameworks.

Lately I was convinced that _all_ frameworks should die and be rewritten as
reusable and - important - interoperable libraries. jQuery is a good example
of such a library.

~~~
ape4
I am very reluctant to commit to a framework. But I like using jQuery.

------
prakash-news
got my doubt on both of this though i m not a javascript or jquery fan, always
try to make my way to the middle with css. Thanks for this article.

