Virtualisierung von ListView- und GridView-DatenListView and GridView data virtualization

Hinweis  Weitere Informationen findest du in der Session Dramatically Increase Performance when Users Interact with Large Amounts of Data in GridView and ListView (Erhebliches Erhöhen der Leistung bei der Interaktion von Benutzern mit großen Mengen von Daten in GridView und ListView) auf der Build 2013.Note  For more details, see the //build/ session Dramatically Increase Performance when Users Interact with Large Amounts of Data in GridView and ListView.

Verbessern Sie die Leistung und Startzeit von ListView und GridView durch Datenvirtualisierung.Improve ListView and GridView performance and startup time through data virtualization. Informationen zu UI-Virtualisierung, Elementreduzierung und die progressive Aktualisierung von Elementen finden Sie unter Optimieren der ListView- und GridView-Benutzeroberfläche.For UI virtualization, element reduction, and progressive updating of items, see ListView and GridView UI optimization.

Eine Methode zur Datenvirtualisierung ist für einen Datensatz erforderlich, der so groß ist, dass er zu einem bestimmten Zeitpunkt nicht komplett im Arbeitsspeicher gespeichert werden kann oder soll.A method of data virtualization is needed for a data set that is so large that it cannot or should not all be stored in memory at one time. Sie laden einen ersten Teil (vom lokalen Datenträger, aus dem Netzwerk oder der Cloud) in den Arbeitsspeicher und wenden die UI-Virtualisierung auf dieses Teildataset an.You load an initial portion into memory (from local disk, network, or cloud) and apply UI virtualization to this partial data set. Sie können die Daten später inkrementell oder bei Bedarf von beliebigen Punkten im Master-Dataset (wahlfreier Zugriff) laden.You can later load data incrementally, or from arbitrary points in the master data set (random access), on demand. Ob die Datenvirtualisierung für Sie geeignet ist, hängt von vielen Faktoren ab.Whether data virtualization is appropriate for you depends on many factors.

  • Die Größe Ihres DatasetsThe size of your data set
  • Die Größe der einzelnen ElementeThe size of each item
  • Die Quelle des Datasets (lokaler Datenträger, Netzwerk oder Cloud)The source of the data set (local disk, network, or cloud)
  • Die gesamte Arbeitsspeichernutzung Ihrer AppThe overall memory consumption of your app

Hinweis   Beachte, dass für ListView und GridView standardmäßig ein Feature aktiviert ist, das temporäre Platzhalter für visuelle Elemente anzeigt, während der Benutzer eine schnelle Verschiebung/einen schnellen Bildlauf durchführt.Note  Be aware that a feature is enabled by default for ListView and GridView that displays temporary placeholder visuals while the user is panning/scrolling quickly. Beim Laden von Daten werden diese Platzhalter für visuelle Elemente durch die Elementvorlage ersetzt.As data is loaded, these placeholder visuals are replaced with your item template. Sie können das Feature deaktivieren, indem Sie ListViewBase.ShowsScrollingPlaceholders auf „false“ festlegen. In diesem Fall wird jedoch empfohlen, das „x: Phase“-Attribut zu verwenden, um die Elemente in der Elementvorlage progressiv zu rendern.You can turn the feature off by setting ListViewBase.ShowsScrollingPlaceholders to false, but if you do so then we recommend that you use the x:Phase attribute to progressively render the elements in your item template. Siehe Progressives Aktualisieren von ListView- und GridView-Elementen.See Update ListView and GridView items progressively.

Hier erhalten Sie weitere Informationen über die Verfahren der inkrementellen Datenvirtualisierung und der Datenvirtualisierung mit wahlfreiem Zugriff.Here are more details about the incremental and random-access data virtualization techniques.

Inkrementelle DatenvirtualisierungIncremental data virtualization

Bei der inkrementellen Datenvirtualisierung werden Daten sequenziell geladen.Incremental data virtualization loads data sequentially. Ein ListView, das die inkrementelle Datenvirtualisierung verwendet, kann zum Anzeigen einer Sammlung von einer Million Elementen verwendet werden, wobei aber anfänglich nur 50 Elemente geladen werden.A ListView that uses incremental data virtualization may be used to view a collection of a million items, but only 50 items are loaded initially. Beim Schwenken/Bildlauf werden die nächsten 50 Elemente geladen.As the user pans/scrolls, the next 50 are loaded. Der Ziehpunkt der Bildlaufleiste wird beim Laden der Elemente kleiner.As items are loaded, the scroll bar's thumb decreases in size. Für diese Art der Datenvirtualisierung schreiben Sie eine Datenquellenklasse, die diese Schnittstellen implementiert.For this type of data virtualization you write a data source class that implements these interfaces.

Eine derartige Datenquelle ist eine speicherinterne Liste, die ständig erweitert werden kann.A data source like this is an in-memory list that can be continually extended. Das Elementsteuerelement fordert die Elemente mithilfe der standardmäßigen „Indexer“- und „Count“-Eigenschaften von IList an.The items control will ask for items using the standard IList indexer and count properties. Die Anzahl sollte die Anzahl der lokalen Elemente darstellen, nicht die tatsächliche Größe des Datasets.The count should represent the number of items locally, not the true size of the dataset.

Wenn sich das Elementsteuerelement dem Ende der vorhandenen Daten nähert, ruft es ISupportIncrementalLoading.HasMoreItems auf.When the items control gets close to the end of the existing data, it will call ISupportIncrementalLoading.HasMoreItems. Wenn true zurückgegeben wird, ruft es ISupportIncrementalLoading.LoadMoreItemsAsync auf und übergibt eine empfohlene Anzahl von zu ladenden Elementen.If you return true, then it will call ISupportIncrementalLoading.LoadMoreItemsAsync passing an advised number of items to load. Je nachdem, von wo die Daten (lokaler Datenträger, Netzwerk oder Cloud) geladen werden, können Sie eine andere als die empfohlene Anzahl von Elementen laden.Depending on where you're loading data from (local disk, network, or cloud), you may choose to load a different number of items than that advised. Wenn Ihr Dienst z. B. Stapel von 50 Elementen unterstützt, aber das Elementsteuerelement nur 10 anfordert, dann können Sie 50 Elemente laden.For example, if your service supports batches of 50 items but the items control only asks for 10 then you can load 50. Laden Sie die Daten vom Back-End, fügen Sie sie zur Liste hinzu, und lösen Sie über INotifyCollectionChanged oder IObservableVector<T> eine Änderungsbenachrichtigung aus, damit das Elementsteuerelement über die neuen Elemente informiert wird.Load the data from your back end, add it to your list, and raise a change notification via INotifyCollectionChanged or IObservableVector<T> so that the items control knows about the new items. Geben Sie außerdem die Anzahl der tatsächlich geladenen Elemente zurück.Also return a count of the items you actually loaded. Wenn Sie weniger Artikel als empfohlen laden oder das Elementsteuerelement in der Zwischenzeit noch weiter verschoben/durchlaufen wurde, dann wird die Datenquelle erneut aufgerufen, um weitere Elemente zu laden, und der Zyklus wird anschließend fortgesetzt.If you load fewer items than advised, or the items control has been panned/scrolled even further in the interim, then your data source will be called again for more items and the cycle will continue. Weitere Informationen findest du durch Herunterladen des XAML-Datenbindungsbeispiel für Windows 8.1 und der Wiederverwendung des Quellcodes in Ihrer App für Windows 10.You can learn more by downloading the XAML data binding sample for Windows 8.1 and re-using its source code in your Windows 10 app.

Datenvirtualisierung mit wahlfreiem ZugriffRandom access data virtualization

Die Datenvirtualisierung mit wahlfreiem Zugriff ermöglicht das Laden von Daten, die sich an einem beliebigen Punkt des Datasets befinden.Random access data virtualization allows loading from an arbitrary point in the data set. Ein ListView, das die Datenvirtualisierung mit wahlfreiem Zugriff verwendet und zum Anzeigen einer Sammlung von einer Million Elementen verwendet wird, kann die Elemente 100.000 bis 100.050 laden.A ListView that uses random access data virtualization, used to view a collection of a million items, can load the items 100,000 – 100,050. Wechselt der Benutzer anschließend zum Listenanfang, lädt das Steuerelement die Elemente von 1 bis 50.If the user then moves to the beginning of the list, the control loads items 1 – 50. Der Ziehpunkt der Bildlaufleiste gibt jederzeit an, dass ListView eine Million Elemente enthält.At all times, the scroll bar's thumb indicates that the ListView contains a million items. Die Position des Ziehpunkts der Bildlaufleiste gibt Aufschluss über die relative Position der sichtbaren Elemente innerhalb des gesamten Datasets der Sammlung.The position of the scroll bar's thumb is relative to where the visible items are located in the collection's entire data set. Diese Art der Datenvirtualisierung kann den Speicherbedarf und die Ladezeiten für die Sammlung erheblich reduzieren.This type of data virtualization can significantly reduce the memory requirements and load times for the collection. Zur Aktivierung müssen Sie eine Datenquellenklasse erstellen, die Daten bei Bedarf abruft, einen lokalen Cache verwaltet und diese Schnittstellen implementiert.To enable it you need to write a data source class that fetches data on demand and manages a local cache and implements these interfaces.

IItemsRangeInfo stellt Informationen dazu bereit, welche Elemente das Steuerelement aktiv verwendet.IItemsRangeInfo provides information on which items the control is actively using. Das Steuerelement ruft diese Methode bei jeder Änderung der Ansicht auf und bezieht diese beiden Sätze von Bereichen ein.The items control will call this method whenever its view is changing, and will include these two sets of ranges.

  • Der Satz von Elementen, die sich im Viewport befinden.The set of items that are in the viewport.
  • Eine Reihe von nicht virtualisierten Elemente, die das Steuerelement verwendet und möglicherweise nicht im Viewport enthalten sind.A set of non-virtualized items that the control is using that may not be in the viewport.
    • Ein um den Viewport angeordneter Puffer von Elementen, der von den Elementen gesteuert wird, damit die Verschiebung per Toucheingabe reibungslos verläuft.A buffer of items around the viewport that the items control keeps so that touch panning is smooth.
    • Das Element, das den Fokus hat.The focused item.
    • Das erste Element.The first item.

Durch die Implementierung von IItemsRangeInfo weiß Ihre Datenquelle, welche Elemente abgerufen und zwischengespeichert werden müssen. Zudem ist ihr bekannt, wann nicht länger im Cache erforderliche Daten gelöscht werden müssen.By implementing IItemsRangeInfo your data source knows what items need to be fetched and cached, and when to prune from the cache data that is no longer needed. IItemsRangeInfo verwendet ItemIndexRange-Objekte, um eine Reihe von Elementen auf Basis ihres Indexes in der Sammlung zu beschreiben.IItemsRangeInfo uses ItemIndexRange objects to describe a set of items based on their index in the collection. Auf diese Weise werden keine Elementzeiger verwendet, die möglicherweise nicht korrekt oder zuverlässig sind.This is so that it doesn't use item pointers, which may not be correct or stable. IItemsRangeInfo ist dafür vorgesehen, nur von einer einzelnen Instanz eines Elementsteuerelements verwendet zu werden, da es auf Zustandsinformationen für dieses Elementsteuerelement beruht.IItemsRangeInfo is designed to be used by only a single instance of an items control because it relies on state information for that items control. Wenn mehrere Elementsteuerelemente Zugriff auf dieselben Daten benötigen, ist jeweils eine separate Instanz der Datenquelle erforderlich.If multiple items controls need access to the same data then you will need a separate instance of the data source for each. Sie können einen gemeinsamen Cache teilen, aber die Logik zum Löschen aus dem Cache ist dann komplizierter.They can share a common cache, but the logic to purge from the cache will be more complicated.

Hier folgt die grundlegende Strategie für die Datenvirtualisierung mit wahlfreiem Zugriff auf die Datenquelle.Here's the basic strategy for your random access data virtualization data source.

  • Bei der Anforderung eines ElementsWhen asked for an item
    • Wenn es im Arbeitsspeicher verfügbar ist, geben Sie es zurück.If you have it available in memory, then return it.
    • Wenn es nicht vorhanden ist, geben Sie Null oder ein Platzhalterelement zurück.If you don’t have it, then return either null or a placeholder item.
    • Verwenden Sie die Anforderung für ein Element (oder die Bereichsinformationen aus IItemsRangeInfo), um zu wissen, welche Elemente erforderlich sind, und um Daten für Elemente asynchron vom Back-End abzurufen.Use the request for an item (or the range information from IItemsRangeInfo) to know which items are needed, and to fetch data for items from your back end asynchronously. Lösen Sie nach dem Abrufen der Daten eine Änderungsbenachrichtigung über INotifyCollectionChanged oder IObservableVector<T> aus, damit das Elementsteuerelement über das neue Element informiert ist.After retrieving the data, raise a change notification via INotifyCollectionChanged or IObservableVector<T> so that the items control knows about the new item.
  • (Optional) Wenn sich der Viewport des Elementsteuerelements ändert, identifizieren Sie über Ihre Implementierung von IItemsRangeInfo, welche Elemente aus der Datenquelle erforderlich sind.(Optionally) as the items control's viewport changes, identify what items are needed from your data source via your implementation of IItemsRangeInfo.

Die Strategie, wann die Datenelemente geladen werden, wie viele Datenelemente geladen werden und welche Elemente im Arbeitsspeicher verbleiben, hängt darüber hinaus von Ihrer Anwendung ab.Beyond that, the strategy for when to load data items, how many to load, and which items to keep in memory is up to your application. Einige allgemeine, zu berücksichtigende Überlegungen:Some general considerations to keep in mind:

  • Stellen Sie asynchrone Anforderungen für die Daten. Blockieren Sie nicht den UI-Thread.Make asynchronous requests for data; don't block the UI thread.
  • Finden Sie den optimalen Bereich für die Größe der Stapel, in denen Sie Elemente abrufen.Find the sweet spot in the size of the batches you fetch items in. Bevorzugen Sie eine kompakte Vorgehensweise.Prefer chunky to chatty. Nicht zu klein, dass zu viele kleine Anforderungen erforderlich sind, aber auch nicht zu groß, dass das Abrufen zu lange dauert.Not so small that you make too many small requests; not too large that they take too long to retrieve.
  • Berücksichtigen Sie, wie viele Anforderungen gleichzeitig ausstehen sollen.Consider how many requests you want to have pending at the same time. Die sequenzielle Ausführung ist einfacher, aber möglicherweise zu langsam, wenn die Verarbeitungszeit hoch ist.Performing one at a time is easier, but it may be too slow if turnaround time is high.
  • Können Sie die Datenanforderungen abbrechen?Can you cancel requests for data?
  • Ergeben sich Kosten für die einzelnen Transaktionen, wenn Sie einen gehosteten Dienst verwenden?If using a hosted service, is there a cost per transaction?
  • Welche Art von Benachrichtigungen werden vom Dienst bereitgestellt, wenn sich die Ergebnisse einer Abfrage ändern?What kind of notifications are provided by the service when the results of a query are changed? Können Sie erfahren, ob ein Element bei Index 33 eingefügt wird?Will you know if an item is inserted at index 33? Wenn Ihr Dienst Abfragen auf Basis von Schlüssel-plus-Versatz unterstützt, ist dies möglicherweise besser geeignet, anstatt nur einen Index zu verwenden.If your service supports queries based on a key-plus-offset, that may be better than just using an index.
  • Wie intelligent soll das Vorabrufen der Elemente verlaufen?How smart do you want to be in pre-fetching items? Möchten Sie die Richtung und Geschwindigkeit des Bildlaufs testen und nachverfolgen, um vorherzusagen, welche Elemente erforderlich sind?Are you going to try and track the direction and velocity of scrolling to predict which items are needed?
  • Wie offensiv möchten Sie beim Leeren des Caches vorgehen?How aggressive do you want to be in purging the cache? Hierbei müssen Arbeitsspeicher und Erfahrung gegeneinander abgewogen werden.This is a tradeoff of memory versus experience.