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

studio-ui bundling #368

Merged
merged 31 commits into from
Sep 20, 2023
Merged

studio-ui bundling #368

merged 31 commits into from
Sep 20, 2023

Conversation

oshi97
Copy link
Contributor

@oshi97 oshi97 commented Sep 8, 2023

Bundles studio-ui to reduce multiple round trips made by the browser to the vite dev server.
The browser still makes network requests for things like localData and component files.
One way to reduce perceived lag here is server side rendering studio.
Another is the loading indicator we have planned.

DOMContentLoaded is now 412ms instead of 5.09s.
There should be a bigger improvement in CBD due to network requests taking longer there compared to local.
5.0MB transferred instead of 14.6MB (could be smaller probably but still yay!)

Removes ts-morph/typescript dependencies from TypeGuards and by extension the ui bundle (they are big packages).
Updates lodash imports to use smaller scoped imports.
Adds vite plugins for bundle size, css in js, dts files, and svg imports.

J=SLAP-2921
TEST=manual

I can start up studio and see less requests in the network tab

old network tab

Screen.Recording.2023-09-08.at.1.06.03.PM.mov

new network tab
image

@oshi97 oshi97 changed the base branch from main to dev/separate-ui-package September 8, 2023 16:36
@oshi97 oshi97 changed the title Dev/bundling studio-ui bundling Sep 8, 2023
oshi97 and others added 5 commits September 15, 2023 14:25
This PR removes top-level fragments from the component tree of each layout in the layout slice so they won't be displayed in the UI when adding a layout to a new page. HMR is also updated to re-sync layouts in the store when a layout file is changed or a full sync is performed.

J=SLAP-2937
TEST=manual

In the test-site, saw that if `LocationLayout` had a top-level fragment, it was not present in the component tree in the `layouts` record. Also, checked that updating `LocationLayout` while running the test-site would correctly update it's component tree in the store.
@tmeyer2115 tmeyer2115 marked this pull request as ready for review September 20, 2023 13:37
Base automatically changed from dev/separate-ui-package to main September 20, 2023 14:37
@oshi97 oshi97 requested a review from a team September 20, 2023 15:17
@oshi97 oshi97 merged commit 2c401b6 into main Sep 20, 2023
15 checks passed
@oshi97 oshi97 deleted the dev/bundling branch September 20, 2023 16:00
alextaing pushed a commit that referenced this pull request Sep 20, 2023
Bundles studio-ui to reduce multiple round trips made by the browser to
the vite dev server.
The browser still makes network requests for things like localData and
component files.
One way to reduce perceived lag here is server side rendering studio.
Another is the loading indicator we have planned.

DOMContentLoaded is now 412ms instead of 5.09s. 
There should be a bigger improvement in CBD due to network requests
taking longer there compared to local.
5.0MB transferred instead of 14.6MB (could be smaller probably but still
yay!)

Removes ts-morph/typescript dependencies from TypeGuards and by
extension the ui bundle (they are big packages).
Updates lodash imports to use smaller scoped imports.
Adds vite plugins for bundle size, css in js, dts files, and svg
imports.

J=SLAP-2921
TEST=manual

I can start up studio and see less requests in the network tab

old network tab

https://github.com/yext/studio/assets/23005393/022d6199-5fa6-47db-b84b-5e543c729ae3

new network tab

![image](https://github.com/yext/studio/assets/23005393/45c9d4d1-b25c-4d16-bb0a-fdbe5ca01d3c)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants