javascript - attribute - queryselectorall

¿Por qué querySelector(''# id'') asigna a document.getElementById(''id'')?

Question

Estoy en el rendimiento de los selectores últimamente, y me molesta que los navegadores que actualmente implementan la API de Selectores no usen document.getElementById cuando se pasa un simple #id .

La pena de rendimiento es enorme , por lo que los autores de la biblioteca continúan implementando su propio camino.

¿Algunas ideas?

Answer 1

Después de hacer mi comentario anterior, decidí seguir:

Desde Node.cpp en la fuente Chromium

if (strictParsing && inDocument() && querySelectorList.hasOneSelector() && querySelectorList.first()->m_match == CSSSelector::Id) {
    Element* element = document()->getElementById(querySelectorList.first()->m_value);
    if (element && (isDocumentNode() || element->isDescendantOf(this)) && selectorChecker.checkSelector(querySelectorList.first(), element))
        return element;
    return 0;
}

Por lo tanto, se asigna a getElementById, es solo que analizar la cadena en busca de selectores es una operación costosa.

Answer 2

Tal vez porque si lo hicieran, tendrían que agregar un cheque para ver si se trata de una simple consulta de identificación (sin modificadores) que ralentizaría cualquier otra consulta. Puede que no sea un gran golpe de rendimiento para hacer la prueba, pero es difícil hablar en nombre de otros desarrolladores.

Creo que si le preocupa puede agregar un func como getObByID que busca documentos, getElementById, lo usa si existe, de lo contrario utiliza el selector. Quizás los desarrolladores no sientan la necesidad de agregar este tipo de abstracción cuando pueden hacerlo fácilmente por sí mismos, y les correspondería a los desarrolladores recordar usarla y aumentar la curva de aprendizaje.

Answer 3

Tbh. la penalización de rendimiento es insignificante ... Realmente dudo que vayas a hacer 100.000 búsquedas por id. Si lo haces, entonces el rendimiento de QSA es lo último que debes mirar.

En cuanto a por qué, agregar un if / else extra puede hacer que las búsquedas id sean más efectivas, pero luego otros selectores css serán una fracción (aún insignificante) más lenta. ¿Por qué optimizar QSA para hacer frente a las consultas de identificación cuando hay un método especializado para hacer exactamente eso mucho más rápido de todos modos.

En cualquier caso, los navegadores apuntan a la velocidad y omitir cosas como esta hace que los gráficos de rendimiento en general se vean mucho mejor. En esta carrera de referencia, REALMENTE es sobre cada milisegundo, pero para los desarrolladores ... sean realistas, otros puntos de referencia son más importantes, el rendimiento de QSA no debería ser un factor más.

En cuanto a la conveniencia del desarrollador, funciona, sigue siendo tan rápido que no lo notarás en las aplicaciones reales (te reto a que me muestres dónde es VISIBLE VISUALMENTE sin dejar de ser un programa sensato; o).

Answer 4

Estaba comparando getElementById() y querySelector() y encontré que alguien ya ha hecho comparaciones de rendimiento y cálculos .

Ciertamente parece que querySelector() gana cada vez ... y en una cantidad considerable .