Optimizing File Size
I decided to tackle file size as a fun side project at the office. After our big refactor for JW7 we finally had a modular, clean(er) codebase – so now the fun begins. Let’s squeeze it down as small as possible!
With this kind of task it’s always best to set some goals, pluck the low-hanging fruit and then re-evaluate. Our current player size was 232 kb minified, and as a team we established a goal of reaching 200kb.
To identify targets for refactor, I enabled verbose reporting on WebPack. This causes the compiler to output the size of each module independently. I piped that into a file and deleted everything above and below the modules list.
The results
<< Trimming the rest >>
Analysis
My first surprise was the YouTube Provider, which adds playback capability for YouTube videos. I was surprised to see this as number 6 on the list – when we don’t even care about it! Internally we categorized YouTube files as legacy and do not technically support them in v7.0.0. This is an unfortunate misalignment between our code investment and our business goals. The YouTube provider could easily be removed from the player and loaded only when needed. Low hanging indeed!
There are other unused bits as well; for example we include both ttf and woff fonts, and yet a browser only needs one of them. Couldn’t we package in the most common format, and then polyfill in the backup – only when necessary? Another eye-catcher was noticing the CSS was 4th on the list; why is it 22kb? Is that large, average, light?
One cool thing to note when analyzing a library this way is that it can often indicate problems in code organization. Clearly our “helpers.js” file is too large, it does too many things and it should be broken up. True, we got the same message from Plato, and haven’t addressed it yet, but more nails in a coffin can’t be a bad thing.
One final thing to observe is that these sizes are pre-minification, which is a side-effect of our use of the WebPack Uglify Plugin instead of uglifying before compiling. For the purpose of this exercise it doesn’t matter, but we could definitely get more accurate if the needs demanded it.