MeasureThat.net
  • Create a benchmark
  • Online Toolsnew
  • About
  • Feedback
  • Buy me a coffeeBuy me a coffee

 Looping selectors (1) (version: 2)

Comparing performance of: Vanilla JS - getElementsByClassName() vs Vanilla JS - getElementById() vs jQuery class selector - $(".lesson-summary-wrapper"); vs jQuery find in context - $main.find(".lesson-summary-wrapper"); vs jQuery class selector with context - $(".lesson-summary-wrapper", "main"); vs Vanilla JS - querySelector() decendant selector vs Vanilla JS - by ID (as context) and classname vs Vanilla JS - querySelectorAll() decendant selector vs jQuery - Decendant selector vs jQuery - class selector with context as stored jQuery.Element vs jQuery - class selector with context as jQuery element selector vs jQuery - Decendant selector using id and classes vs jQuery - Decendant selector using classes vs jQuery - Decendant selector using id and class vs Vanilla JS - using querySelector(id) + querySelectorAll(class) vs Vanilla JS - using querySelectorAll()

Created: 4 years ago by: Registered User
Jump to the latest result
HTML Preparation code:
Script Preparation code:
Tests:

  • Vanilla JS - getElementsByClassName()

  • Vanilla JS - getElementById()

  • jQuery class selector - $(".lesson-summary-wrapper");

  • jQuery find in context - $main.find(".lesson-summary-wrapper");

  • jQuery class selector with context - $(".lesson-summary-wrapper", "main");

  • Vanilla JS - querySelector() decendant selector

  • Vanilla JS - by ID (as context) and classname

  • Vanilla JS - querySelectorAll() decendant selector

  • jQuery - Decendant selector

  • jQuery - class selector with context as stored jQuery.Element

  • jQuery - class selector with context as jQuery element selector

  • jQuery - Decendant selector using id and classes

  • jQuery - Decendant selector using classes

  • jQuery - Decendant selector using id and class

  • Vanilla JS - using querySelector(id) + querySelectorAll(class)

  • Vanilla JS - using querySelectorAll()

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results
  • Test case name Result
    Vanilla JS - getElementsByClassName()
    Vanilla JS - getElementById()
    jQuery class selector - $(".lesson-summary-wrapper");
    jQuery find in context - $main.find(".lesson-summary-wrapper");
    jQuery class selector with context - $(".lesson-summary-wrapper", "main");
    Vanilla JS - querySelector() decendant selector
    Vanilla JS - by ID (as context) and classname
    Vanilla JS - querySelectorAll() decendant selector
    jQuery - Decendant selector
    jQuery - class selector with context as stored jQuery.Element
    jQuery - class selector with context as jQuery element selector
    jQuery - Decendant selector using id and classes
    jQuery - Decendant selector using classes
    jQuery - Decendant selector using id and class
    Vanilla JS - using querySelector(id) + querySelectorAll(class)
    Vanilla JS - using querySelectorAll()

    Fastest: N/A

    Slowest: N/A

ⓘ Get performance results from real users on your website with Request Metrics.
Website Performance Monitoring by Request Metrics
Latest run results:
Run details: (Test run date: 4 years ago)
Mozilla/5.0 (Macintosh; Intel Mac OS X 10.14; rv:66.0) Gecko/20100101 Firefox/66.0
Firefox 66 on Mac OS X 10.14
View result in a separate tab
Test name Executions per second
Vanilla JS - getElementsByClassName() 4950859.0 Ops/sec
Vanilla JS - getElementById() 5047699.0 Ops/sec
jQuery class selector - $(".lesson-summary-wrapper"); 422750.2 Ops/sec
jQuery find in context - $main.find(".lesson-summary-wrapper"); 437031.0 Ops/sec
jQuery class selector with context - $(".lesson-summary-wrapper", "main"); 203268.0 Ops/sec
Vanilla JS - querySelector() decendant selector 1622268.0 Ops/sec
Vanilla JS - by ID (as context) and classname 2274827.0 Ops/sec
Vanilla JS - querySelectorAll() decendant selector 740814.3 Ops/sec
jQuery - Decendant selector 254198.8 Ops/sec
jQuery - class selector with context as stored jQuery.Element 366554.7 Ops/sec
jQuery - class selector with context as jQuery element selector 188713.8 Ops/sec
jQuery - Decendant selector using id and classes 228234.9 Ops/sec
jQuery - Decendant selector using classes 245166.1 Ops/sec
jQuery - Decendant selector using id and class 228659.3 Ops/sec
Vanilla JS - using querySelector(id) + querySelectorAll(class) 926933.3 Ops/sec
Vanilla JS - using querySelectorAll() 705610.2 Ops/sec