supertokens-auth-react
supertokens-auth-react copied to clipboard
supertokens
Large Bundle size
This is a great product and library. However my main criticism is the bundle size.
Supertokens-auth-react: 590kb libphonenumber: 350kb react-phone-number-input: 212kb supertokens-website: 133kb chroma: 97kb emotion 69kb
Combined this is well over 1mb for the entire library.
A few questions:
- Are we able to optionally drop libphonenumber/react-phone-number-input ? We are only using one country code and do not need this.
- Are we able to drop chroma?
- Is there a way we can delay loading the supertokens scripts to mitigate impact on performance?
hey @jeremylynch the supertokens-auth-react SDK is split into different recipes which have their own size limits. Furthermore, the production, minified build for supertokens-website is 10kb. Is the above screenshot from a dev build?
At the moment, the initialisation of supertokens is done statically - this means that you must import from all the recipes you want to use upfront - this increases the bundle size.
We can explore an API change to make this more dynamic. But this will probably take a while.. For now, what you can do is to call supertokens.init with a different config based on which page is being loaded in your app. For example, on most pages of your app, you would need only the Session recipe (assuming you use the SessionAuth and not EmailPasswordAuth or PasswordlessAuth), then on those pages, you can initialise the recipeList with the session recipe and nothing more. For the login pages, you can use the EmailPassword and Passwordless recipe.
This would of course require your app to not be an SPA, or at least not be an SPA for the login pages only. Anyhow, I do see this as a problem and we can work on solving this.
Are we able to optionally drop libphonenumber/react-phone-number-input ? We are only using one country code and do not need this. Are we able to drop chroma?
Not easily. You can always fork the repo and make the change in the code yourself though.
Is there a way we can delay loading the supertokens scripts to mitigate impact on performance?
I think my initial paragraph answers this question.
If this is a deal breaking issue for you, you can always build your own UI and use just the supertokens-website SDK for session management - that should be ~10kb for production build
Are you referring to the "stat size" that the bundle size analyzer gives? That is taken before minification and , please check the parsed/gzipped sizes. Parsed size is the one that affects startup time and the Gzip size is representative of the amount of data that is transferred over the network.
Contributor
https://bundlephobia.com/package/[email protected]
Seeing red on bundle analyzer gives me panic attacks. Thanks.
hey @BrycensRanch we are in the process of getting rid of the emotion dependency which forms a huge part of the bundle size. Should be done within the next month.
