Optimize webpack bundles #3457
Draft
Optimize webpack bundles #3457
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Is this a draft because you are planning to finish the edit stuff later, or because it is not ready to test/merge yet? Because I don't think we need to do it all in one go if this would be an improvement already. |
mwiencek
force-pushed
the
optimize-webpack-bundles
branch
from
304c74f to
c69cd9e
Compare
mwiencek
force-pushed
the
optimize-webpack-bundles
branch
from
c69cd9e to
81e9f14
Compare
No breaking changes seem applicable to us.
This was added in 30e0316, but these events have been supported in modern browsers for years by now. Also, the PR that added this polyfill (metabrainz#1858) already included a workaround that didn't require the events.
* All JS files referencing `ko` should be importing knockout at this point. * I didn't find any free references to the `ko` global in .tt files either.
The inline requires were previously needed because TagEditor.js is loaded on the server, and these libraries need a window to exist. But they've since been mapped to empty.js on the server.
It was already being loaded in the respective $entity/index.js files in most cases.
Also avoid loading the `CommonsImage` component entirely if disabled at the DBDefs level -- this just leads to pointless requests and page bloat.
It was already being loaded in the respective $entity/index.js files, except for genres, which is now fixed.
It's only used in the file it's defined in, so there's no need to expose it on there.
AFAICT, the only use of these rating macros was in root/medium/tracklist.tt. But the only use of *that*, in root/cdtoc/attach_list.tt, passed `hide_ratings = 1`.
This is used for event art too, and "load" makes it clearer what it's for.
It doesn't seem to be referenced anywhere.
There are no longer any references to this.
That allows us to get rid of the last reference to `MB.Control.Area` (via the `MB` object); we can import it as `initializeArea` everywhere now.
AFAICT, this is not needed, as it doesn't export anything onto `window` or `MB`, nor does it hydrate anything.
This should only be outputted once for the entire page, not for every release event!
It was being overwritten with 'compound_field'.
It's currently passed by embedding some JSON within an inline script within TT. This will allow us to get rid of those inline scripts. I moved the primary functionality of `Form::Role::TO_JSON` into `Form::Utils` so that it can easily be called on an individual field rather than the top-level form only.
I don't think it's been needed here for a while. The external links editor component is already responsible for calling it.
`MB.initializeDuplicateChecker` is not referencd anywhere.
Instead of indirectly accessing the edit/MB/edit.js exports via the `MB` object, import the file directly. This diff is best viewed with whitespace ignored.
This was the last utility from forms.js exposed on the `MB` object, so that file can now be removed from edit.js.
Additionally, * remove it from the global `MB` object. * remove GuessCase.js from edit.js.
…cripts Additionally, remove `initializeBubble` from the `MB.Control` object.
It's now empty.
mwiencek
force-pushed
the
optimize-webpack-bundles
branch
from
81e9f14 to
dd90516
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Problem
We have a file, root/static/scripts/common.js, which is used as a Webpack entry point for code that gets run on every page. It bundles a ton of code which definitely doesn't need to run on every page. We have a similar one for edit pages.
The common-chunks bundle also includes too much code; we could allow more chunks to be duplicated in other bundles to reduce the size of common-chunks, and thus the amount of code that gets run on each page (at the cost of more files having to be downloaded/cached initially).
Solution
This mainly just adds additional entry points, or missing imports for the files that were listed in common.js, then removes common.js. I also did the same for edit.js. Most of this code was started last year, but I lost motivation to finish it because the React migration would have improved a lot of these issues too (by deleting a lot of the code being run). Since that's taking too long, I decided to submit it anyway (as it will still be useful in the long run).
Testing
Just browsing/using the affected pages locally.