Inefficient Xamarin.Forms Layouts

Unnecessary attributes and layouts on a Xamarin.Forms page can slow down the performance of your app – https://docs.microsoft.com/en-us/xamarin/xamarin-forms/deploy-test/performance. This guidance has been around for a long time, but we wanted to know what kind of impact it really can have.

Putting it to the test

We created two similar ListView layouts. The first layout intentionally violates some guidelines, including having unnecessary StackLayout wrappings and redundant LayoutOptions and Grid attribute declarations. The second layout is a more concise representation of the first layout, achieving the same layout but avoiding the unnecessary elements. The layouts are shown in the screenshots below:

Inefficient Layout
Concise Layout

The green underlines in the “Inefficient Layout” version are from XamRight, which is able to detect many kinds of inefficient layout coding patterns in Xaml. The “Concise Layout” is identical except for removing the unnecessary elements. Note that the “Inefficient Layout” shows the kinds of things we frequently see in our work with Xamarin.Forms codebases.

The Results

For the test, the ListViews were populated with 20 items and using Xamarin.Forms 3.6. We ran the test with both Release and Debug configurations on two Android phones: a Vivo Y91C and Samsung Galaxy S5, measuring how long it took to create the page and push it on the Navigation stack. After running the experiment a number of times, the speed-up achieved from simplifying the layout averaged 3.8% for Release, and 7.8% for Debug.

Automating the cleanup with XamRight

Inspired by the Visual Studio “Suggested Fix” feature for C#, we started implementing automation to reduce the drudgery of some of this cleanup:

Cleaning up extraneous Xaml attributes with XamRight

tl;dr

Simplifying Xamarin.Forms layout not only leads to a clearer, easier to understand Xaml file, but also to real performance improvements. XamRight can help in both detecting opportunities, but also in cleaning up the code.

Author

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.