草庐IT

Android 朋友圈列表Feed流的最优化方案,让你的RecyclerView从49帧 -> 57帧

大鼓书 2023-03-28 原文

Github链接,给个Star鼓励我写更多好库

ezgif-1-4516d51ebf.gif

事先说明:我在demo中一进入Activity就立刻触发下拉刷新,所以你看到帧率可能掉到了40,是因为系统的startActivity本身就掉帧非常厉害。想真实测出帧率,需要进入Activity后等帧率稳定在60了,再手动下拉刷新

包含功能:

  • 9张图。如果只有一张图,那么单张图的宽高根据图片原始宽高等比例缩放
  • 只有一张图的时候,这个图可能是视频,图中间有播放按钮
  • 内容支持表情。[微笑]要显示为图片?
  • 内容有@人功能,@人有点击事件
  • 每个Item带有评论,XXX回复XXX:你好[微笑]

传统做法的效果:

  • 首次进入Activity后触发下拉刷新,请求成功后setAdpater,这时候帧率会掉到49帧左右。丢失11帧
  • 手指往下滚动,滚动过程中,帧率在57帧 - 60帧徘徊
  • 退出Activity再次进入,由于java底层的代码优化,执行效率会上升。首次setAdpater帧率为53帧左右


    1659104674017.jpg

我优化后的效果:

  • 首次进入Activity后触发下拉刷新,请求成功后setAdpater,这时候帧率会掉到57帧左右。丢失3帧左右
  • 手指往下滚动,滚动过程中,全程60帧


    1659104746498.jpg

我的基础优化方案(别人帖子也会讲的):

  • ✅ 1、每个item中众多元素的点击事件不要每次都new。应该是onCreateViewHolder中imageView.setOnClickListener(this)。然后在onBindViewHolder中imageView.setTag。避免滚动过程中频繁new ClickListener()
  • ✅ 2、SpanText做好缓存,避免每次滚动都解析。总之,检查Adpater中所有new Object()的代码,能不new就不new
  • ✅ 3、手写DrawableCenterTextView,解决系统的Button的DrawableLeft会贴边问题。否则要多一层LinearLayout包裹
  • ✅ 4、需要重复计算的size要设置为全局变量static,避免每次计算。比如每张图片的宽高,表情图片的15sp大小
  • ✅ 5、底部加载更多:使用notifyItemRangeInserted代替notifyDataSetChanged。后者会触发2、3次onCreateViewHolder

我的进阶优化方案(你在别的帖子看不到的):

  • ✅ 1、glide首次加载图片会创建线程池,耗时约50ms,可以移到App打开时的欢迎界面就创建好。节省50ms
  • ✅ 2、首次setAdpater前先不着急结束下拉刷新状态。先开启Thread,在Thread中解析文字的表情和@人解析,组成SpanText并缓存到model中,节省约12ms
  • ✅ 3、采用LruCache缓存最新的32个表情的drawable,这样可以加快常见表情的解析速度
  • ✅ 4、在Thread中按List<Model>.count() 解析item的xml布局,并存放在LinkedList<View> 中(为了节省内存,我最多限制8条)。在onCreateViewHolder中进行 .poll,节省150ms左右
  • ✅ 5、在Thread中按List<Model>.count() 预创建图片和评论的缓存池:LinkedList<ImageView> 和 LinkedList<评论TextView>。在item显示的时候。从缓冲池中取,而不是new。节省100ms左右
  • ✅ 6、在Adpater的 onViewRecycled 中把图片和评论remove后存入缓存池。这一步主要为了滚动流畅
  • ✅ 7、九张图采用GridLayout而不是 UnScrollView或者GridManager。后者会太重量级且会带来更多的内存消耗。这里其实最好自己写一个ViewGroup

本方案用到的基础常识:

  • 1、ListView或RecyclerView如果当前是不可见状态,你去setAdpater不会起到任何效果,代码不会走onCreateViewHolder等回调。当你设置为VISIBLE的时候,才会触发Adapter里的回调。
  • 2、RecyclerView的第3级缓存ViewCacheExtension,用起来还要去反射ViewHolder的Layout.Params,挺不方便的,所以我没用他。
  • 3、RecyclerViewPool 缓存池每种type的最大值默认为5。如果item是固定高度,那么缓存池的size总是在0和1之间徘徊,因为第一个item刚被回收,底部item就进来了。
  • 4、所以RecyclerViewPool 缓存池只有在非常极限情况下才会size == 5 (即:顶部的几个item的height非常小,但是底部的item高度非常大)。
  • 5、onViewRecycled(holder: RecyclerView.ViewHolder) 是Item进入RecyclerViewPool的回调,进入之后,vh的data就等于无用了
  • 6、LinkedList 要比ArrayList在增删的时候更快,尤其是增删第0个和最后一个object。且由于ArrayList底层用的是int[10], 所以存在内存浪费。所以用LinkedList做缓存池优于ArrayList

本方案部分技术细节:

Activity:

      //在子线程中进行预加载
                    preloadCacheViewsInThread(beanList) {
                        //预加载完毕,回到主线程处理UI
                        runOnUiThread {
                            handleRefreshSuccess(beanList)
                        }
                    }

private fun preloadCacheViewsInThread(topicBeanList: MutableList<TopicBean>, success: () -> Unit) {
        Thread {
            var pictureCountInFirstPage = 0 //第一页有多少个图片
            var commentCountInFirstPage = 0 //第一页有多少条小评论
            var nowTime = System.currentTimeMillis()
            for (topicBean in topicBeanList){
                topicBean.findTotalSpanText(this@FriendActivity2, this@FriendActivity2)
                topicBean.pictures?.let { pictureCountInFirstPage += it.count() }
            }
            Log.e(
                "dq",
                "预处理Model耗时为:" + (System.currentTimeMillis() - nowTime) + "毫秒"
            ) //方法运行时间为:12毫秒

            val layoutInflater = LayoutInflater.from(this@FriendActivity2)

            //开始预加载每个Item的xml布局
            nowTime = System.currentTimeMillis()
            var i = 0
            while (i < 8 && i < topicBeanList.count()) {
                //这个8是预估的数字,也就是屏幕中的 + mCacheView(size == 2)+ pool里的(max是5,一般就是1)
                val itemView: View = layoutInflater.inflate(R.layout.listitem_topic, null)
               //缓存起来,放到onCreateHolder中使用
                cachedItemViewList!!.add(itemView)
                i++
            }
            Log.e(
                "dq",
                "预加载耗时为:" + (System.currentTimeMillis() - nowTime) + "毫秒"
            ) //方法运行时间为:150毫秒


            //开始预加载每个Item中的图片的imageview
            i = 0
            while (i < 10 && i < pictureCountInFirstPage) {
                val pictureImageView = ImageView(this@FriendActivity2)
                cachedImageViewList.add(pictureImageView)
                i++
            }
            Log.e(
                "dq",
                "预Image和Text耗时为:" + (System.currentTimeMillis() - nowTime) + "毫秒"
            ) //方法运行时间为:120毫秒

            success()

        }.start()
    }

Adpater:

//创建ViewHolder并绑定上itemview
    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {
            var view: View? = null
            cachedItemViewList?.let {
                view = it.poll()
                Log.e("dq", "onCreateViewHolder = 用上缓存")
            }
            if (view == null){
                view = mInflater.inflate(R.layout.listitem_topic, parent, false)
                Log.e("dq", "onCreateViewHolder = 没用上缓存")
            }
            val viewHolder = TopicViewHolder(view!!)

            if (this::cachedImageViewList.isInitialized) {
                //是用了预加载
                viewHolder.pictureGridLayout.cachedImageViewList = cachedImageViewList
                viewHolder.linearLayoutForListView.cachedTextViewList = cachedTextViewList
            }

            return viewHolder
    }


    override fun onViewRecycled(holder: RecyclerView.ViewHolder) {
        if (holder is TopicViewHolder) {
            for (view in holder.pictureGridLayout.children) {
                if (view is ImageView){
                    //必须要移除,不然会:You must call removeView()
                    cachedImageViewList.add(view);
                    view.setImageDrawable(null)
                    Log.e("dq","缓冲池回收图片 " + cachedImageViewList.size);
                }
            }
            holder.pictureGridLayout.removeAllViews()

            for (view in holder.linearLayoutForListView.children) {
                if (view is QMUILinkTextView){
                    //必须要移除,不然会:The specified child already has a parent. You must call removeView()
                    cachedTextViewList.add(view);
                    Log.e("dq","缓冲池回收评论 " + cachedTextViewList.size);
                }
            }
            //必须要移除,不然会: You must call removeView()
            holder.linearLayoutForListView.removeAllViews()
        }
    }

Author:DQ

我的其他开源库,给个Star鼓励我写更多好库:

Android 朋友圈列表Feed流的最优化方案,让你的RecyclerView从49帧 -> 57帧

Android 仿大众点评、仿小红书 下拉拖拽关闭Activity

Android 仿快手直播间手画礼物,手绘礼物

Android 直播间聊天消息列表RecyclerView。一秒内收到几百条消息依然不卡顿

Android 仿快手直播界面加载中,顶部的滚动条状LoadingView

Android Kotlin MVVM框架,全世界最优化的分页加载接口、最接地气的封装

Android 基于个推+华为push的一整套完善的android IM聊天系统

IOS1:1完美仿微信聊天表情键盘

有关Android 朋友圈列表Feed流的最优化方案,让你的RecyclerView从49帧 -> 57帧的更多相关文章

  1. ruby - RVM 使用列表[0] - 2

    是否有类似“RVMuse1”或“RVMuselist[0]”之类的内容而不是键入整个版本号。在任何时候,我们都会看到一个可能包含5个或更多ruby的列表,我们可以轻松地键入一个数字而不是X.X.X。这也有助于rvmgemset。 最佳答案 这在RVM2.0中是可能的=>https://docs.google.com/document/d/1xW9GeEpLOWPcddDg_hOPvK4oeLxJmU3Q5FiCNT7nTAc/edit?usp=sharing-知道链接的任何人都可以发表评论

  2. 安卓apk修改(Android反编译apk) - 2

    最近因为项目需要,需要将Android手机系统自带的某个系统软件反编译并更改里面某个资源,并重新打包,签名生成新的自定义的apk,下面我来介绍一下我的实现过程。APK修改,分为以下几步:反编译解包,修改,重打包,修改签名等步骤。安卓apk修改准备工作1.系统配置好JavaJDK环境变量2.需要root权限的手机(针对系统自带apk,其他软件免root)3.Auto-Sign签名工具4.apktool工具安卓apk修改开始反编译本文拿Android系统里面的Settings.apk做demo,具体如何将apk获取出来在此就不过多介绍了,直接进入主题:按键win+R输入cmd,打开命令窗口,并将路

  3. Ruby on Rails regexp equals-tilde 与 array include 用于检查选项列表 - 2

    我正在使用Rails3.2.3和Ruby1.9.3p0。我发现我经常需要确定某个字符串是否出现在选项列表中。看来我可以使用Ruby数组.includemethod:或正则表达式equals-tildematchshorthand用竖线分隔选项:就性能而言,一个比另一个好吗?还有更好的方法吗? 最佳答案 总结:Array#include?包含String元素,在接受和拒绝输入时均胜出,对于您的示例只有三个可接受的值。对于要检查的更大的集合,看起来Set#include?和String元素可能会获胜。如何测试我们应该根据经验对此进行测试

  4. Ruby:如何将数组拼接成 Lisp 风格的列表? - 2

    这是我发现自己偶尔想做的事情。假设我有一个参数列表。在Lisp中,我可以像这样`(imaginary-function,@args)为了调用将数组从一个元素转换为正确数量的参数的函数。Ruby中是否有类似的功能?或者我只是在这里使用了一个完全错误的成语? 最佳答案 是的!它被称为splat运算符。a=[1,44]p(*a) 关于Ruby:如何将数组拼接成Lisp风格的列表?,我们在StackOverflow上找到一个类似的问题: https://stackov

  5. ruby-on-rails - Ruby on Rails 将列表拆分或切片为列 - 2

    @locations=Location.all#currentlistingall@locations=Location.slice(5)orLocation.split(5)使用Ruby,我试图将我的列表分成4列,每列限制为5个;然而,切片或拆分似乎都不起作用。知道我可能做错了什么吗?任何帮助是极大的赞赏。 最佳答案 您可能想使用in_groups_of:http://railscasts.com/episodes/28-in-groups-of这是RyanBates在railscast中的示例用法:

  6. Ruby 删除可枚举列表中的重复项 - 2

    ruby中有没有一个很好的方法来删除可枚举列表中的重复项(即拒绝等) 最佳答案 对于数组你可以使用uniq()方法a=["a","a","b","b","c"]a.uniq#=>["a","b","c"]所以如果你只是(1..10).to_a.uniq或%w{antbatcatant}.to_a.uniq因为无论如何,几乎所有您实现的方法都将作为Array类返回。 关于Ruby删除可枚举列表中的重复项,我们在StackOverflow上找到一个类似的问题: h

  7. ruby-on-rails - Scaffold Rails 3 View 中的外键下拉列表 - 2

    我使用脚手架和Rails3创建了2个模型。模型是位置和作业,每个作业都有一个位置。我在脚手架生成代码中创建了所需的引用调用,但是当我查看创建新作业的View时,我看到的只是一个文本框,我应该在其中添加location_id。我怎样才能让它变成下拉菜单以获得更好的用户体验? 最佳答案 想象一下,您有每个位置的titleAPI:http://apidock.com/rails/ActionView/Helpers/FormOptionsHelper/collection_select 关于r

  8. ruby-on-rails - Rails 5 升级 :/actionpack-5. 0.0/lib/action_controller/test_case.rb:49:in `initialize':参数数量错误(0 代表 2)(ArgumentError) - 2

    我最近正在进行Rails5升级,当我尝试启动Rails控制台时遇到了这个错误:/actionpack-5.0.0/lib/action_controller/test_case.rb:49:ininitialize':wrongnumberofarguments(0for2)(ArgumentError)当前bundleupdaterails已经完成了gem依赖项的解决,足以更新到5.0.0,rspec正在运行(尽管我正在修复很多中断)。我也可以运行railss没有错误。这里是代码中断行:https://github.com/rails/rails/blob/master/action

  9. ruby - 如何在 Ruby 中创建数字列表并将其反向附加到它 - 2

    给定一个最小整数和最大整数,我想创建一个数组,它从最小值到最大值以二为单位计数,然后倒退(再次以二为单位,重复最大数)。例如,如果最小数是1,最大数是9,我想要[1,3,5,7,9,9,7,5,3,1].我试图尽可能简洁,这就是我使用单行代码的原因。在Python中,我会这样做:range(1,10,2)+range(9,0,-2)在我刚刚开始学习的Ruby中,到目前为止我所想到的是:(1..9).inject([]){|r,num|num%2==1?r这行得通,但我知道必须有更好的方法。这是什么? 最佳答案 (1..9).step

  10. ruby - Ruby 参数列表中的单个拼音/星号是什么意思? - 2

    这个问题在这里已经有了答案:nakedasteriskasparameterinmethoddefinition:deff(*)(1个回答)关闭9年前。我今天浏览了Rails3ActiveRecord源代码,发现amethodwheretheentireparameterlistwasasingleasterisk.defsave(*)我找不到很好的描述来说明它的作用(尽管我有一些基于我对splat参数的了解的想法)。它有什么作用,为什么要使用它?

随机推荐