{"id":32059,"date":"2017-06-14T13:26:26","date_gmt":"2017-06-14T20:26:26","guid":{"rendered":"https:\/\/blog.xamarin.com\/?p=32059"},"modified":"2019-04-04T08:29:36","modified_gmt":"2019-04-04T15:29:36","slug":"5-ways-boost-xamarin-forms-app-startup-time","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/xamarin\/5-ways-boost-xamarin-forms-app-startup-time\/","title":{"rendered":"5 Ways to Boost Xamarin.Forms App Startup Time"},"content":{"rendered":"<p>\t\t\t\tThe Xamarin SDKs for iOS and Android provide an extremely performant foundation upon which to build Xamarin.Forms cross-platform applications. As you work to tune the speed and responsiveness of your Xamarin.Forms application, keep in mind that the same principles that improve the experience of your apps built with the Xamarin SDKs for iOS and Android will also improve those going cross-platform with Xamarin.Forms&mdash;and that experience begins at startup. <\/p>\n<h2>When you say Startup\u2026<\/h2>\n<p>First, let&#8217;s define <strong>startup<\/strong> as everything that happens from the time the user hits your app icon to when the first usable screen appears ready for business. When you compare a blank Xamarin.Android app with a blank Xamarin.Forms app, you\u2019ll notice the Xamarin.Android app loads quicker. What\u2019s going on?<\/p>\n<p>Xamarin.Forms provides not only the ability to share UI across targets, but common application features such as <a href=\"https:\/\/developer.xamarin.com\/guides\/xamarin-forms\/platform-features\/deep-linking\/\">AppLinks for deep linking<\/a>, <a href=\"https:\/\/developer.xamarin.com\/guides\/xamarin-forms\/application-fundamentals\/navigation\/\">Navigation<\/a>, <a href=\"https:\/\/developer.xamarin.com\/guides\/xamarin-forms\/application-fundamentals\/messaging-center\/\">MessagingCenter<\/a>, and <a href=\"https:\/\/developer.xamarin.com\/guides\/xamarin-forms\/application-fundamentals\/dependency-service\/\">DependencyService<\/a>, as well as several pieces needed for cross-platform UI alerts, action sheets, toolbars, status bars, etc. When you start adding comparable implementations to a Xamarin.Android app, you start to see the difference in performance disappearing. This begins to explain what\u2019s going on, so what&#8217;s in your control to impact startup? Here are my top five tips to tune your startup experience across iOS, Android, and UWP targets.<\/p>\n<h3>1. Load Local Content First<\/h3>\n<p>We often want to load fresh data as soon as our application has launched, but this will only slow down the first screen from appearing and populating. Use state from a previous run or have content ready to go that is for the first run.<\/p>\n<p>If you application is already offline ready, and we recommend it is, then you&#8217;re all set to populate the content for your first screen instantly. <a href=\"https:\/\/docs.microsoft.com\/en-us\/azure\/app-service-mobile\/app-service-mobile-dotnet-how-to-use-client-library\">Azure Mobile Apps<\/a> and <a href=\"https:\/\/channel9.msdn.com\/Shows\/XamarinShow\/Episode-21-Deploying-Realm-Object-Server-to-an-Azure-Linux-VM\">Realm with Azure<\/a> are great options.<\/p>\n<p>When you <em>must<\/em> go to the web for your first run content, provide some UI telling the user what you\u2019re doing by using a loading indicator. This is also a perfect opportunity to replace the blank part of your screen with useful placeholder content to reinforce why this screen exists, what the user can expect from the app or just something fun! Whatever your choice here, just <strong>don\u2019t leave a screen empty<\/strong>.<\/p>\n<blockquote style=\"text-align: left;font-size: 16px;padding: 10px 20px;border-left: 3px solid #4FCAE6\">\n<p style=\"font-size: 16px\"><strong>Payload Tips<\/strong> Minimize your web payload to just what you need. Don\u2019t spend time on expensive processes like parsing strings, rather deliver your data as it needs to be represented.<\/p>\n<\/blockquote>\n<h3>2. Optimize Your Assets<\/h3>\n<p>Images and video are heavy and can drastically slow down the initial rendering of a screen. Reduce reliance on heavy assets and optimize any media you use for the necessary dimensions. Don\u2019t rely on the OS to resize the assets for you.<\/p>\n<p>For <a href=\"https:\/\/developer.android.com\/guide\/practices\/screens_support.html\">Android target screens<\/a>, assets are placed in folders representing their density.<\/p>\n<ul>\n<li>ldpi (low) ~120dpi<\/li>\n<li>mdpi (medium) ~160dpi<\/li>\n<li>hdpi (high) ~240dpi<\/li>\n<li>xhdpi (extra-high) ~320dpi<\/li>\n<li>xxhdpi (extra-extra-high) ~480dpi<\/li>\n<li>xxxhdpi (extra-extra-extra-high) ~640dpi<\/li>\n<\/ul>\n<blockquote style=\"text-align: left;font-size: 16px;padding: 10px 20px;border-left: 3px solid #4FCAE6\">\n<p style=\"font-size: 16px\">There\u2019s also a special density of <code>nodpi<\/code> that tells Android to not scale the resources regardless of screen density.<\/p>\n<\/blockquote>\n<p>When you put a large image in the <code>ldpi<\/code> folder and use that asset on a screen of <code>xxhdpi<\/code>, Android will scale it up. This is slow and will bloat your runtime memory consumption, sometimes even to the point of crashing your application; I\u2019ve done it.<\/p>\n<p>To manage that many densities\u00a0and that many assets, it\u2019s highly beneficial to use an application such as <a href=\"https:\/\/sketchapp.com\/\">Sketch<\/a> and\/or <a href=\"https:\/\/zeplin.io\/\">Zeplin<\/a> to generate multiple sizes from a single design source.<\/p>\n<p><a href=\"https:\/\/developer.xamarin.com\/releases\/android\/xamarin.android_7\/xamarin.android_7.0\/\" target=\"_blank\" rel=\"noopener noreferrer\">Xamarin.Android 7.0<\/a> recently added an experimental option to pre-crunch PNG files called <a href=\"https:\/\/developer.xamarin.com\/guides\/android\/under_the_hood\/build_process\/#Resource_Properties\">AndroidExplicitCrunch<\/a>. This further reduces the size of your assets (and application), speeds up build time, and ensures they are optimized for runtime. To enable this, edit the text of your Android <code>csproj<\/code> and amend the <code>PropertyGroup<\/code> for your build configuration:<\/p>\n<pre class=\"lang:xhtml decode:true\">&lt;PropertyGroup&gt;\n    ...\n    &lt;AndroidExplicitCrunch&gt;true&lt;\/AndroidExplicitCrunch&gt;\n&lt;\/PropertyGroup&gt;<\/pre>\n<h3>3. Lazy Load Anything You Don\u2019t Need Immediately<\/h3>\n<p>The App.xaml <code>Resources<\/code> is a convenient place to put styles, fonts, and other resources that you&#8217;ll use throughout your application, but it&#8217;s also all loaded at startup. If you\u2019re trying to erase every unnecessary millisecond from your startup time, remove anything here that you don\u2019t need and lazy load it by page or in another method.<\/p>\n<h3>4. Enable XAML Compilation<\/h3>\n<p>XAML is a popular and expressively powerful way to declare your user interface. If you opt to stay in C# and build your UI there, it\u2019s naturally compiled along with the rest of your code, giving you compile-time checking and speed. When you want that same benefit while using XAML, you enable <a href=\"https:\/\/developer.xamarin.com\/guides\/xamarin-forms\/xaml\/xamlc\/\">XAML Compilation<\/a> (XAMLC). This will compile your XAML into Intermediate Language (IL) and add it to your compiled assembly, resulting in faster startup and runtime performance. Let\u2019s look at how you can enable this:<\/p>\n<p>At the application level, you may declare your XAMLC options and it will impact your entire app.<\/p>\n<pre class=\"lang:c# decode:true \">using Xamarin.Forms.Xaml;\n...\n[assembly: XamlCompilation (XamlCompilationOptions.Compile)]\nnamespace PhotoApp\n{\n    ...\n}<\/pre>\n<p>When you want to set XAMLC options at the class level, you can!<\/p>\n<pre class=\"lang:c# decode:true \">using Xamarin.Forms.Xaml;\n...\n[XamlCompilation (XamlCompilationOptions.Compile)]\npublic class HomePage : ContentPage\n{\n    ...\n}<\/pre>\n<p>When XAMLC is enabled you\u2019ll get compile time XAML checking on most all properties and UI will render faster. File size may remain unchanged or grow slightly as you are trading <code>.xaml<\/code> file size for IL in the assembly.<\/p>\n<h3>5. Reduce Number of Assemblies<\/h3>\n<p>Convenience comes at a cost, as usual. It might be a very small cost, but you want to leave no stone unturned when tuning for performance. While NuGet packages are awesome for leveraging other libraries, the reality is that the more (and larger) assemblies your mobile application depends on naturally slows down the execution as calls pass across boundaries. Xamarin.Forms, for example, inspects all assemblies for `[ExportRenderer]` attributes and currently has no method to opt-in or opt-out. This is something we&#8217;re working to improve.<\/p>\n<p>Weigh the pros\/cons of each dependency and, when possible, bring that code into your main application. Your mileage may vary, so give it a look. This is an often overlooked performance consideration that may pay dividends for you.<\/p>\n<h3>Bonus 1: Ahead of Time Compilation (AOT)<\/h3>\n<p>I\u2019m calling this bonus because we still classify AOT as experimental on Android and it won\u2019t apply to everyone. Of course, iOS uses AOT and the LLVM compiler by default, so there\u2019s nothing to do there.<\/p>\n<p>Enable the experimental <a href=\"https:\/\/developer.xamarin.com\/guides\/android\/deployment,_testing,_and_metrics\/publishing_an_application\/part_1_-_preparing_an_application_for_release\/#AOT_Compilation\">Android AOT<\/a> and get immediate improvement in startup as well as overall speed by reducing some Just-In-Time compilation overhead. The price paid is an increase in the size of your APK, so you should try this out and weigh the pros and cons for your application. To enable AOT, open your project configuration and check the box.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-32060\" src=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/44\/2019\/03\/Android_Build_Settings_General_Callout.png\" alt=\"\" width=\"800\" \/>\n<em>Note: AOT is available on Xamarin Android 5.1 and 7.0+<\/em><\/p>\n<h3>Bonus 2: Build Time Improvements<\/h3>\n<p>While not directly applicable to startup improvement, one of our awesome mobile solutions architects <a href=\"https:\/\/twitter.com\/TheCodeTraveler\">Brandon Minnick<\/a> has shared his collection of build optimization configurations. Check it out on <a href=\"https:\/\/github.com\/brminnick\/ImproveXamarinBuildTimes\">GitHub<\/a>.<\/p>\n<h2>What\u2019s Next<\/h2>\n<p>These are just a few of my favorite tips, and they can apply to all screens of your application, not just the startup screen. I could go on about flattening layout, optimizing measuring in layout cycles, and more. Much of that and more is covered in our <a href=\"https:\/\/developer.xamarin.com\/guides\/xamarin-forms\/deployment-testing\/performance\/\">Xamarin.Forms Performance guide<\/a>.<\/p>\n<p>The community and Xamarin.Forms engineering team have been <a href=\"https:\/\/forums.xamarin.com\/93178\/lets-talk-performance\/p1\">trading tips and discussing<\/a> pain points and possible solutions on the Xamarin Forums. Please join that conversation to share your findings, and follow along as we continue to explore improving startup and runtime performance across all platforms in Xamarin.Forms.\t\t<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The Xamarin SDKs for iOS and Android provide an extremely performant foundation upon which to build Xamarin.Forms cross-platform applications. As you work to tune the speed and responsiveness of your Xamarin.Forms application, keep in mind that the same principles that improve the experience of your apps built with the Xamarin SDKs for iOS and Android [&hellip;]<\/p>\n","protected":false},"author":553,"featured_media":39167,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[2],"tags":[16],"class_list":["post-32059","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-developers","tag-xamarin-forms"],"acf":[],"blog_post_summary":"<p>The Xamarin SDKs for iOS and Android provide an extremely performant foundation upon which to build Xamarin.Forms cross-platform applications. As you work to tune the speed and responsiveness of your Xamarin.Forms application, keep in mind that the same principles that improve the experience of your apps built with the Xamarin SDKs for iOS and Android [&hellip;]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/posts\/32059","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/users\/553"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/comments?post=32059"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/posts\/32059\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/media\/39167"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/media?parent=32059"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/categories?post=32059"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/tags?post=32059"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}