这里对“我们的优化策略”部分的讨论不够，这部分对我来说是最有趣的。一些反应：> 我们发现react-icons有一个问题，导致所有内容都被导入。这意味着无论是否需要，我们都在包中包含了每一个react-icon。感谢Linen团队主动发现了这个问题——我觉得很多项目都盲目地相信tree-shaking他们的依赖项会“自动工作”，尽管对于许多库来说并不是这样！> 我们还注意到，我们在客户端只使用了AWS客户端进行s3上传，而它占用了比我们需要的大得多的包体积，所以我们用两个API调用替换了整个客户端包来调用AWS API。对于这种极小的使用场景，这似乎是一个合理的决定，尽管实现起来稍微麻烦一点。> 我们最终将代码高亮的代码移到了一个后端API，该API会缓存结果。看到网站在决定哪些工作应在服务器端处理还是客户端处理方面做出明智的选择，真是令人欣喜。
源讨论Linen.dev：500KB的Slack替代方案原帖 209 条评论 · 导入时统计把你的经验，加入这段讨论。
> 摇树（tree-shaking）他们的依赖 他们用了什么工具：Browserify、Webpack、Gulp、Rollup、Babel、Parcel、ESBuild 等。
完整原文> 很高兴看到网站在决定哪些工作应在服务器端处理，哪些应在客户端处理方面做出明智的选择。 在 https://www.linen.dev/s/linen 的介绍社区讨论页面 由于某种原因需要加载 20 多个 JavaScript 文件才能显示最新消息。 而即使完全阻止 JavaScript，消息仍然会显示，只是从 2022 年 10 月开始的最开始部分。 所以我不太确定它是否已经优化到最佳状态。
完整原文使用图标方面，我很久以前就不再使用图标库了，现在只导入我需要的 SVG 代码。我非常推崇 Hero Icons[1]，它们提供了一种快速将 JSX 或 SVG 代码复制到剪贴板的方法，以方便这个工作流程。 [1]: https://heroicons.com/
完整原文仅供参考，AWS SDK 中间有一个折中方案。如果你不需要全部功能（你确实不需要），你可以作为独立模块导入特定产品的 SDK。虽然比自己构建 HTTP 客户端还是要大一些，但如果你已经在使用 SDK 的话，这算是一个容易实现的优化。 例如，仅包含 S3 的 Java SDK： https://stackoverflow.com/questions/35591248/aws-sdk-for-s3-...
完整原文> 我觉得很多项目都盲目地相信通过 tree-shaking 他们的依赖项会 "自动工作"，尽管对于很多库来说这并不成立！ 有没有比观察最终的包大小并查看 JS 包内容更简单的方法来验证这一点呢？我不是前端开发人员，这超出了我通常的知识范围。
完整原文过去在一份工作中也发生过类似的情况——我们发现 FontAwesome 的每一个图标都被包含了进来。我写了一个 codemod 脚本来重构我们导入图标的办法，使其可以被 tree-shake。这将加载时间从 10 秒减少到了 2 秒——非常棒。
完整原文> tree-shaking 每次听到这个 JS 术语时我都感到很着迷，它本质上就是删除无用代码。
完整原文> 衷心赞扬Linen团队主动发现这个问题 - 我觉得很多项目都盲目地相信他们的依赖项进行树摇（tree-shaking）会"自动工作"，尽管对于许多库来说这根本不会奏效！ 对于某个特定的微软产品，这一点在文档中被提了出来：https://learn.microsoft.com/en-us/power-apps/developer/compo...
完整原文尊重不同观点，分享具体经验。
登录后即可发帖、评论、转发和引用。