“首次加载 JS”大小问题 Next.js。 （使用 immutable.js）

Question

在我的项目（Next.js v10）中，不可变库用于与 redux 一起工作。现在我解决了优化的问题，因为我遇到了“红色”首先加载js的问题。

我在这方面还不是很强，但我会努力学习和理解一切。我在页面本身上应用了动态导入，正如到处都建议的那样，它有很大帮助，因为情况比现在更糟。我检查了 _document.js 和 _app.js，一切似乎都很好，除了：

//_app.js

const {serialize, deserialize} = require('json-immutable');

...

const wRedux = withRedux(makeStore, { 
    serializeState: state => state ? serialize(state) : state,
    deserializeState: state => state ? deserialize(state) : state
})(MyApp);

export default wRedux;

按照现在的方式，我得到：

如果我完全关闭序列化和反序列化的使用（在 _app.js 中），并且 index.tsx（没有 redux 请求，也没有 React 以外的导入）只会返回一个空 div => 我明白了：

const wRedux = withRedux(makeStore, { 
   serializeState: state => state,
   deserializeState: state => state
})(MyApp);

一些块丢失了，但不可变块仍然存在（ 虽然由于某种原因它的大小略有不同，但哈希是相同的）：

我发现这篇文章：https://betterprogramming.pub/try-these-instead-of-using-immutable-js-with-redux-f5bc3bd30190 并查看https://www.npmtrends.com/immutable-vs-immer-vs-seamless-immutable

问题是整个项目已经在语法immutable-js(post.get('prop'))上

我的问题：

1. Immer 会好多少？
2. 他（Immer）是否也会“进入一般区块”？
3. 还有哪些其他方法可以减小“First Load JS 所有人共享”的大小？
4. 也许还有其他一些缺点，由于缺乏经验，我没有注意到，但可以在报告中看到它们？

感谢您的帮助！

Answer 1

我发表了我的工作成果，我希望这对某人有帮助（对不起我的英语:)）。

放弃 immutable.js 以支持 Immer 确实是有道理的 (156 => 123)：

另外，如果有人感兴趣，请仔细查看您的块。从我的问题可以看出，除了 Immutable 之外，http-status.js 也被“添加”到了通用的 First Load JS 中。这是一个带有一组响应代码的标准文件，我只需要其中一个（我只是手动写了数字并删除了导入），并且导入它的文件分发到整个应用程序。另外，我修改了第三方脚本的连接，并在下一个v10中使用了字体的内部优化：

此外，与 immutable 结合使用的 json-immutable 不再需要，它又删除了 2 个小块。

我之前有问题的块现在看起来像这样：

最后：“First Load JS 由所有人共享”已从 156 kB 减少到 111kB (28.85%)

P.S. 我有这么大的 _app.js 块，因为我由于 getInitialProps 而禁用了自动静态优化