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

Creating Gzip files while build #3169

Closed
Ayc0 opened this issue Sep 22, 2017 · 10 comments
Closed

Creating Gzip files while build #3169

Ayc0 opened this issue Sep 22, 2017 · 10 comments

Comments

@Ayc0
Copy link

Ayc0 commented Sep 22, 2017

With the current config of CRA when you build the project, the files aren't gzipped so if you want to serve gzipped files, you have to either gzipped dynamically or to eject.

What could be awesome is when a build is run, two folders are created in the build folder: one regular and one with the gzipped files. Or having the possibility to set a env var GZIP and build only one folder, gzipped or not

@miraage
Copy link

miraage commented Sep 26, 2017

I'd also vote for this feature because GZip files have already been creating for the size difference.
Just save them as well as regular files.
Also Nginx supports .gz files via gzip_static on; directive.

@Ayc0
Copy link
Author

Ayc0 commented Sep 26, 2017

I thought about the api:

  • You set an env variable gzip to true
  • Produces regular files plus the .gz ones

@bogdan-calapod
Copy link

I don't feel like this is in the scope of CRA - isn't the web server's job to gzip assets before sending them to the browser ?

@miraage
Copy link

miraage commented Sep 26, 2017

@bogdan-calapod take a glance at https://github.com/facebookincubator/create-react-app/blob/v1.0.13/packages/react-dev-utils/FileSizeReporter.js#L128

This function is invoked during the build. It's using zlib.gzipSync method: https://nodejs.org/dist/latest/docs/api/zlib.html#zlib_zlib_gzipsync_buffer_options

It's already happening. All they need is to dump this files to the disk.

@Ayc0
Copy link
Author

Ayc0 commented Sep 26, 2017

And if it is the web server that gzip the assets, it is done dynamically, so you have to regzip your assets every time (Nginx has a cache but that's not the point)

@Gandem
Copy link
Contributor

Gandem commented Sep 26, 2017

Gzipping files is usually done by the CI / manually.

By default, static web servers do not handle statically gzipped files (need extra configuration). I'm guessing that people needing to statically gzip thebuild folder already do that in their deployment process (and it's quite easy to gzip files in a terminal).

It's a cool feature to have, but it doesn't feel in CRA's scope.

@Timer
Copy link
Contributor

Timer commented Sep 29, 2017

I'm pretty sure this is most often handled by the web server, e.g. express has a gzip option, and I'm sure nginx has an option for this too.

I'm not sure I see the value in us providing these by default.

Let me know if I'm wrong.

Also, I feel like this is easily accomplished with a postbuild script that gzips your assets.

@Timer Timer closed this as completed Sep 29, 2017
@ghost
Copy link

ghost commented Oct 9, 2017

Since you think it is out of scope of CRA, can you suggest an npm package that runs as "post-build" or a "deploy" script and gzip all my "build/" files?

I'm on Windows, Linux, Mac machines (everytime changes).

@Gandem
Copy link
Contributor

Gandem commented Oct 9, 2017

Hey @johnunclesam ! If you're searching for a cli gzip utility in Node, any wrapper cli using zlib will do the job. For example : https://www.npmjs.com/package/gzip-all

@Deepankar01
Copy link

Deepankar01 commented Sep 18, 2018

in case anyone is looking how to do it in nginx
i know this is not the correct place but this is the first link on googling
can add or change stuff accordingly. so no need to do anything in CRA just dump your build in the nginx public folder with these configurations

for configurations can go to nginx docs can read this link further
https://www.digitalocean.com/community/tutorials/how-to-add-the-gzip-module-to-nginx-on-ubuntu-14-04

    gzip on;
    gzip_disable "msie6";

    gzip_vary on;
    gzip_proxied any;
    gzip_comp_level 6;
    gzip_buffers 16 8k;
    gzip_http_version 1.1;
    gzip_types text/plain image/svg+xml image/gif image/jpeg image/png application/font-woff text/css application/javascript application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript;

@lock lock bot locked and limited conversation to collaborators Jan 18, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

6 participants