# 点击评论框进入评论页面时，软键盘弹出慢

## 问题现象

点击评论框进入评论页面时，软键盘弹出慢，延迟一段时间后才显示。

## 背景知识

* ArkUI Inspector：DevEco Studio提供的[布局分析](https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/ide-arkui-inspector)工具，开发者可以借助它预览真机或模拟器中的UI效果，快速定位布局层级问题，也可以观察组件属性、不同组件之间的关系等。
* DevEco Profiler：集成在DevEco Studio中的性能调优工具，提供场景化的性能调优功能体验，可以检测应用的性能指标、录制Trace信息，通过分析Trace数据能够发现代码中的性能瓶颈，进而优化性能。更多详细内容可看[使用Profiler进行性能调优](https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/ide-profiler-introduction)。
* 在RN框架中，RNOH_JS线程负责构造节点树并提交到应用主线程完成渲染。
* Trace关键字说明：

  |关键字|说明|
  |:-------------------------------------------------------|:-------------------|
  |H:DispatchTouchEvent id:X, pointX=XXX, pointY=XXX type=1|应用收到手指离开屏幕事件|
  |H:[TextField:组件ID] on focus|输入框获取焦点|
  |H:RequestKeyboard|请求显示软键盘|
  |H:ShadowTree::commit|RNOH_JS线程提交节点树到应用主线程|

## 问题定位

1. 使用DevEco Profiler Frame分析工具抓取点击评论框到软键盘显示过程的Trace信息，在搜索框中搜索应用收到手指离开屏幕事件以及输入框获取焦点的Trace关键字，可以看到输入框获取焦点之后应用请求显示软键盘。 ![](https://contentcenter-vali-drcn.dbankcdn.cn/pvt_2/DeveloperAlliance_scene_100_1/57/v3/YU5l1ndIRN-QPONNM1TC1A/zh-cn_image_0000002628395146.png?HW-CC-KV=V1&HW-CC-Date=20260920T112701Z&HW-CC-Expire=31536000000&HW-CC-Sign=6A2036120D85FB70E194ED6BD60EC23AF3405C588A7947F5BF81C325D1D29BD3 "点击放大")![](https://contentcenter-vali-drcn.dbankcdn.cn/pvt_2/DeveloperAlliance_scene_100_1/df/v3/MFcp5Kz5SCWMhGDDf1oEOQ/zh-cn_image_0000002658914371.png?HW-CC-KV=V1&HW-CC-Date=20260920T112701Z&HW-CC-Expire=31536000000&HW-CC-Sign=29C3CFF457936D24A12E98A32A13921F52F6F6DB7E2C9C2A3FCE81E74AFA0D9F "点击放大")

2. 查看应用收到手指离开屏幕事件的Trace关键字以及输入框获取焦点的Trace关键字间的时间间隔，可知应用在收到手指离开屏幕事件后过了829.5ms，输入框才获取到焦点，输入框获取焦点较慢导致了软键盘弹出慢。 ![](https://contentcenter-vali-drcn.dbankcdn.cn/pvt_2/DeveloperAlliance_scene_100_1/c2/v3/xXndSFFjT7-MILHLRwBqzQ/zh-cn_image_0000002658794415.png?HW-CC-KV=V1&HW-CC-Date=20260920T112701Z&HW-CC-Expire=31536000000&HW-CC-Sign=DC2635DDE6B281AEDCEC3CF1CB3FBAA4D99320EBFF458311F852C89EF7D24645 "点击放大")

3. 查看该过程线程的运行状态可以看到线程大部分时间处于休眠态（Sleeping）以及运行态（Running），并没有出现长时间持续处于运行态，因此可知并不是主线程执行耗时任务导致。 ![](https://contentcenter-vali-drcn.dbankcdn.cn/pvt_2/DeveloperAlliance_scene_100_1/b4/v3/ObyX30_JRd6zUdIRvoAEBQ/zh-cn_image_0000002628555052.png?HW-CC-KV=V1&HW-CC-Date=20260920T112701Z&HW-CC-Expire=31536000000&HW-CC-Sign=1B7B44006D152391CCC0C8F7340AECD941C54D1739E607F4E355C5C83822FF26 "点击放大")

4. 使用ArkUI Inspector工具抓取应用页面布局，发现该应用页面为RN页面，需要分析RNOH_JS线程上的Trace信息。 ![](https://contentcenter-vali-drcn.dbankcdn.cn/pvt_2/DeveloperAlliance_scene_100_1/4b/v3/ljoqEUKXT6-3QVmKdcP8uQ/zh-cn_image_0000002628395148.png?HW-CC-KV=V1&HW-CC-Date=20260920T112701Z&HW-CC-Expire=31536000000&HW-CC-Sign=05718DC064345C57B729B37AED314E6BE997AC4D8AEC8ABA8065A9C9D4FC7E12 "点击放大")

5. 查看RNOH_JS线程，发现线程有多次提交组件树到主线程绘制，耗时主要集中在节点树构建。 ![](https://contentcenter-vali-drcn.dbankcdn.cn/pvt_2/DeveloperAlliance_scene_100_1/79/v3/O8fXAywdTriHNeCBlacy6Q/zh-cn_image_0000002658914373.png?HW-CC-KV=V1&HW-CC-Date=20260920T112701Z&HW-CC-Expire=31536000000&HW-CC-Sign=0B88FD64BEB2BD984C44CD07517CCCA076E8A6C89C8A1B3F0DFC3373796629D6 "点击放大")

6. 通过ArkUI Inspector查看应用页布局发现，应用页面组件较多，布局复杂，文本框组件的层级达到21。页面绘制整体耗时较多导致文本框获取焦点较慢，软键盘显示时延较长。 ![](https://contentcenter-vali-drcn.dbankcdn.cn/pvt_2/DeveloperAlliance_scene_100_1/30/v3/55qsK7WxTEmn46npmqVWag/zh-cn_image_0000002658794417.png?HW-CC-KV=V1&HW-CC-Date=20260920T112701Z&HW-CC-Expire=31536000000&HW-CC-Sign=8D293CC635B192F0786F3CE8004B15D7D40E98C18E91AAF48882FCCDC18F693A "点击放大")

## 分析结论

应用页面布局复杂，绘制耗时较多，文本框绘制、获取焦点慢，导致点击评论框时，软键盘弹出慢。

## 修改建议

[组件嵌套优化](https://developer.huawei.com/consumer/cn/doc/best-practices/bpta-component-nesting-optimization)，减少嵌套层级或采用扁平化布局。