javascript - 通过 Node 服务器上的 gzip 压缩提高 React 应用程序的 Google 页面速度分数？

Question

我正在构建一个使用 webpack 的 React 应用程序，该应用程序生成大约 2 MB 的 bundle.js! 因此，该网站在 Google Page Speed 上的评级非常低。我想改进这一点，为此我缩小了所有图像、javascript、css 文件。评级有所提高，但仍然很差。

我将“启用压缩”视为 Google 页面速度洞察中的首要建议，我尝试为其集成 g-zip 压缩。通过这个我可以生成一个压缩的bundle.min.gz，但是当我将其包含在我的index.html中时，浏览器返回一个“未捕获的语法错误”并且没有任何效果

我假设我在设置用于发送 g-zip 压缩 内容的服务器时遗漏了一些内容。我对此很陌生。对于提高页面速度/启用 React 应用程序压缩方面的任何帮助，我将不胜感激。

提前致谢

Answer 1

在您的应用程序前面使用 nginx。这听起来像是开销，但这完全是常见的做法。 Nginx 提供安全性、日志、缓存、gzip、https 等开箱即用的功能。在您的 nginx 配置中添加以下配置:

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 text/css application/json application/javascript 
application/x-javascript text/xml application/xml application/xml+rss 
text/javascript;

在这种情况下，不要理会任何其他配置(例如 webpack)。