¿En qué orden son los paneles los más eficientes en términos de tiempo de renderizado y rendimiento?

Creo que es más conciso y comprensible describir las características de desempeño de cada panel que tratar de dar una comparación de desempeño relativa absoluta.

WPF hace dos pasadas al renderizar contenido: Medir y Organizar. Cada panel tiene diferentes características de rendimiento para cada una de estas dos pasadas.

El rendimiento del paso de medida se ve más afectado por la capacidad de un panel para acomodar el estiramiento utilizando alineaciones (o Auto en el caso de la Grid) y luego el número de hijos que se estiran o auto-tamaño. El rendimiento del pase Arrange se ve afectado por la complejidad de la interacción entre la ubicación del diseño de diferentes niños y, por supuesto, el número de niños.

A veces los paneles dados no se prestan fácilmente al diseño necesario. Creé un control que necesitaba un número arbitrario de elementos para que cada uno se posicionara en un cierto porcentaje del espacio disponible. Ninguno de los predeterminados los controles hacen esto. Intentar que hagan esto (a través del enlace al tamaño real del padre) resulta en un rendimiento horrible. Creé un panel de diseño basado en el Lienzo que logró el resultado deseado con un trabajo mínimo (copié la fuente del lienzo y modificé alrededor de 20 líneas del mismo).

Paneles disponibles:

• Canvas

  Define un área dentro de la cual se puede posicionar explícitamente hijo elementos por coordenadas relativas a el área del Lienzo.

  El Lienzo tiene el mejor rendimiento de todos los paneles para el pase de disposición, ya que a cada elemento se le asigna una ubicación estática. El measure pass también tiene un excelente rendimiento ya que no hay ningún concepto de estiramiento en este panel; cada niño simplemente usa su tamaño nativo.

• DockPanel

  Define un área dentro de la cual puede organizar elementos secundarios horizontal o verticalmente, en relación con cada otro.

  El Dockpanel tiene un esquema de diseño muy simple donde los elementos se agregan uno por uno en relación con el elemento anterior agregado. De forma predeterminada, la altura o el ancho están determinados por el tamaño nativo del elemento (basado en la Parte Superior/Inferior vs Izquierda/Derecha respectivamente) y la otra dirección está determinada por la propiedad Dock si el ancho o el alto no están definidos. Paso de medida medio a rápido y paso de disposición medio a rápido.

• Grid

  Define un área de cuadrícula flexible que consiste en columnas y filas.

  Este puede ser el panel más intensivo de rendimiento si se usa dimensionamiento proporcional o auto dimensionamiento. Calcular el tamaño del elemento secundario puede ser una combinación compleja del tamaño nativo del elemento y el diseño especificado por la cuadrícula. El diseño es también el más complicado de todos los paneles. Rendimiento lento a medio para el paso de medida y rendimiento lento a medio para el arreglo pasar.

• StackPanel

  Organiza los elementos secundarios en una sola línea que puede ser orientada horizontal o verticalmente.

  El StackPanel mide sus hijos usando el tamaño nativo o relativo en la dirección opuesta a su orientación y el tamaño nativo en la dirección de su orientación (la alineación no hace nada en esta dirección). Esto lo convierte en un intérprete de nivel medio en esta área. El pase de acuerdo es simplemente, solo poner los artículos en orden. Probablemente la segunda mejor actuación para este pase. Rendimiento medio para el pase de medición y rendimiento rápido para el pase de diseño.

• VirtualizingPanel

  Proporciona un marco para los elementos del panel que virtualizan su recopilación de datos hijo. Esta es una clase abstracta.

  Una clase base para implementar su propio panel de virtualización. Solo carga elementos visibles para evitar el uso innecesario de la memoria y procesador. Mucho más rendimiento para conjuntos de elementos. Probablemente un poco menos de rendimiento para los elementos que caben en la pantalla debido a la comprobación de límites. El SDK solo proporciona una subclase de esto, la VirtualizingStackPanel.

• WrapPanel

  Coloca los elementos secundarios en posición secuencial de izquierda a derecha, rompiendo el contenido a la siguiente línea en el borde de la caja contenedora. El orden posterior se produce secuencialmente de arriba a abajo o de derecha a izquierda, dependiendo sobre el valor de la Propiedad de orientación.

  El paso de medida es un paso algo complejo donde el elemento más grande de una fila en particular determina la altura de la fila y luego cada elemento en esa fila usa su altura nativa (si tiene una) o la altura de la fila. El pase de diseño es simple, colocando cada elemento uno tras otro en una fila y luego continuando en la siguiente fila cuando no hay suficiente espacio para el siguiente elemento. Paso medio de la medida del funcionamiento. Medio a rápido rendimiento para el pase de acuerdo.

Referencias:

Utilice el Panel más Eficiente cuando sea Posible

La complejidad del proceso de maquetación se basa directamente en la maquetación comportamiento de los elementos derivados del panel que utiliza. Por ejemplo, una Cuadrícula o StackPanel control proporciona mucha más funcionalidad que un lienzo control. El precio de este mayor aumento en la funcionalidad es un mayor aumento de los costes de rendimiento. Sin embargo, si no se requieren la funcionalidad que proporciona un control de cuadrícula, debe utilizar el alternativas menos costosas, como un lienzo o un panel personalizado.

De Optimización del Rendimiento: Maquetación y Diseño

El sistema de diseño completa dos pases para cada miembro de los Hijos colección, un pase de medida y un pase de disposición. Cada Panel infantil proporciona sus propios métodos MeasureOverride y ArrangeOverride para lograr su propio diseño específico comportamiento.

Durante el pase de medida, cada miembro de la colección de Niños es evaluar. El proceso comienza con una llamada al método Measure. Este método se llama dentro de la implementación del Panel padre elemento, y no tiene que ser llamado explícitamente para ocurrir.

Primero, se evalúan las propiedades de tamaño nativo del UIElement, como Clip y Visibilidad. Esto genera un valor llamado constraintSize que se pasa a MeasureCore.

En segundo lugar, las propiedades del marco definidas en FrameworkElement son procesado, que afecta al valor de constraintSize. Estas propiedades describir generalmente las características de dimensionamiento del subyacente UIElement, como su Altura, Ancho, Margen y Estilo. Cada uno de estos propiedades pueden cambiar el espacio que es necesario para mostrar el elemento. MeasureOverride se llama entonces con constraintSize como un parámetro.

Nota Hay una diferencia entre las propiedades de Altura y Anchura y ActualHeight y ActualWidth. Por ejemplo, la altura actual propiedad es un valor calculado basado en otras entradas de altura y la sistema de diseño. El valor es establecido por el propio sistema de diseño, basado en un pase de renderizado real, y por lo tanto puede retrasarse ligeramente establecer el valor de las propiedades, como la Altura, que son la base de la cambio de entrada. Debido a que ActualHeight es un valor calculado, usted debe tenga en cuenta que podría haber informes múltiples o incrementales cambio a él como resultado de diversas operaciones por el sistema de diseño. El el sistema de diseño puede estar calculando el espacio de medida requerido para el niño elementos, restricciones por el elemento padre, y así sucesivamente. El último el objetivo del pase de medida es que el niño determine su DesiredSize, que se produce durante la llamada a MeasureCore. El tamaño deseado el valor se almacena por Medida para su uso durante el pase de disposición de contenido.

El pase arrange comienza con una llamada al método Arrange. Durante el arrange pass, el elemento del panel padre genera un rectángulo que representa los límites del niño. Este valor se pasa a la Método ArrangeCore para el procesamiento.

El método ArrangeCore evalúa el DesiredSize del hijo y evalúa cualquier margen adicional que pueda afectar el tamaño de elemento. ArrangeCore genera un arrangeSize, que se pasa a el método ArrangeOverride del Panel como parámetro. ArrangeOverride genera el Tamaño final del niño. Por último, el El método ArrangeCore realiza una evaluación final de las propiedades de desplazamiento, tales como margen y alineación, y pone al hijo dentro de su ranura de diseño. El niño no tiene que (y con frecuencia no) llenar todo el espacio asignado. Control se devuelve entonces al Panel padre y el proceso de diseño se ha completado.

De Midiendo y Arreglando a los Niños