axe-core: Performance of dom.findUp is very slow
As you know, the performance of dom.findUp is really poor. However it is used very heavily across the various rules/checks.
AFAICT, you could use the DOM API of element.matches() which should be substantially faster. (browser support is good).
You basically have written the polyfill for it, so you can fall back to your current implementation if ('matches' in element) is false.
Good site to reproduce on: https://www.mlb.com/ Screenshot of the color-contrast rule taking 26s to complete. (All of the time is spent in the querySelectorAll within findUp)
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Comments: 19 (13 by maintainers)
Commits related to this issue
- fix(performance): significantly improve the performance of the dom.findUp utility fixes #696 — committed to dequelabs/axe-core by dylanb 6 years ago
- fix(performance): significantly improve the performance of the dom.findUp utility fixes #696 — committed to dequelabs/axe-core by dylanb 6 years ago
- fix(performance): significantly improve the performance of the dom.findUp utility fixes #696 — committed to dequelabs/axe-core by dylanb 6 years ago
This is a fantastic improvement. It gets the time for the mlb.com home page down to around 14s from 28s - that is an improvement of 50% overall…thanks for the help @paulirish @patrickhulce and @kdzwinel
I just tested and on https://www.mlb.com/yankees/schedule/2018-03` axe runtime is down from 60s+ (LH has a 60s timeout for gatherers) to 29s 🎉
@benschwarz I’m awaiting the merge of #701 and resolution of #702 before rolling. While a minor release from aXe would be awesome, I’m also happy to cherrypick these onto 2.6.1 and use that custom branch.
what
element.closestgiveth, shadow DOM taketh away 😦I might be missing something here, but IMO
element.closestis the native equivalent ofdom.findUp. Not sure about the shadow DOM part though.