Efficient way to bind images to a grid-view from a collection - Windows 8 Metro

Question

Currently I couple of Gridviews on separate pages which contain images they all work aside from the fact that the performance is terrible and sometimes it also causes the app to greyscreen. Does anyone know of a more efficient way to display the images within the gridview?

Here is the Binding on the C#

    private void navigationHelper_LoadState(object sender, LoadStateEventArgs e)
    {
        PhotoCollection PassedCollection = (PhotoCollection)e.NavigationParameter;

        pCollection = PassedCollection;
        pageTitle.Text = pCollection.name;
        itemGridView.ItemsSource = pCollection.photos;
    }

Here is the XAML:

</Grid>

    <GridView
        x:Name="itemGridView"
        Margin="10"
        ItemsSource="{Binding}"
        SelectionMode="None" IsItemClickEnabled="True" Grid.Row="1" Grid.RowSpan="3">
        <GridView.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsWrapGrid MaximumRowsOrColumns="5"/>
            </ItemsPanelTemplate>
        </GridView.ItemsPanel>
        <GridView.ItemTemplate>
            <DataTemplate>
                <Grid HorizontalAlignment="Left" Width="200" Height="100" Margin="5,5,5,5">
                    <Border Background="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}">
                        <Image Stretch="UniformToFill" Source="{Binding Image}">
                        </Image>
                    </Border>
                </Grid>
            </DataTemplate>
        </GridView.ItemTemplate>
    </GridView>
</Grid>

Answer 1

Don't pass complex types as a navigation parameter. This is a common gotcha and will cause your app to crash on resuming from suspension. Store your photocollection in a static class or something, and if necessary pass a key in the navigation parameter.