As we all know, the list of wechat circle of friends has been used as a model by many friends who study performance problems. For its implementation, it has been a little hard to keep up with the feeling. Can only silently sigh wechat developers are really niubi. After a period of research, NOW I will lead you to analyze the structure of wechat circle of friends with new cognition and realize it in your own way. First above:

GIF looks like a dot card, you can download APK to experience by yourself, the smoothness is almost the same as wechat: app-debug.apk

Source address: HighPerformanceFriendsCircle

As we all know, to avoid stalling lists on Android, you can optimize them from the following angles.

1. Reduce the layout level and avoid too many useless layout nesting of Item Views. 2. For the list with pictures, you should control the pictures when sliding, that is, do not load the pictures when sliding, and then load the pictures after stopping sliding. 3. You should avoid doing too much computation or nesting too many logical decisions when filling the Adapter. Complex calculations should be completed before the Adapter populates the data.

These are the basic optimization for a common Adapter, and for the complex list of wechat moments, in addition to the above, it is also necessary to optimize other aspects. Examples include reducing duplicate views, building cached views, and reducing the number of onMeasures and OnLayouts for a layout. These are all very important. Below we first briefly analyze the view structure of each item of the list of some wechat, through the analysis of wechat, we can get insight into some of our own solutions.

First, we analyze the view structure of each Item in wechat moments by Android Device Monitor view analyzer.

AddViewInLayout () is protected, so external subclasses of the ViewGroup can’t be called directly. Instead, use addViewInLayout(), You must inherit ViewGroup or a subclass of ViewGroup and override the method. So what does the addViewInLayout() method do? How is it different from addView(), which we usually use?

AddViewInLayout ()

Add a view to your layout. This is useful if you need to add more views (such as list views) in the onLayout() method. If the index is negative, that means it is placed at the end of the list.

This doesn’t seem to be anything special, but where it’s really useful is in the preventRequestLayout parameter in this method, which is a Boolean value, but it’s extremely useful. If true, it will not trigger layout requests for child objects when adding a View. That is, adding a View will not trigger onMeasure and onLayout operations. Official API illustration:

AddViewInLayout () can be used to dynamically add views without triggering onMeasure() and onLayout(), which will save adapter refresh time. As mentioned above, it is particularly important to reduce the onMeasure and onLayout of Adapter items (because it takes a lot of time to display onMeasure and onLayout of View) among the performance points of Adapter.

Similarly, when removing a View, we can use removeViewInLayout(), which has the same effect as addViewInLayout(). Therefore, in this way, we solve the performance problem of dynamically changing the comment list update.

And the nine grid image display only need to customize the ViewGroup can be achieved, its internal is still the ImageView to add and remove, We can also use addViewInLayout() and removeViewInLayout() to reduce onMeasure() and onLayout() times to save on performance.

Other aspects of optimization are to perform various data transformations in data beans, including complex calculations such as converting strings into the desired SpannableStringBuilder.

Finally, in addition to reducing onMeasure() and onLayout(), we also need to reduce View creation. To reduce View creation we can use a weak reference cache array and implement a cache of View objects, thanks to razerDP.

Specific some other logic, in the code to study, may continue to update the project, including the matching of facial expression, phone number matching, etc., depending on their own time. Welcome everyone start!

Special note:

AddViewInLayout () and addView() are used to add one or more views to the adapter. AddViewInLayout () does not reduce the number of onMeasure() and onLayout() used when building comment data in adapter.