just wondering what selector performance is like for [data="what"] pseudo performance if anyone has a good article/benchmark for this or any personal experience?

Basically I've peppered my HTML with data-eid, data-mid, data-sid with HTML5 elements like:

```html
<section data-mid="1">
    <article data-eid="1">
        <a data-sid="1"></a>
        <a data-sid="2"></a>
        <a data-sid="3"></a>
    </article>
    <article data-eid="2">
        <a data-sid="4"></a>
        <a data-sid="5"></a>
        <a data-sid="6"></a>
    </article>
</section>
<section data-mid="2">
    <article data-eid="3">
        <a data-sid="7"></a>
        <a data-sid="8"></a>
        <a data-sid="9"></a>
    </article>
    <article data-eid="4">
        <a data-sid="10"></a>
        <a data-sid="11"></a>
        <a data-sid="12"></a>
    </article>
</section>

```

Pretty much wanted to use it in jQuery for selecting particular `m` `e` and `s` things on my page. I know atm that an `m` is a section, that an `e` is an article and an `s` is an anchor.

I would usually select in jQuery using something like `$('.m[mid="1"]')` but is it much quicker than: `$('section[mid="1"]')`... I guess not?

I just don't want to make the user download a load of extra class="m" in my code. I know currently I'm tying my front-end with my JS-end code by forcing the elements to be a certain type where class="m" would decouple it to be anything in the future.

What do you think?