UI that depends on slow loading javascript

Vote count:

0

All of my scripts for a certain page are being concatenating / optimized (requireJS) into a single file. As it stands, my script currently takes a while to load depending upon the browser and the network connection as it is ~ 0.5 MB.

On one of my main landing pages where users are funneled to, I have some interaction (e.g. a button, lets call it "click me button") that is dependent upon that script - event handlers etc. In other words, the button does nothing until the script has been downloaded and loaded: e.g. an empty href.

Currently, if testing on an old browser or a slow connection, the user is likely to see all or most of the DOM including "click me button" before the script has finished loading. As a result, there is a delay (sometimes up to a few seconds) where clicking on this button does nothing at all.

I am wondering:

1. Is there perhaps a way to architect this such that I can remove the delay between the time the button is shown to when it is clickable (via the JS interaction). Remember all the scripts for this page are concatenated into a single file. I can always try and trim down the size of the file, but this still feels wrong because there is always a theoretically possible lag.


2. Is there anything else in my description that stands out as undesirded architecture. Such as perhaps giving the button a default, non js-dependent, behavior so that if the user does click it immediately something happens - this also feels a bit strange since there would be 2 different behaviors depending on how fast the user happens to click the button.

asked 3 mins ago

Jke

1

UI that depends on slow loading javascript