目录

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

问题现象

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

背景知识

问题定位

  1. 使用DevEco Profiler Frame分析工具抓取点击评论框到软键盘显示过程的Trace信息,在搜索框中搜索应用收到手指离开屏幕事件以及输入框获取焦点的Trace关键字,可以看到输入框获取焦点之后应用请求显示软键盘。

  2. 查看应用收到手指离开屏幕事件的Trace关键字以及输入框获取焦点的Trace关键字间的时间间隔,可知应用在收到手指离开屏幕事件后过了829.5ms,输入框才获取到焦点,输入框获取焦点较慢导致了软键盘弹出慢。

  3. 查看该过程线程的运行状态可以看到线程大部分时间处于休眠态(Sleeping)以及运行态(Running),并没有出现长时间持续处于运行态,因此可知并不是主线程执行耗时任务导致。

  4. 使用ArkUI Inspector工具抓取应用页面布局,发现该应用页面为RN页面,需要分析RNOH_JS线程上的Trace信息。

  5. 查看RNOH_JS线程,发现线程有多次提交组件树到主线程绘制,耗时主要集中在节点树构建。

  6. 通过ArkUI Inspector查看应用页布局发现,应用页面组件较多,布局复杂,文本框组件的层级达到21。页面绘制整体耗时较多导致文本框获取焦点较慢,软键盘显示时延较长。

分析结论

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

修改建议

组件嵌套优化,减少嵌套层级或采用扁平化布局。