Clever Geek Handbook

XAML - Windows Phone 8 Slow Loading with Pivot Control

I have a Windows Phone 8 app, I'm looking to find out why my home page is loading very slowly.

My home page has the following structure:

    <PivotControl>
     <PivotItem>           
       <LongListSelector/>
     </PivotItem>  Times 5

   </PivotControl>

I have a total of 5 PivotItems, each of these items has its own api call to get the items so they can show them. Each pivot element first loads 12 elements and loads more when the user starts scrolling.

My question is, has anyone run into this problem while having a heavy master page with a lot of elements? and what improvements have you made to make the page load faster. I have already reduced the number of items I display (before I loaded 40 items into each PivotItem).

EDIT: My ListItemTemplate is pretty clean (I cleaned it up to make it lighter in XAMLcode), it has one grid which is em-globes and InvokeCommandAction, an image, a frame and 3 text blocks

Edit2: I loaded about 30% of the load time by collapsing my other LongListSelector when the user is not on my PivotItem, so I hide 2 LongListSelector. I am showing the PivotItem which is right-middle (of course) and left, when the user clicks left or right, I reload and hide the items I want. It's not pretty, but it helps.

EDIT3: Almost (90%) all of my styles are already placed in my StylePage and are meant to style my elements. I've found that adding a little animation when the user enters and leaves the page allows me to improve the transition between pages. Here's my classic transition code:

<toolkit:TransitionService.NavigationInTransition>
        <toolkit:NavigationInTransition>
            <toolkit:NavigationInTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardIn" />
            </toolkit:NavigationInTransition.Backward>
            <toolkit:NavigationInTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardIn" />
            </toolkit:NavigationInTransition.Forward>
        </toolkit:NavigationInTransition>
    </toolkit:TransitionService.NavigationInTransition>
    <toolkit:TransitionService.NavigationOutTransition>
        <toolkit:NavigationOutTransition>
            <toolkit:NavigationOutTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardOut" />
            </toolkit:NavigationOutTransition.Backward>
            <toolkit:NavigationOutTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardOut" />
            </toolkit:NavigationOutTransition.Forward>
        </toolkit:NavigationOutTransition>
    </toolkit:TransitionService.NavigationOutTransition>
+3


source to share


2 answers


Two things I didn't see in your question, but thought I'd add to help you.

  • Do not load or initialize your data in the constructor or loaded event, as it is bound to UI controls. This will freeze the user interface.
  • Always make an asynchronous source call that will allow the UI to continue working while the task is running.
  • Use OnNavigatedTo (with cached data if a large amount of data is transferred over the network) and use asynchronous methods.


They should bring your UI back to speed.

+2


source


I think you have too much code intensive in your MainPage constructor. Anyway, you can use Task.Run

to load data into different threads and / or use events MainPage.Loaded

and do your stuff here.

Also try to limit the code you have in App.xaml.cs

(constructor, run methods)



Remember Dispatcher.BeginAction

to use UI control when using Task.Run

.

There is also a Scheduler.Dispatcher.Schedule()

delayed method call.

0


source






More articles:


All Articles