loading spinner should be removed from DOM and not just set to display:none

[tim-peterson]

CSS transform has a tendency to max out the CPU even when the .vjs-loading-spinner is reset to display:none.

A better solution for loading spinner is to remove it from the DOM parent.removeChild(child) and then add it back parent.appendChild(child). I guess this could mean adding the following methods to video-js.js: this.add() and this.remove() to replace the cases where the loading spinner makes use of this.show() and this.hide().

Note: in the video-js.css file, .vjs-loading-spinner would be changed to display:inline-block .

[heff]

Long term I'm thinking the right way to make the spinner work is to have it react to player css classes. e.g. when the player is waiting it should add the vjs-waiting class. Same with vjs-seeking. And then the spinner (including transforms) would be limited to only the times when the player has those classes.

[tim-peterson]

@heff agree adding and removing CSS classes is the ways to go.

[mmcc]

+1 - Just an internal reminder here :)

[heff]

Thanks for your help on this Tim. #1351 addresses this if you're interested in reviewing it. It will go out with the next release.

[tim-peterson]

Thanks @heff looks great! I agree className switching is the answer.