Layout Optimization in Android

Nowadays when I look around every third person I meet in my vicinity is running live applications on play-store. People these days are so much into making their applications live that they forget the need to understand the variations their target audience can have. They think, come up with an idea, build it and deploy it without understanding the problems that users might face and problems it can create while running on the device.

I started developing applications the same way years back when I was in college. Later when I entered the industry I realized the difference between an application built for personal purpose vs built at an industrial level. I’m not shy to share that I even released applications of around 30mbs in size containing just 4 images. I have learnt a lot from the industry in short period of time and I would like the share the common mistakes a developer commit while creating applications which may not feel like a big problem at current but can cause big performance issues when it grows in size. Sharing is Caring, following the rule I would like to share what I have learnt during the short span as an Android Developer.

#1 Layout Optimization

Layout is the basic part of an application which forms the base for user experience. Creating a layout is not difficult unless its complex and even more difficult when you have a complex list item floating around the screen with thousands of them. Creating is simple thanks for android studio for providing a drag and drop mechanism for creating layout. You will end up creating one looking exactly the same visually but technically you might be doing it all wrong. It is essential for a developer to understanding how a layout with multiple layout inside works. Let’s start with the basic question which every developer faces “Relative Layout vs Linear Layout ? ” but only after understanding how to structure a layout.

#1 “Shallow and Wide” Not “Narrow and Deep”

The layout should should be shallow and wide for example you can understand it from the concept why balanced tree is most efficient as its wide and shallow not deep hence easier and faster traversal. So in terms of android make sure you don’t go for nesting of layouts rather you are going for understanding the need, creating a structure that has minimum nesting and then implementing it. This ensures least memory taken for layouts.

#2 “User Merge and Include Tags in Your Layout”

Reusing layouts is particularly powerful as it allows you create reusable complex layouts. Include layout tag helps in writing reusable layouts so it can be attached to every different layout whenever you need to attach the same so you don’t have to write it again and again. Hence include tag is a very useful feature provided by Android.

Talking about the merge tag , the <merge /> tag helps eliminate redundant view groups in your view hierarchy when including one layout within another. For example, if your main layout is a vertical LinearLayout in which two consecutive views can be re-used in multiple layouts, then the re-usable layout in which you place the two views requires its own root view. However, using another LinearLayout as the root for the re-usable layout would result in a vertical LinearLayout inside a vertical LinearLayout. The nested LinearLayout serves no real purpose other than to slow down your user interface performance.

#3 View Stubs to the Rescue

A ViewStub is an invisible, zero-sized View that can be used to lazily inflate layout resources at runtime. When a ViewStub is made visible, or when inflate() is invoked, the layout resource is inflated. The ViewStub then replaces itself in its parent with the inflated View or Views. Therefore, the ViewStub exists in the view hierarchy until setVisibility(int) or inflate() is invoked. The inflated View is added to the ViewStub's parent with the ViewStub's layout parameters.

#Relative Layout vs Linear Layout

It all depends on the requirement of the design, but understanding how its going to affect your application is must. Diving deep, whenever android draws a layout it creates view hierarchies like a tree structure thus minimum nesting ensures faster traversal. Taking an example taking multiple linear layouts may cause nesting and deep structure which as suggested above is a bad approach hence a relative layout is a better choice but beware that every time you have a relative layout every view inside it is drawn twice by the android. Hence it is highly recommended to use Custom Views in android.

Image showing linear layout hierarchies, taken from android developer page.

Converting to Relative Layout

Same converted to Relative Layout with reduced nesting, image taken from android developer docs.

Thus we can say that if you want to get your app optimized the first step is to optimize your view. I would be talking about optimization in code with respect to network calls and other processes in my nest blog. Please feel free to comment if you have any queries.