angular.element vs document.querySelectorAll (v4)

Revision 4 of this benchmark created by tangorri on


Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
<div ng-app>
    <div id="col1" ng-controller="MyCtrl" class="group1"></div>
</div>

Setup

var MyCtrl;
    
    var container = document.querySelector('div');
    
    MyCtrl = function($scope) {
      $scope.gkey = 'group1';
    };
    
    function FindWithJQ() {
      return $('.group1');
    }
    
    function FindWithJS() {
      return container .querySelector('.group1');
    }

Test runner

Ready to run.

Testing in
TestOps/sec
angular.element
var g = FindWithJQ();
ready
document.querySelectorAll
var g = FindWithJS();
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.