Use shared jQuery references instead of repeately querying DOM
This change aims to improve readability and efficiency by reducing repeated DOM and/or jQuery selectors I found in styleguide.js.
- Make more use of an existing reference,
$sgIframe - Create two new references,
$sgIframeContainerand$sgViewportCoverand replace queries with them.
In cases where an instance of the repeated query was a jQuery selector, simply use the earlier-defined jQuery reference. In cases where a native document.querySelector() is used, I call jQuery's .get(0), which pulls out the native DOM element from the reference. In either case, the DOM shouldn't have to be searched again for the same elements over and over.
I particularly focused on making these replacements in connection with the mousemove event while dragging the iframe handle, which can potentially be triggered many times per second.
Hey @tommcc! Thanks so much for helping clean up the JavaScript files. This is fantastic work that cleans things up nicely.
Eye-balling it looks good from my end, but I'd need some help from @bmuenzenmeyer or somebody to help me pull it down and test things for real. I'm a bit clumsy in that department.