inrupt / inrupt/solid-client-authn-js

package size is very large, bloats dependent libraries and gives next.js heartburn

Open
#2,060 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug
Dominant language
TypeScript
Stars
77
Forks
49
Avg merge
18h 20m
Merged PRs (30d)
32

Description

Search terms you've used

package, size, rollup

Impacted package

Which packages do you think might be impacted by the bug ?

  • solid-client-authn-browser
  • solid-client-authn-node
  • solid-client-authn-core
  • oidc-client-ext
  • Other (please specify): ...
Bug description

When we use this package as a dependency it adds ~100k (after minification and gzipping) to the size of the parent.

We suspect this is related somehow to the fact that this package is 3.39MB unpacked according to NPM:

https://www.npmjs.com/package/@inrupt/solid-client-authn-browser

We first discovered this while trying to debug failing Next.js builds and have an open ticket there:

https://github.com/vercel/next.js/issues/35602

We've tracked this down to some combination of swrlit, @inrupt/solid-client and @inrupt/solid-client-authn-browser and strongly suspect the issue is with one of the Inrupt libraries. Including @inrupt/solid-client bloats the minified/gzipped CJS package by ~90kB (but not the ESM package!) and including @inrupt/solid-client-authn-browser bloats both the CJS and ESM minified/gzipped packages by ~100kB.

To Reproduce
  1. git clone https://github.com/mysilio-co/swrlit.git
  2. cd swrlit
  3. git checkout debug-big-package
  4. edit src/index.ts and uncomment import "@inrupt/solid-client-authn-browser"
  5. run npm install
  6. run npm run build && npm run size
Expected result

Minified/gzipped package size should be under 10kB

Actual result

Minified/gzipped package size is 102.78 kB

Environment
  System:
    OS: macOS 11.6.4
    CPU: (8) x64 Intel(R) Core(TM) i7-8569U CPU @ 2.80GHz
    Memory: 101.23 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.13.1 - ~/.nvm/versions/node/v16.13.1/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 8.1.2 - ~/.nvm/versions/node/v16.13.1/bin/npm
  Browsers:
    Brave Browser: 99.1.36.119
    Chrome: 99.0.4844.84
    Firefox: 98.0.2
    Safari: 14.1.2
  npmPackages:
    @babel/core: ^7.12.3 => 7.14.3
    @inrupt/solid-client: ^1.19.0 => 1.19.0
    @inrupt/solid-client-authn-browser: ^1.11.2 => 1.11.2
    @inrupt/vocab-common-rdf: ^1.0.3 => 1.0.3
    @inrupt/vocab-solid-common: ^0.7.5 => 0.7.5
    @size-limit/preset-big-lib: ^7.0.8 => 7.0.8
    @storybook/addon-essentials: ^6.0.28 => 6.2.9
    @storybook/addon-info: ^5.3.21 => 5.3.21
    @storybook/addon-links: ^6.0.28 => 6.1.1
    @storybook/addons: ^6.0.28 => 6.1.1
    @storybook/react: ^6.0.28 => 6.2.9
    @testing-library/react-hooks: ^3.4.2 => 3.4.2
    @types/jest: ^25.2.3 => 25.2.3
    @types/react: ^17.0.30 => 17.0.30
    @types/react-dom: ^17.0.9 => 17.0.9
    @types/url-parse: ^1.4.3 => 1.4.3
    babel-loader: ^8.2.1 => 8.2.2
    dequal: ^2.0.2 => 2.0.2
    molid: ^0.3.0 => 0.3.0
    react: ^17.0.1 => 17.0.2
    react-dom: ^17.0.2 => 17.0.2
    react-is: ^17.0.2 => 17.0.2
    react-test-renderer: ^17.0.2 => 17.0.2
    size-limit: ^7.0.8 => 7.0.8
    swr: ^1.0.1 => 1.0.1
    ts-jest: ^25.5.1 => 25.5.1
    tsdx: ^0.14.1 => 0.14.1
    tslib: ^2.3.1 => 2.3.1
    typedoc: ^0.22.6 => 0.22.6
    typescript: ^4.4.4 => 4.4.4
    url-parse: ^1.4.7 => 1.5.1
    whatwg-fetch: ^3.5.0 => 3.5.0
  npmGlobalPackages:
    corepack: 0.10.0
    npm: 8.1.2
    size-limit: 7.0.8
    tsdx: 0.14.1
    yalc: 1.0.0-pre.53

Additional information

This is a very strange issue - I tried fiddling with the rollup build a bit but didn't have any luck. The Next.js build issue is non-deterministic but seems related to the weight of this dependency. Have been working on debugging this for several days and have tried many things - happy to chat in higher bandwidth if that would be helpful!

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the reproduction repository's src/index.ts and run npm install followed by npm run build && npm run size on the debug-big-package branch. Compare bundle sizes with and without @inrupt/solid-client-authn-browser, then trace the included dependencies, including swrlit and @inrupt/solid-client. Done means identifying the source of the CJS and ESM size increase and documenting or correcting the relevant package behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
next.js, rollup, typescript
Domain
build-system, performance
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.