将 WebAssembly 二进制文件减少 72% - 从 56KB 减少到 26KB，再减少到 16KB 🎉✨🦄

每个字节都很重要 - 优化它们

因此，我们将代码从 减少到 约 40 26KB% 16KB。

每个字节都很重要 - 优化它们

预算对性能至关重要。尽可能减少发送量至关重要。您可以阅读Addy Osmani 的精彩文章，了解更多关于 JavaScript 开销的信息。

WebAssembly 二进制文件依赖于底层工具链。对于每个工具链来说，尽可能地优化二进制文件非常重要。

这就是我爱上 TinyGo 的原因。他们生成的 WebAssembly 二进制文件非常精简，令人印象深刻。

在上一篇文章中，我们已经了解了如何通过删除来减少 50% 的二进制大小fmt。

Liquid 错误：内部

当前二进制大小是26KB- 查看此提交✨✨✨

现在我们将尝试进一步减少二进制大小。

使用最新的开发分支

目前，我们使用的是 TinyGo 版本0.6.0。由于该版本正在积极开发中，因此当前dev分支可以精简更多代码。我们就用这个版本吧。

点击此处查看如何克隆和构建项目的说明。设置完成后，TinyGo 二进制文件将在文件夹中可用build。

让我们使用这个TinyGo二进制文件来构建它。

../tinygo/build/tinygo build -o out/main.wasm -target wasm ./go/main.go

我们删除了4KB，虽然改进不大，但仍然如此every byte counts。

当前二进制大小为22KB。

删除自定义部分

WebAssembly 二进制文件由多个部分组成。这些部分分别用于内存、导入、导出、函数定义和其他内容。点击此处了解更多信息。

自定义部分提供了元数据信息。这些元数据信息用于调试，但对于 WebAssembly 的正常执行并非必需。我们可以将其删除。

注意，这部分在调试时完全是可选的。在生产环境中，我们可以将其移除。

我们可以使用WABT之类的工具。使用 WABT，我们可以将 WebAssembly 模块转换为文本格式，然后再转换回 WebAssembly 模块。这将完全删除自定义部分，并剥离一些多余的字节。

我们又删除了一个4KB，嗯，这又不是什么很大的改进。不过every byte counts，现在二进制文件是18KB。

当前二进制大小为18KB。

消除内部恐慌

提供Tinygo了一个--panic选项。通过此选项，我们可以选择崩溃策略。也就是说，它指定了编译后的程序在发生崩溃时应该执行的操作。

我们可以使用该--panic trap选项。此选项将在其运行的平台中调用陷阱指令，而不是引发恐慌。

../build/tinygo build -o out/main.wasm -target wasm -panic trap ./go/main.go 

生成的二进制文件大小为 16KB，比实际大小少了 2KB。

当前二进制大小为16KB。

因此，我们将代码从 减少到 约 40 26KB% 16KB。

感谢贾斯汀·克利夫特

存储库在这里

希望以上内容能激励你开启精彩的 WebAssembly 之旅。如果你有任何问题/建议，或者觉得我遗漏了什么，欢迎随时留言。

您可以在Twitter上关注我。

如果你喜欢这篇文章，请点赞或者留言。❤️