search

wechat-miniprogram / recycle-view

recycle-view: a wechat miniprogram custom component
MIT License
635 stars 72 forks source link

关于快速滚动白屏问题 #40

Closed ChenHuiMing44 closed 5 years ago

ChenHuiMing44 commented 5 years ago

发现开始的节流有问题，暂时没找到scroll-view的节流字段，然后亲测发现确实也有问题，现在我改成下面这样子发现快速滚动的时候白屏时间短了很多，不知道这样改行不行 image

cunjinli6 commented 5 years ago

是安卓还是ios上面的表现？

ChenHuiMing44 commented 5 years ago

都有，console了一下组建里面的滚动函数，大量执行，基本没有防抖节流效果，频繁触发setData，顾而白屏时间长，不过测试时候用ios

cunjinli6 commented 5 years ago

之前修改过程中去掉了一个节流的逻辑，已修复。

ChenHuiMing44 commented 5 years ago

Ok，等会我下载下代码看看。 组件已经有用在业务中。感觉有几个痛点: 1、组件往往需要用useInPage，但是页面上可能往往不止一个（用wx:if判断），这样导致的问题就是像牛皮糖一样到处判断初始化很恶心。2、往往期望其像没有组件那样正常撑开使用，嗯，我的意思就是页面往往有很多东西在页面上方，滑倒下面才是一个长列表，然后将这些东西全部放到before里面也不现实（可能需要大量调用重算before高度），但是直接使用的话，会导致计算不准确（因为是按照页面滚动高度来计算），希望能在计算时候去除recycle本身的top，3、rpx计算在某些手机上有偏差（7 plus 6plus等），虽然看过代码计算没问题，但是感觉可以提供rpx方式，避免计算时候误差。4，同第一点，在同一个页面用多个useinpage时候，那个batch在定义不同的batch有bug. 5.快速滑动空白屏有想设置background，发现不好使，感觉上可以优化

ChenHuiMing44 commented 5 years ago

这几点可能这段时间自己也会改，当然大佬先改了更开心，有借鉴

cunjinli6 commented 5 years ago

感谢你的反馈

  1. 同4
  2. 你的意思是，before里面的内容很多，而且会经常变化导致高度变化？
  3. rpx的计算和内置的计算方式一致，详细的case可以抛出来看下。如果没有beforeSlot和afterSlot，倒是可以考虑支持rpx。
  4. 一个页面多个recycle-view，可以这样： 
    <recycle-view batch="{{batchSetRecycleData}}" batch-key="batchSetRecycleData"></recycle-view>
<recycle-view batch="{{batchSetRecycleData1}}" batch-key="batchSetRecycleData1"></recycle-view>
  5. placeholder-image这个属性可以吗？可以设置为svg背景图，个人感觉不用太精确，只需要在快速滑动的时候，让用户感知有内容存在即可。
ChenHuiMing44 commented 5 years ago

5，同三，rpx计算有误差的问题，长页面会误差很大

ChenHuiMing44 commented 5 years ago

嗯仔细描述一下吧，1.关于第一点是因为使用了wx:if多个tab切换（一个页面多个长列表，用这个提升性能肯定的），然后再回来的时候创建的开始创建的component已经被回收，这个时候需要重新创建ctx，但是这种有点像牛皮糖一样用着很不舒服。

  1. 就是在长列表上面还有很多东西，全部放在before 本身页面改动就很大吧，因为一个页面可能还有很多其他的逻辑，然后可能其高度确实会变化，需要触发更新不是舒服，也容易遗漏。
  2. 等会我找下demo（同五），
  3. 因为这个用法和1 一起使用（两个useInpage）导致第二次创建的高度在滑到需要计算的时候有bug，现在用的同一个字段可以解决（但是这样写本身就是bug吧，感觉。。。）
cunjinli6 commented 5 years ago

1 4 用多个recycle-view的写法，应该不需要用wx:if了吧？

ChenHuiMing44 commented 5 years ago

但是这样逻辑清晰也可以节省一点diff开销啊，而且有的时候多个tab页共用一个状态管理（例如loading字段等）也不会有什么问题啊，hidden当时也想过，但是感觉还是 wx：if 好点

cunjinli6 commented 5 years ago

建议先看下不用wx:if是否性能会差到无法接受。 这个感觉需要衡量下，切tab再初始化，虽然可以节省diff开销，但是体验上肯定会慢一点，而且滚动位置等状态貌似也无法保存。

ChenHuiMing44 commented 5 years ago

而且，我需要多个tab全部使用useInPage，不用 wx:if会存在问题得吧（多个scrollView劫持同一个 page的滚动）

cunjinli6 commented 5 years ago

嗯，多次useInPage是会有影响，这个点可以考虑改一下。

ChenHuiMing44 commented 5 years ago

好的，期待尽快得到好消息哦

cunjinli6 commented 5 years ago

目前多个useInPage会重写page的滚动事件，但是旧的pageScroll函数还是会调用的，应该不影响，你可以试下。

nanmu32 commented 2 years ago

发现开始的节流有问题，暂时没找到scroll-view的节流字段，然后亲测发现确实也有问题，现在我改成下面这样子发现快速滚动的时候白屏时间短了很多，不知道这样改行不行 image

大兄弟，能否分享一下你的处理方案。我最近为这个方案头秃了