React+Capacitor v6 Android WebView性能问题：用户交互时空闲时间过长

App概述 #

向用户展示单词，点击“解答”按钮时，App会执行以下操作：

• 从API获取单词的翻译
• 根据用户交互更新多项用户统计数据

性能分析 #

通过连接AVD模拟器，使用Chrome DevTools对单次用户交互进行性能分析，截图显示交互过程中存在大量空闲时间，导致App响应明显延迟。同时，Android Studio Profiler数据显示：

• CPU最高占用22%
• 内存最高占用95MB

已尝试的优化措施 #

• 将尽可能多的处理任务转移至API
• 确保Android App已启用硬件加速
• 通过进一步代码拆分优化性能

补充说明 #

• 使用fetch API发起请求，TanStack-Query进行异步状态管理
• 请求采用HTTP/2，复用连接而非每次请求新建连接
• 请求前有4次预检调用，耗时仅15-25ms
• 此场景未使用任何动画
• 在设备的Chrome浏览器（或其他浏览器App）中打开App时性能极佳

问题 #

1. Android端出现大量空闲时间的原因是什么？如何进一步诊断？
2. 可采取哪些额外步骤针对Android设备优化App性能？

注：目前App尚未发布，处于内部测试阶段，无法提供链接，若需更多信息可随时询问。

内容的提问来源于stack exchange，提问作者Sebi.E