Android Layout — Layout Time Comparison

Since ConstraintLayout introduced by Google, there is a lot of hyped regarding its capability over Relative Layout, Linear Layout, etc. Google promise that ContraintLayout can help you reduce nested layout, and therefore reducing layout time(see here on why it’s bad).

Many of us(that includes me) usually have this kind of mindset, if it’s new technology it must be better, and then we use it right away without analyzing further if it’s what is intended to be. This article would like to presents the comparison of 3 most common layout we use on our daily Android life, ConstraintLayout, RelativeLayout, and LinearLayout and try to find out if ConstraintLayout is the almighty tools.

The method I used to compare the 3 layout is by creating a clean Android project and manually call 2 steps (out of 3 steps) of layout-ing steps, which is measure and layout. ConstraintLayout version used here is 1.1.0 (the latest one as I write this). I have pushed the project to Github, feel free to try for yourself and tinker around.

This is the method I used for timer and layout-ing

private long getLayoutTime(int layoutRes) {
    final Context targetContext = this;
    final LayoutInflater layoutInflater = 
           LayoutInflater.from(targetContext);

    final long startTime = System.currentTimeMillis();
    for (int i = 0; i < 1000; i++) {
        final View view = layoutInflater.inflate(layoutRes, null);
        view.setLayoutParams(new ViewGroup.LayoutParams(0, 0));

        view.measure(
            View.MeasureSpec.makeMeasureSpec(
                 1000, View.MeasureSpec.EXACTLY)
            , View.MeasureSpec.makeMeasureSpec(0, 
                 View.MeasureSpec.UNSPECIFIED));
        final int measuredHeight = view.getMeasuredHeight();
        final int measuredWidth = view.getMeasuredWidth();

        view.layout(0, 0, measuredWidth, measuredHeight);
    }
    return System.currentTimeMillis() - startTime;
}

I am using 2 layout type for this comparisons, one being a really simple one. Since this layout is simple, there is no nested-level differences between the 3 layouts being compared (all of them have flat hierarchy).

Simple Layout

The other one I used is a little bit more complex, and the LinearLayout is nested once, while the RelativeLayout and ConstraintLayout keep their flat hierarchy.

More Complex Layout

I have try to eliminate most of external factor(image used is same, margin, padding, text size, etc) that may affecting the comparisons, but you could leave comments if you find differences that may influence the results.

Based on the results above, it clearly shows that ConstraintLayout took longer layout time than LinearLayout and RelativeLayout. Of course, this experiments only cover simple layout, and lack on those of more advanced layout, like 3 or more nested-level layout (which I presume ConstraintLayout will triumph). But, again, like what I have presented above, though ConstraintLayout is a newer technology and brings a lot of promises on its performance, it is not an absolute tools, rather it is just an options that may or may not fit your requirements. Cheers!