-
Notifications
You must be signed in to change notification settings - Fork 2
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
perf: only use the bootstrap js that we need #75
Conversation
@@ -7,6 +7,8 @@ | |||
"@types/react": "^18.0.21", | |||
"@types/react-dom": "^18.0.6", | |||
"axios": "^0.26.1", | |||
"bootstrap": "^5.3.2", | |||
"popper": "^1.0.1", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
popper is a peer dep for the dropdown stuff in bootstrap
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To check my understanding:
- Currently we are loading the entire bootstrap from a CDN. This should be pretty fast as is, and loads in parallel with our app js bundle.
- This PR makes it so that instead of loading from a CDN in parallel with with our app js, we bundle a small amount of the bootstrap directly into our app js bundle? Meaning our app js bundle becomes slightly bigger after this.
Is that right? If so, I am curious how much faster this ends up being. If you have time, would be cool to see a before/after performance metric for this somehow after we deploy.
@wweitzel yeah lighthouse doesn't show much of a difference in local testing as far as I can tell - bottom line is that we'll be shipping less JS to the browser though, which I think is good. No crazy performance gains though |
Instead of loading the entire bootstrap JS up front, we should use our package manager and bundler to only ship the JS that we need - in this case, the only things that we actually use the bootstrap JS for are the dropdowns, so just import the dropdown JS.