angular.element selector vs jquery selector

Question

Which selector is faster in an angular 1.x application? I have Jquery included and have been using both in my application as in below:

var paneWidth = angular.element('.side-nav').width();
var paneWidth = jquery('.side-nav').width();

Possible duplicate of https://stackoverflow.com/questions/17230242/angular-element-vs-document-getelementbyid-or-jquery-selector-with-spin-busy-c — , Aug 16 '17 at 06:48
The biggest difference is that angular.element is a jQuery alias, and returns a jQuery (or jQuery lite) object. — , Aug 16 '17 at 06:54

score 0 · Answer 1 · answered Aug 16 '17 at 06:49

0

If jQuery is available, angular.element is an alias for the jQuery function. If jQuery is not available, angular.element delegates to AngularJS's built-in subset of jQuery, called "jQuery lite" or jqLite.

docs

answered Aug 16 '17 at 06:49

Ivan Minakov

1,432
7
12

Ok got it about aliases.Nevertheless , can i conclude that there would be no impact in speed, irrespective of the selectors being used ? – hhsb Aug 16 '17 at 06:57
Direct call of the jQuery should be a little faster – Ivan Minakov Aug 16 '17 at 07:02

score 0 · Answer 2 · answered Aug 16 '17 at 06:55

var paneWidth = jquery('.side-nav').width();

From the above code if you didn't include jquery in your angularjs code it doesn't works it through angular errors. To use jQuery, simply ensure it is loaded before the angular.js file.

var paneWidth = angular.element('.side-nav').width();

From the above code, angular.element delegates to AngularJS's built-in subset of jQuery, called "jQuery lite" or jqLite. Its already pre build in the angularjs code

Which is Faster?

Sure, jQuery is faster than angular.element().

angular.element selector vs jquery selector

2 Answers2