cdp-frontend
cdp-frontend copied to clipboard
CouncilDataProject
Consider removing `lodash` and `moment` packages
Feature Description
While reviewing another PR, I just noticed we're using lodash, which prompted me to do a check-up on our package weight and discovered that we're sitting at a pretty hefty 2MB after minification.
Of those 2MB, nearly 20% of that is caused by lodash and moment.
If you do a search for where these two packages are being used you'll find that:
Two functions from lodash are used in one file (although there will soon be a third function added to a second file when this PR gets merged).
One function from moment is also used in a file. Also as a side note, moment is currently installed as both a dependency and dev dependency 🤔.
In both of these cases, the functions we use from these libraries can be replaced with lighter alternative packages or even our own implementations of these utilities.
TLDR: I don't think 4 utility functions are worth a 20% increase in package weight.
Use Case
Package weight (and by proxy website weight) are an absolutely crucial metric for making sure the CDP website loads quickly.
Solution
As mentioned earlier we should remove lodash and moment and replace the 4 utility functions with a lighter utility package or our own custom implementation of the util functions.
I support the reason why we would remove these two packages.
Not sure about other use of lodash, but the one in my PR can be easily replaced with array.some().
Related to making our package lighter, we should remove semantic-ui-react as well and install only the components we need. The ones currently being used are Popup, Tab, and Loader. I've only used these because the styles of these components don't clash with Mozilla protocol.
If there's a UI component library that can be customized with Mozilla protocol styling and can be installed on a component basis, that would be great.
