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: 6 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

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

Related benchmarks: