While using Uploadcare file upload widget, I noticed that the Uploadcare script keeps repainting the HTML
tag.
I am not sure if repainting is the right term, but here is what is happening:
Checking chrome devtools
the HTML
tag is highlighting, the same behavior when you add/remove an attribute on an element. And it doesn't seem to end, it just goes on and on every N ms. You can check it for yourself on their homepage Uploadcare.com, just open devtools
and take a look at the HTML
tag.
Anyone know why it is doing that? What is it calling? Would it cause performance issues to mobile users?
The Uploadcare plugin searches for new widgets on the page every 100ms. This is called live initialization. Internally the plugin uses jQuery (which uses Sizzle selector engine) and this is how Sizzle actually works: it adds id
elements to the root element of the search scope before the querying and remove it after. You can verify this with a simple example:
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script>
setInterval(function() {
$.find('[attr]', document.documentElement);
}, 200);
</script>
If you want to avoid flicking, you have two options. You can disable live initialization at all by adding UPLOADCARE_LIVE = false;
to js code. Or you can add any custom id
attribute to the html
tag. Sizzle will not change it.
In the future, we are planning to use MutationObserver
to watch for the new widgets on the page.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With