47 lines
1.2 KiB
Plaintext
Raw Normal View History

== Why is this an issue?
2021-04-28 16:49:39 +02:00
The use of ``++find++`` allows ``++document.getElementById()++`` to be used for the top-level selection, and saves the jQuery Sizzle engine for where it's really needed. That makes the query faster, and your application more responsive.
From the jQuery documentation:
____
Beginning your selector with an ID is always best.
The ``++.find()++`` approach is faster because the first selection is handled without going through the Sizzle selector engine ID-only selections are handled using ``++document.getElementById()++``, which is extremely fast because it is native to the browser.
____
=== Noncompliant code example
2021-04-28 16:49:39 +02:00
2022-02-04 17:28:24 +01:00
[source,javascript]
2021-04-28 16:49:39 +02:00
----
var $productIds = $("#products div.id"); // Noncompliant - a nested query for Sizzle selector engine
----
=== Compliant solution
2021-04-28 16:49:39 +02:00
2022-02-04 17:28:24 +01:00
[source,javascript]
2021-04-28 16:49:39 +02:00
----
var $productIds = $("#products").find("div.id"); // Compliant - #products is already selected by document.getElementById() so only div.id needs to go through Sizzle selector engine
----
ifdef::env-github,rspecator-view[]
'''
== Implementation Specification
(visible only on this page)
include::message.adoc[]
'''
== Comments And Links
(visible only on this page)
include::comments-and-links.adoc[]
endif::env-github,rspecator-view[]