What should SOX use: getElementByStuff or jQuery's $()?

[double-beep]

I have observed that SOX sometimes uses document.getElementByxxxxx():

https://github.com/soscripted/sox/blob/e36e62d1e3c41625d66107e16051a52845b986fc/sox.features.js#L15

However, sometimes (perhaps most of the times) it uses jQuery:

https://github.com/soscripted/sox/blob/e36e62d1e3c41625d66107e16051a52845b986fc/sox.features.js#L335

So, should SOX use document.getElementByxxxxx() or jQuery?

[shu8]

SOX used to basically always use jQuery 's $() select function, but as it's started to get bigger I've found that the use of jQuery for simple selectors does have a slight performance impact (simply because jQuery does a lot more every time we try to select something) and so I've tried to start using vanilla JS when selecting elements with simpler selectors. See #391 for a few more details and (very rough!) stats.

In general, I think I'd now prefer:

• using vanilla JS for selecting elements (unless it's considerably more complex to use it compared to jQuery)
• 'caching' selected elements where possible (e.g. don't keep doing document.getElementById('element') when doing a series of actions on an element, just save a reference to it like const el = document.getElementById('element'))

for any new features.

I don't think there's any point in going over old code to replace jQuery because the effect will be quite small, but it's nice to have newer features being as 'efficient' as they can! :)