Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(v2): better webpack splitchunks optimization #1565

Merged
merged 4 commits into from Jun 6, 2019

Conversation

@endiliey
Copy link
Collaborator

commented Jun 5, 2019

Motivation

This PR is optimizing webpack splitchunks algorithm.

I notice that the react-live is not being lazily loaded properly due to our chunking algorithm. It tries to put vendors all into one folder.

The simple idea is this. For bigger node_modules package, try to split it out into a separate chunk

Consider this scenario

// a.js
import react
import endi
// b.js
import react
import endi
import react-live

Previously

will result in a.bundle.js, b.bundle.js and vendors.js (containing both react, endi and react-live)

So if i load a.bundle.js, it will also load vendors.js. Note that react-live is not needed but i had to load it too
If i load b.bundle.js, it will load vendors.js

This "PR

Which will result in a.bundle.js, b.bundle.js and vendors.js (containing both react and endi) and react-live.js
So if i load a.bundle.js, it will only load vendors.js.
If i load b.bundle.js, it will load vendors.js and react-live.js

Our first page load performance is definitely better.

Have you read the Contributing Guidelines on pull requests?

yes

Test Plan

before
before
before-warning

after
after
after-warning

overall bundle size has no change.
Due to browsers parallel request capability, this is definitely better.

@endiliey endiliey requested a review from yangshun as a code owner Jun 5, 2019

@docusaurus-bot

This comment has been minimized.

Copy link
Collaborator

commented Jun 5, 2019

Deploy preview for docusaurus-2 ready!

Built with commit 7df44b6

https://deploy-preview-1565--docusaurus-2.netlify.com

@docusaurus-bot

This comment has been minimized.

Copy link
Collaborator

commented Jun 5, 2019

Deploy preview for docusaurus-preview ready!

Built with commit 7df44b6

https://deploy-preview-1565--docusaurus-preview.netlify.com

@endiliey endiliey changed the title feat(v2): better webpack splitchunks optimization wip feat(v2): better webpack splitchunks optimization Jun 5, 2019

@endiliey endiliey force-pushed the endiliey/splitchunks branch from 4895e04 to a1be1a8 Jun 5, 2019

@endiliey endiliey changed the title wip feat(v2): better webpack splitchunks optimization feat(v2): better webpack splitchunks optimization Jun 5, 2019

endiliey added some commits Jun 6, 2019

@endiliey endiliey merged commit a0777f7 into master Jun 6, 2019

3 checks passed

ci/circleci: lint-prettier Your tests passed on CircleCI!
Details
ci/circleci: tests Your tests passed on CircleCI!
Details
deploy/netlify Deploy preview ready!
Details

@endiliey endiliey deleted the endiliey/splitchunks branch Jun 6, 2019

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
4 participants
You can’t perform that action at this time.