(In reply to comment #9)
> (In reply to comment #8)
> > The CSS is pretty ridiculous. Let's not forget that CSS parses from the
> > rightmost rule so something like a.external[href ^="news:"] can be a pretty
> > expensive operation.
> 
> [citation needed]. I don't see why would it be particularly more expensive
> than
> any of the hundreds of other rules we have. Assuming that the hypothetical
> browser does indeed naively match from the right side always, [href^="news:"]
> will immediately not match (most elements don't even have a href attribute)
> and
> the ten or so of such rules should not be noticeable.

Afaik selector engines have quick lookup maps for IDs, classes and elements. In the case of ".mw-link-pdf" that is a very quick lookup.

In the case of "#bodyContent a.external[href=..]" it is a lookup for elements of 'a', then for each the classname and the attribute is matched, and then it recursively does a parent check until it finds #bodyContent or the document element.

In theory it could optimise if it had a quick lookup for elements having a certain attribute. But afaik they don't have that, and even if they did, I isn't more efficient per se, cause then the post-check would have to verify tag name and class name for each.

Either way, none of this in particular is bad, it's the whole package of:
* A very strong selector (#bodyContent)
* A parent selector
* Both element and class name (should never be used together)
* Additional attribute matching and string operations on that
* Hardcodes details that (other) stylesheets should not have to know or hardcode, thus causing maintenance issues (e.g. the fact that it is an <a>, and is inside #bodyContent. The container can change, and links might be wrapped for presentational reasons)

Up sides of using a simple class:
* Faster query (one could argue about how much, but it is certainly faster)
* Support for older browsers (this is not a priority though, since all our grade A browsers support it, and it's a minor enhancement with graceful degradation)
* Easier to extend from other components as there is no need to have any knowledge about implementation details (container element, tag name etc.)