Vux: Scroller android微信端卡顿问题

创建于 2016-05-31 · 40评论 · 资料来源: airyland/vux

Version

0.0.117

Android or iOS, which browser?

android ios 微信浏览器

Your Codes

<scroller lock-x scrollbar-y
                            use-pulldown
                            :use-transition="useTransition"
                            :pulldown-status.sync="pulldownStatus"
                            <strong i="10">@pulldown</strong>:loading="load"
                            class="scroller-div"
                            :pulldown-config=pulldownConfig
                            enable-horizontal-swiping
                            :height="scrollHeight +'px'">

                                <div class="scroller-container" >
                                         <div class="swiper-container">...</div>
                                         <div class="content">页面块内容 默认加载数据有两屏左右</div>
                                </div>
                              <div slot="pulldown" class="xs-plugin-pulldown-container xs-plugin-pulldown-down" style="position: absolute; width: 100%; height: 60px; line-height: 60px; top: -60px; text-align: center;">
                                    <span v-show="pulldownStatus === 'default'"></span>
                                    <span class="pulldown-arrow" v-show="pulldownStatus === 'down' || pulldownStatus === 'up'" :class="{'rotate': pulldownStatus === 'up'}">↓</span>
                                    <span v-show="pulldownStatus === 'loading'"><spinner type="ios-small"></spinner></span>
                              </div>
</scroller>

在不同终端机器的微信测试

ios
iphone6 6s 微信里打开滚动效果很顺畅

android
华为荣耀 6 华为荣耀 6+ 锤子坚果在微信里打开出现卡顿情况，一卡一卡的体验不好

android但用UC浏览器打开，卡顿效果不太强烈，可以正常滚动，但还是有点卡

尝试看了一下xscroll的代码，是通过simulate-scroll处理的滚动效果的，但不确定里面的transform是否有webkit浏览器处理，个人猜测是不是要加上webkitTransform translate的处理就ok了？

Android Performance componenscroller inactive issue will be closed to be investigated

资料来源

may00235

最有用的评论

airyland 于 2016-07-13

😄4 😕1 🎉1

所有40条评论

上面的Android是否是低端配置？

airyland 于 2016-05-31

中端机，华为现在占的市场份额很高。
也用华为的P9高端机测试过，微信webkit与浏览器打开都没问题，很顺畅。

与android的系统版本有关系吗？中端机系统是4.4的，高端机是6.0的

may00235 于 2016-06-01

我的华为的，Android5 微信打开demo卡顿。。。
就是从demo也点进去具体的组建演示的过程卡

lagolas 于 2016-06-05

@lagolas 首次进入卡，还是每次进入都卡？

airyland 于 2016-06-05

@may00235 没有足够的测试机不能做出结论，我用两三年前的小米2都不会有一卡一卡的状态，不过系统是5.0.2的。

airyland 于 2016-06-05

@airyland 我再多测试下

lagolas 于 2016-06-05

@airyland 每次都卡，例如我从demo页点第一个“address”,要大概3秒才能出现这个组件的页面，然后点“返回”，要大概2秒钟才能返回到demo页，我测试很多个其他组件，也是同样的，只不过有的稍微快一点，但是也是明显的感觉卡，都是要等待至少2秒才出现页面

lagolas 于 2016-06-05

我使用opera浏览器打开，比在微信里还要明显

lagolas 于 2016-06-05

手机是华为畅享5，Android5.0 新手机，配置还不算太烂

lagolas 于 2016-06-05

@lagolas 进入scroller的demo, 左右上下滚动卡吗？

airyland 于 2016-06-05

@airyland 不卡，非常流畅！！！

lagolas 于 2016-06-05

我还没仔细研究你的代码，不知道是不是东西加载的太多导致的。
谢谢，准备在项目改版中使用vux

lagolas 于 2016-06-05

@lagolas 里面每个例子都不卡对吧？难道是因为打包后的app.js过大，webview执行大文件会有卡顿？

airyland 于 2016-06-05

@airyland 我又仔细测试了几遍，里面的例子都很流畅，只有日历选择的那个不太好，点击之后要延迟一些才会有效果。其他的都很流畅。

lagolas 于 2016-06-05

@lagolas Calendar 这个延迟问题应该可以解决。

airyland 于 2016-06-05

@airyland 捐助1元以表支持，表嫌少，谢谢

lagolas 于 2016-06-05

@lagolas 哈哈，1分也是爱啊 😸

airyland 于 2016-06-05

@airyland 后续使用的时候遇到问题在向你请教，谢谢你的奉献。

lagolas 于 2016-06-05

@lagolas 欢迎反馈，欢迎PR.

airyland 于 2016-06-05

有没有想过换成更流畅的 scroll 库？比如这个：https://github.com/pbakaus/scroller

bammoo 于 2016-06-29

@bammoo 这是个大坑，你有足够多的测试机证明它更流畅咩？

airyland 于 2016-06-29

https://vuxjs.gitbooks.io/vux/content/ 这里好像都没有更新有组件card的文档，感谢无私奉献

daviswei 于 2016-07-06

@daviswei 稍后会写出来

lichunqiang 于 2016-07-06

安卓的微信上面只要用了scroller 就卡顿，没有用scoller的反而比较流畅,IOS上面都可以

hubinjie 于 2016-07-13

@hubinjie 不是所有场景都要用scroller的吧，能不用scroller就不用scroller。

airyland 于 2016-07-13

hubinjie 于 2016-07-13

airyland 于 2016-07-13

hubinjie 于 2016-07-13

airyland 于 2016-07-13

hubinjie 于 2016-07-13

airyland 于 2016-07-13

😄4 😕1 🎉1

hubinjie 于 2016-07-14

xiaolongyuan 于 2016-07-14

hubinjie 于 2016-07-14

airyland 于 2016-07-14

hubinjie 于 2016-07-14

docikaci 于 2016-09-11

此页面是否有帮助？

0 / 5 - 0 等级

Vux: Scroller android微信端卡顿问题

Version

Android or iOS, which browser?

Your Codes

在不同终端机器的微信测试

最有用的评论

所有40条评论

相关问题