HarmonyOS 鸿蒙Next中如何定位Web组件首次加载网页时,滑动网页发生明显卡顿问题

HarmonyOS 鸿蒙Next中如何定位Web组件首次加载网页时,滑动网页发生明显卡顿问题

【问题现象】

Web组件首次加载网页时,在开始加载网页的时候用手指滑动网页会发生明显的卡顿。

问题代码如下:

Web({
  controller: this.webController,
  src: this.url
  // src: $rawfile('news.html')
}).darkMode(WebDarkMode.Auto)
  .javaScriptProxy(
    {
      object: this.newsNormalController,
      name: "JSBridgeHandle",
      methodList: ["sendNewsDataToPage", "images", "openPath", "toCareDzh", "openHomePage",
        "deleteComment", "popSecondComments", "zanComment", "contextDetail"],
      controller: this.webController
    }
  )
  .onPageBegin(() => {
    this.webController.setCustomUserAgent("Mozilla/5.0 (Phone; Android; OpenHarmony 4.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36 ArkWeb/4.1.6.1 Mobile")
  })

【背景知识】

setCustomUserAgent()接口用于设置自定义用户代理,会覆盖系统的用户代理。

【定位思路】

分析代码发现,在onPageBegin回调中,做了一个设置自定义用户代理的操作,会导致页面重新加载,这样相当于页面加载了两次,此时滑动页面就可能发生“卡顿”现象。

【解决方案】

将设置用户自定义的代码放到onControllerAttached中。

代码示例如下:

.onControllerAttached(()=>{
           this.webController.setCustomUserAgent("Mozilla/5.0 (Phone; Android; OpenHarmony 4.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36 ArkWeb/4.1.6.1 Mobile")
 })

更多关于HarmonyOS 鸿蒙Next中如何定位Web组件首次加载网页时,滑动网页发生明显卡顿问题的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于HarmonyOS 鸿蒙Next中如何定位Web组件首次加载网页时,滑动网页发生明显卡顿问题的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next中,Web组件首次加载网页时滑动卡顿问题

在HarmonyOS鸿蒙Next中,Web组件首次加载网页时滑动卡顿问题是由于在onPageBegin回调中设置自定义用户代理导致页面重新加载。解决方案是将setCustomUserAgent操作移至onControllerAttached回调中,避免页面重复加载。

回到顶部