(Experiment) Optimize JS loading
Created by: riyad
I was unhappy the way JS was loaded and sprinkled throughout the code, so I sat down and experimented with it a bit and tried to implement some ideas that are generally suggested.
The main thing is putting the JS at the bottom of the page and and scooping up all the sprinkled JS and bundling them together and defer their execution. There is no optimization in the "architecture" of the JS code, just the "pattern" in which they are loaded.
Over in my clone in the optimize-js-loading branch I have implemented that.
You get up to 400ms (generally around 50-100ms) improvements (in production env, with "warm caches"). But aside from "being finished" earlier, the page builds up faster, because rendering is not paused by all those small pieces of JS everywhere. You can see in the screen shots below, the network graph is steeper with the optimizations, which means more things can be/are requested in parallel.
I'd like to know if this is something worthwhile or just a useless gimmick.
In the screen shots the top is the old way and on the bottom you have the optimized loading.
the dashboard:
the commits page:
the files page:
the issues page:
a merge request:
