Performance Tuning UI chapter (i)--viewstub

In the project, we are busy with the implementation of the function, the overall performance of the app is poor. Every page load is stuck. The summer vacation is coming soon, and the project team has specially arranged a version to improve the performance. The version hasn't started yet, and I'm here to record some of the performance tuning methods and attempts.

What you learn and try today is viewstub. In the app UI, we often have some view that is "invisible" i.e., I'll set it to visibility in XML to gone. Only in exceptional circumstances will I reveal it. For example, the hover button disappears when I swipe the content, and some of the buttons are only visible to users who have permission to do so. The biggest benefit of setting visibility with view is flexibility. I can dynamically visualize or hide these controls at any time in the program, judging by some conditions, so that the entire interaction is full of agility.

But in addition to the above situation, there is another situation. For example, when the list is empty, I will load a special picture to prompt the user list for no content, or to display each button the first time the user logs in, and then no longer see it. These conditions are summed up in the case that these controls are invisible in most cases. There are only a few cases where it needs to be shown. If I still write it in the XML, just set the visibility = gone, it is very not cost-effective. Because no matter what the visibility is set to, the system has already loaded it out, the loading time has been spent, the memory is occupied, but I have a great possibility will not use it at all. Therefore, we can use Viewstub. Viewstub is a lightweight view and we only have the chance to draw it once. It consumes very little memory when it is not drawn, and has a short load time. When we need it, we draw it, and the overall time spent is not the same as the direct load of view. Therefore, if this view does not show many opportunities, we recommend using Viewstub for display.

The code is as follows:

Activity_main.xml

<LinearLayoutxmlns:android= "Http://schemas.android.com/apk/res/android"Android:layout_width= "Match_parent"Android:layout_height= "Match_parent"android:orientation= "Horizontal"    >    <RelativelayoutAndroid:layout_width= "Match_parent"Android:layout_height= "Match_parent"Android:layout_weight= "1">        <ButtonAndroid:id= "@+id/test_btn2"Android:layout_width= "Wrap_content"Android:layout_height= "Wrap_content"Android:layout_alignparentbottom= "true"android:layout_centerinparent= "true"Android:text= "Test2"Android:onclick= "Testclick2"/>        <viewstubAndroid:id= "@+id/test_view2"Android:layout_width= "Wrap_content"Android:layout_height= "Wrap_content"Android:inflatedid= "@+id/test_image_view"Android:layout_above= "@id/test_btn2"Android:layout= "@layout/test_image_view"            />    </Relativelayout></LinearLayout>

Test_image_view.xml:

<?XML version= "1.0" encoding= "Utf-8"?><LinearLayoutxmlns:android= "Http://schemas.android.com/apk/res/android"android:orientation= "vertical"Android:layout_width= "Wrap_content"Android:layout_height= "Wrap_content">    <ImageViewAndroid:layout_width= "Wrap_content"Android:layout_height= "Wrap_content"android:src= "@drawable/test_img_src"        /></LinearLayout>

Mainactivity.java:

 PackageCom.dream.fishbonelsy.viewstubdemo;Importandroid.support.v7.app.ActionBarActivity;ImportAndroid.os.Bundle;ImportAndroid.util.Log;ImportAndroid.view.LayoutInflater;ImportAndroid.view.Menu;ImportAndroid.view.MenuItem;ImportAndroid.view.View;Importandroid.view.ViewStub;ImportAndroid.widget.ImageView;ImportAndroid.widget.Toast; Public classMainactivityextendsactionbaractivity {Privateviewstub View2; @Overrideprotected voidonCreate (Bundle savedinstancestate) {LongStartTime = System.nanotime ();//Start Time        Super. OnCreate (savedinstancestate); Setcontentview (r.layout.activity_main);View2 =(viewstub) Findviewbyid (R.ID.TEST_VIEW2); LongConsumingtime = System.nanotime ()-startTime;//Consumption TimeLOG.D ("tag", "Layout time:" + consumingtime/1000000+ "milliseconds"); }     Public voidTestclick2 (view view) {LongStartTime = System.nanotime ();//Start Timeview2.inflate (); LongConsumingtime = System.nanotime ()-startTime;//Consumption TimeLOG.D ("tag", "Draw Time:" +consumingtime/1000000+ "milliseconds"); }}

Consumption time

The same content I tested several times and found that the layout time of the viewstub was very short, and then the load was not too slow. For the same content, I used the ImageView setup visibility to try it once.

The code is as follows:

Activity_main.xml:

<LinearLayoutxmlns:android= "Http://schemas.android.com/apk/res/android"Android:layout_width= "Match_parent"Android:layout_height= "Match_parent"android:orientation= "Horizontal"    >    <RelativelayoutAndroid:layout_width= "Match_parent"Android:layout_height= "Match_parent"Android:layout_weight= "1">        <ButtonAndroid:id= "@+id/test_btn1"Android:layout_width= "Wrap_content"Android:layout_height= "Wrap_content"Android:layout_alignparentbottom= "true"android:layout_centerinparent= "true"Android:text= "Test1"Android:onclick= "Testclick1"/>        <ImageViewAndroid:id= "@+id/test_view1"Android:layout_width= "Wrap_content"Android:layout_height= "Wrap_content"android:src= "@drawable/test_img_src"android:visibility= "Gone"Android:layout_above= "@id/test_btn1"            />    </Relativelayout></LinearLayout>

Mainactivity.java:

 PackageCom.dream.fishbonelsy.viewstubdemo;Importandroid.support.v7.app.ActionBarActivity;ImportAndroid.os.Bundle;ImportAndroid.util.Log;ImportAndroid.view.LayoutInflater;ImportAndroid.view.Menu;ImportAndroid.view.MenuItem;ImportAndroid.view.View;Importandroid.view.ViewStub;ImportAndroid.widget.ImageView;ImportAndroid.widget.Toast; Public classMainactivityextendsactionbaractivity {PrivateImageView View1; Privateviewstub View2; @Overrideprotected voidonCreate (Bundle savedinstancestate) {LongStartTime = System.nanotime ();// Start time//        Super. OnCreate (savedinstancestate);        Setcontentview (R.layout.activity_main); View1=(ImageView) Findviewbyid (R.ID.TEST_VIEW1); //view2 = (viewstub) Findviewbyid (R.ID.TEST_VIEW2);        LongConsumingtime = System.nanotime ()-startTime;//Consumption TimeLOG.D ("tag", "Layout time:" + consumingtime/1000000+ "milliseconds"); }     Public voidtestclick1 (view view) {LongStartTime = System.nanotime ();// Start timeview1.setvisibility (view.visible); LongConsumingtime = System.nanotime ()-startTime;//Consumption TimeLOG.D ("tag", "Draw time:" + consumingtime/1000 + "microsecond")); }}

Consumption time

Analyzing the above two time data we can observe the result:

One or two scenarios when you want to display this graph, the time spent is quite. It is better to use view at this time, because view is more flexible, I can hide and show over and over again, can set the Click event, even can redraw and so on.

Second, two scenarios when this picture is not shown, the load time of the viewstub will be greatly reduced, the same, the memory consumption will be much less.

Therefore, it can be briefly summed up as: when I need a flexible control, it needs to change, listen, hide, move, I should choose View. Because, viewstub can only be drawn once, can't listen, can't redraw, can't move, can't hide, so when I need an alternate view that is not often displayed, using Viewstub can save our system resources greatly. (for example, when the contents of the list are empty, a graph is displayed; When the network is not good, a graph is displayed; When the user logs in for the first time, a graph is displayed). We need to estimate the frequency of this view to determine the final solution.

Done temporarily.

Discovering performance optimizations really requires a lot of experience and then a little bit of deduction out of performance. There is no more.

Performance Tuning UI chapter (i)--viewstub