Skip to content

_code.sass: use :has selector for .highlight's parent div#893

Open
haampie wants to merge 1 commit into
pradyunsg:mainfrom
haampie:patch-4
Open

_code.sass: use :has selector for .highlight's parent div#893
haampie wants to merge 1 commit into
pradyunsg:mainfrom
haampie:patch-4

Conversation

@haampie

@haampie haampie commented Aug 11, 2025

Copy link
Copy Markdown
Contributor

The current selectors div[class*=" highlight-"] and div[class^=highlight-] are slow on larger pages with generated API docs. Use the more modern :has(...) to speed it up.

In one example it goes from 160'018 match attempts to just 280 match attempts, to ultimately apply to just 66 elements.

The selector is not exactly equivalent because it's not testing whether the parent has a highlight-* class, but I think we can always expect a combination <div class="highlight-foo"><div class="highlight">...</div></div> when using Sphinx.

The current selectors `div[class*=" highlight-"]` and `div[class^=highlight-]` are slow on larger pages (such as generated docs) with many divs.

Use the more modern `:has(...)` to speed it up.

In one example it goes from 160'018 match attempts to just 280	match attempts, to apply to 66 elements in either case.

The selector is not equivalent because it's not testing whether the parent has a `highlight-*` class, but I think we can always expect a combination `<div class="highlight-foo"><div class="highlight">...</div></div>`?
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

1 participant