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

Enable code splitting at the route level #563

Open
seriouslysean opened this issue Sep 7, 2023 · 10 comments · May be fixed by #1100
Open

Enable code splitting at the route level #563

seriouslysean opened this issue Sep 7, 2023 · 10 comments · May be fixed by #1100
Assignees
Labels
enhancement New feature or request frontend Requires changes to the frontend (vue) client hacktoberfest This issue welcomes contributions for Hacktoberfest.

Comments

@seriouslysean
Copy link
Collaborator

Feature Summary

Async load top level view components to take advantage of code splitting

Detailed Description

Convert routes to something like this:

const routes = [
    {
        path: '/path',
        component: () => import('/path/to/component')
    }
]
@seriouslysean
Copy link
Collaborator Author

@Nishith-Savla
Copy link

Hey @seriouslysean, I would like to work on this. Can you please assign it to me?

@seriouslysean
Copy link
Collaborator Author

@Nishith-Savla when working on this, 2 things to look out for:

  • code splits properly and the bundle decreases in size for each route.
  • The user experience is not impacted by longer load times.

I expect time to first byte will improve, but I don’t want that to be at the cost of navigation speeds when browsing from page to page.

Keeping in mind the critical path is Home/GameList -> Lobby -> Game.

@seriouslysean seriouslysean added enhancement New feature or request hacktoberfest This issue welcomes contributions for Hacktoberfest. frontend Requires changes to the frontend (vue) client labels Oct 19, 2023
@Nishith-Savla
Copy link

Yes will surely keep in check. Also, how do I check the bundle size for each route? Through the browser network captures?

@seriouslysean
Copy link
Collaborator Author

Browser capture is totally fine. Some sort of bundle analyzer or do a production build and check files on the hard drive.

@Nishith-Savla
Copy link

Ok will try.

@Nishith-Savla Nishith-Savla removed their assignment Dec 30, 2023
@ar1701
Copy link

ar1701 commented Oct 1, 2024

Hi @seriouslysean , I would to contribute into this. Can you please assign this to me ?

@IamPossible007
Copy link

HI @seriouslysean , is this issue resolved because in https://github.com/cuttle-cards/cuttle/blob/main/src/router.js#L43
I find most of the routes have been configured as you wished , so if this issue is still open , I would like to contribute to it , this is my first time contributing to open source , I would like to start my journey , if you can help me , would be grateful.

@ar1701
Copy link

ar1701 commented Oct 2, 2024

I am trying to create a pr, but this is coming
At least 1 approving review is required by reviewers with write access.
@seriouslysean can u help me with this ?

@Haviles04
Copy link
Contributor

Haviles04 commented Oct 2, 2024

I am trying to create a pr, but this is coming
At least 1 approving review is required by reviewers with write access.
@seriouslysean can u help me with this ?

Your PR is created, it is waiting for review, and approval from the Core Team before it can be merged into the codebase 👍

@ar1701 ar1701 linked a pull request Oct 12, 2024 that will close this issue
4 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request frontend Requires changes to the frontend (vue) client hacktoberfest This issue welcomes contributions for Hacktoberfest.
Projects
None yet
5 participants