Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Show gzip compression size after build

See original GitHub issue

🚀 Feature request

Command (mark with an `x`)

new
build
serve
test
e2e
generate
add
update
lint
extract-i18n
run
config
help
version
doc

Description

$ ng build
- Generating browser application bundles (phase: setup)...
✔ Browser application bundle generation complete.
- Generating ES5 bundles for differential loading...
✔ Browser application bundle generation complete.
✔ ES5 bundle generation complete.
- Copying assets...
✔ Copying assets complete.
- Generating index html...
✔ Index html generation complete.
Initial Chunk Files                    | Names                |      Size
main-es5.99064527cd544b123bc9.js       | main                 | 175.56 kB
main-es2015.99064527cd544b123bc9.js    | main                 | 149.94 kB
polyfills-es5.90dd4e2aec326855ce1b.js  | polyfills-es5        |  93.01 kB
styles.0b064ae4068cf2388220.css        | styles               |   5.02 kB
runtime-es2015.a0da3e8506fcfd740c60.js | runtime              |   1.16 kB
runtime-es5.a0da3e8506fcfd740c60.js    | runtime              |   1.16 kB
| Initial ES5 Total    | 274.75 kB
| Initial ES2015 Total | 156.12 kB
Build at: 2021-07-21T10:58:01.250Z - Hash: 2398fbe5637097cd0447 - Time: 17873ms

Describe the solution you’d like

$ ng build
- Generating browser application bundles (phase: setup)...
✔ Browser application bundle generation complete.
- Generating ES5 bundles for differential loading...
✔ Browser application bundle generation complete.
✔ ES5 bundle generation complete.
- Copying assets...
✔ Copying assets complete.
- Generating index html...
✔ Index html generation complete.
Initial Chunk Files                    | Names                |      Size                 |      GZip
main-es5.99064527cd544b123bc9.js       | main                 | 175.56 kB                 | 100.26 kB
main-es2015.99064527cd544b123bc9.js    | main                 | 149.94 kB                 | 80.14 kB
polyfills-es5.90dd4e2aec326855ce1b.js  | polyfills-es5        |  93.01 kB                 |  43.11 kB
styles.0b064ae4068cf2388220.css        | styles               |   5.02 kB                 |   2.02 kB
runtime-es2015.a0da3e8506fcfd740c60.js | runtime              |   1.16 kB                 |   0.42 kB
runtime-es5.a0da3e8506fcfd740c60.js    | runtime              |   1.16 kB                 |   0.42 kB
| Initial ES5 Total    | 274.75 kB | 154.75 kB
| Initial ES2015 Total | 156.12 kB | 86.12 kB
Build at: 2021-07-21T10:58:01.250Z - Hash: 2398fbe5637097cd0447 - Time: 17873ms

In many ways, we always know that the real size of a completely different will be transmitted over the network by the user

Issue Analytics

State:
Created 2 years ago
Comments:7 (1 by maintainers)

Top GitHub Comments

9reactions

alan-agius4commented, Jul 26, 2021

We did discuss this in our weekly meeting, and we decided that providing an “estimate transfer size” would be beneficial. We also discussed that this size should be done by using Node.JS Brotli API.

2reactions

alan-agius4commented, Jul 22, 2021

It uses gzip-size, which uses Gzip level 9 https://github.com/sindresorhus/gzip-size/blob/fdb1ec139fef8fec1fb3e2c8219f1fc87b279128/index.js#L8.

This means that webpack-bundle-analyzer displays the smallest possible gzip size, but it is very unlikely this reflects the true gzipped size served by a web-server. Since, it’s highly unlikely that a web-server will use gzip level 9.

Top Results From Across the Web

Is there an easy way to see amount of compression in Chrome?

Under "Response Headers" you should see "Content-Encoding: gzip" followed by a "Content-Length" header. This is the size of the compressed content. Finding the ......

How can I estimate the size of my gzipped script?

You can use the pretty-print and white-space only options to estimate the compression of non-minified content.

How To Optimize Your Site With GZIP Compression

Online: Use the online gzip test to check whether your page is compressed. In your browser: In Chrome, open the Developer Tools >...

How to Enable GZIP Compression for Faster Web Pages

Learn how GZIP compression works to deliver web pages to browsers more quickly, and how to activate it on your web server.

How can I get the uncompressed size of gzip file without ...

Compressed file size close to 4 GB. So, I tried this option in order to capture correct data: $ zcat mycontent.DAT.Gz | wc...