Nuxt | vendor Bundle size 822 KiB

JamesDevGit commented 5 years ago

Nuxt, adding flamelink, firebase, firebase-admin results in large vendor bundle

"dependencies": {
    "@nuxtjs/axios": "^5.3.6",
    "@nuxtjs/dotenv": "^1.3.0",
    "@nuxtjs/pwa": "^2.6.0",
    "cross-env": "^5.2.0",
    "firebase": "^6.0.4",
    "firebase-admin": "^8.0.0",
    "flamelink": "^1.0.0-alpha.19",
    "lodash.get": "^4.4.2",
    "nuxt": "^2.3.4"
  },

yarn generate output


14246514bf87e04fa48c.js   1.41 KiB       3  [emitted]         pages_index
       1dcd19daef935a41ed08.js   2.29 KiB       5  [emitted]         runtime
       283f22bcd25441aa25b7.js   41.1 KiB       0  [emitted]         app
       4d458aa5a1c906b42067.js    157 KiB       1  [emitted]         commons.app
       8cdcb96c8d3af4cbe495.js      8 KiB       4  [emitted]         pages_products_index
                      LICENSES   3.11 KiB          [emitted]
       c3cdb2ae0a92c9ef861e.js   2.47 KiB       2  [emitted]         pages_blog_index
       e693bc6a2abd82a74f0c.js    822 KiB       6  [emitted]  [big]  vendors.app
icons/icon_120.9mld2VBMsQ$.png   3.05 KiB          [emitted]
icons/icon_144.9mld2VBMsQ$.png   3.78 KiB          [emitted]
icons/icon_152.9mld2VBMsQ$.png   3.96 KiB          [emitted]
icons/icon_192.9mld2VBMsQ$.png   5.01 KiB          [emitted]
icons/icon_384.9mld2VBMsQ$.png     11 KiB          [emitted]
icons/icon_512.9mld2VBMsQ$.png   13.9 KiB          [emitted]
 icons/icon_64.9mld2VBMsQ$.png   1.61 KiB          [emitted]
        manifest.251bf9f7.json  863 bytes          [emitted]
 + 2 hidden assets
Entrypoint app [big] = 1dcd19daef935a41ed08.js 4d458aa5a1c906b42067.js e693bc6a2abd82a74f0c.js 283f22bcd25441aa25b7.js

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets: 
  e693bc6a2abd82a74f0c.js (822 KiB)

WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (1000 KiB). This can impact web performance.
Entrypoints:
  app (1020 KiB)
      1dcd19daef935a41ed08.js
      4d458aa5a1c906b42067.js
      e693bc6a2abd82a74f0c.js
      283f22bcd25441aa25b7.js

Hash: 3f143a5153279290d70b
Version: webpack 4.32.2
Time: 2755ms
Built at: 2019-05-28 11:04:03
                  Asset       Size  Chunks             Chunk Names
418249a92184b41de3a0.js   2.41 KiB       1  [emitted]  pages_blog_index
509a004d3230bbb0623f.js   8.13 KiB       3  [emitted]  pages_products_index
e4aa9505dd39f6f96b27.js   1.58 KiB       2  [emitted]  pages_index
              server.js   37.9 KiB       0  [emitted]  app
   server.manifest.json  483 bytes          [emitted]
 + 4 hidden assets
Entrypoint app = server.js server.js.map
i Generating pages                                                                                                                                                                                        11:04:04
√ Generated /

any advice on how best to amend my flamelink js would be greatly appreciated

jperasmus commented 5 years ago

Can you please run Nuxt.js's bundle analyzer and post the results here so we can see what it contains?

JamesDevGit commented 5 years ago

Not sure how best to show the results of running that - it products an html page and json file. here is Screenshot of html file dev

jperasmus commented 5 years ago

Thanks, this is good. It shows that the biggest part of the bundle is the @firebase/firestore/dist/index.cjs.js package, followed by the auth.esm.js one. There are a few interesting things I'm seeing regarding the Flamelink SDK that we will try and improve on before this SDK graduates out of alpha and beta.

jondavidjohn commented 5 years ago

I built a tool to help you analyze webpack bundles for size regressions, and report them directly to GitHub PRs. It's free for open source, so it might be worth checking out and helpful in this scenario.

https://packtracker.io

jperasmus commented 5 years ago

This is awesome, thanks for sharing @jondavidjohn

jperasmus commented 5 years ago

@jondavidjohn does packtracker only work with Webpack? We're using rollup for this project.

jondavidjohn commented 5 years ago

Doh, yes, it only works for webpack based builds.

jperasmus commented 5 years ago

Ah okay, thanks, I thought I might've missed something. Any plans for rollup support in the future?

jperasmus commented 5 years ago

@JamesDevGit since v1.0.0-alpha.23 all the Flamelink packages are now split out into the individual modules + individual databases. ie. separate files for the content module for cloud firestore versus the realtime db.

I've also updated the Nuxt.js basic example to use the new version of the SDK as an example of how you would only import what you need.

More info regarding the new file sizes are here: https://github.com/flamelink/flamelink-js-sdk/pull/92#issuecomment-521169740

jondavidjohn commented 5 years ago

@jperasmus Not in the short term, need to see some demand build up to warrant it.

jperasmus commented 5 years ago

Fair enough. I’m definitely going to give it a try on some of my Webpack based projects.

On Wed, 14 Aug 2019 at 19:01, Jonathan D. Johnson notifications@github.com wrote:

@jperasmus https://github.com/jperasmus Not in the short term, need to see some demand build up to warrant it.

— You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub https://github.com/flamelink/flamelink-js-sdk/issues/82?email_source=notifications&email_token=ABTZC7GSBNG5XVH3RCONG7LQEQ26RA5CNFSM4HQB63BKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD4JOE4Q#issuecomment-521331314, or mute the thread https://github.com/notifications/unsubscribe-auth/ABTZC7GT7A5FTH3DTZ7EUE3QEQ26RANCNFSM4HQB63BA .

flamelink / flamelink-js-sdk

Nuxt | vendor Bundle size 822 KiB #82