资助申请：swap.cow.fi 性能优化 - 打包优化
摘要
AI 生成本资助申请旨在优化 swap.cow.fi 的打包性能，通过异步导入、依赖更新和去重等技术，将初始 JS 加载大小从 7.8 MB 减少至 4.41 MB，提升加载速度超过 1.5 倍。申请者已提供概念验证和 PageSpeed 报告，计划在约一周内完成优化，并请求 800 xDAI + 1000 COW 的资金支持。
注：摘要由 AI 自动生成，可能与正文存在差异，仅供参考。
提案内容
AI 翻译资助标题
资助申请：swap.cow.fi 性能优化 - 打包优化
作者
高级 Web 开发者 - Konstantin Barabanov: 点击查看
主要联系人 - 点击查看
经验与资质
- 请参见此处：点击查看
资助描述
目前，swap 应用的构建命令生成的 next js 包大小为：
- 总大小：19.02 mB (4.52 mB brotli)
- 初始 JS 加载大小：7.8 mB (2.16 mB brotli)
我的测试表明，我们可以将这些大小减少到：
- 总大小：16.63 mB (4.12 mB brotli)
- 初始 JS 加载大小：4.41 mB (1.32 mB brotli)
因此，初始加载速度提升超过 1.5 倍。
这可以通过一些打包优化技术实现：无需对代码库进行重大更改，也无需大量工作。
以下是应用的优化列表：
- 更新
@1inch/permit-signed-approvals-utils版本并通过async导入使用- 该库已归档，因此我们可以复制一些实现以摆脱最常用的部分
- 此更新导致
@cowprotocol/permit-utils发生破坏性变更（getPermitUtilsInstance现在是异步的），因此我们必须发布新的主版本
- 更新
@safe-global版本并通过async导入使用@safe-global/api-kit@safe-global的新版本不再需要protocol-kit和safe-ethers-lib- 不再需要
web3 - 更新稍微改变了返回类型，因此必须修复
- 去重
bn.js - 更新
@walletconnect - 通过
async导入使用framer-motion - 通过
async导入使用lottie-react - 通过
async导入使用lottie/progressbar-step-*.json - 更好地使用 vite 的
manualChunks
此外：许多依赖项的新版本支持 esm，因此我们通过 tree shaking 节省了大量空间。
预期影响：
- 更快的首次绘制和感知性能（> 1.5 倍）。请参见第一条评论中的 PageSpeed 指标对比。
我希望通过此功能提供的其他更改/功能：
- 更好的块/入口点/资源命名
- 使用 点击查看 来比较未来的包大小差异
资助类型
基于里程碑
里程碑
| 里程碑 | 标题 | 持续时间 | 资金请求 |
|---|---|---|---|
| 里程碑 0 | 概念验证（PoC），准备 PageSpeed Insights 报告 | 已完成 | 400 xDAI + 500 COW |
| 里程碑 1 | 为整洁的 PR 准备更改 | 1天 | 0 |
| 里程碑 3 | 更好的命名，bundle-stats 的使用 | 0.5天 | 0 |
| 里程碑 4 | 测试 | 1天 | 0 |
| 里程碑 5 | 更新贡献文档，设置 eslint 规则 | 0.5天 | 0 |
| 里程碑 6 | 提供 PR | 0天 | 400 xDAI + 500 COW |
| 里程碑 7 | 修复发现的相关问题 | 未知 | 0 |
时长
我准备在资助批准后立即开始。我不会全职工作，但相信可以在批准后约 1 周内完成。
资金请求
整个功能请求 800 xDAI + 1000 COW。
Gnosis Chain 地址
0xd26ecc4457eb51cde9a5d44d316b3e83d60f2efb
其他信息
我已经完成了一个原型，并将在第一条评论中提供 PageSpeed Insights 报告。
如您所见，首次内容绘制、速度指数、最大内容绘制等指标在应用这些优化后有所降低。
未来（超出当前范围）的步骤可能包括：
- 摆脱
web3-react依赖 - 通过 react 的
lazy加载除swap之外的每个页面 - 将
@ethersproject迁移到viem - 通过
async导入使用@uniswap - 通过
async导入使用一些common和modules模块（它们真的很大！） - 在 cow sdk 库中：通过
async导入使用@safe-global - 在 cow sdk 库中：通过
async导入使用@defuse-protocol/one-click-sdk-typescript
条款与条件
通过提交此资助申请，我承认并同意受 CoW DAO 参与协议 和 CoW DAO 资助协议条款 的约束。