Bagikan melalui

Mengoptimalkan Performa: Tata Letak dan Desain

Desain aplikasi WPF Anda dapat memengaruhi performanya dengan membuat overhead yang tidak perlu dalam menghitung tata letak dan memvalidasi referensi objek. Konstruksi objek, terutama pada waktu proses, dapat memengaruhi karakteristik performa aplikasi Anda.

Topik ini memberikan rekomendasi performa di area ini.

Tata letak

Istilah "proses tata letak" menggambarkan proses mengukur dan mengatur anggota koleksi turunan objek Panel, lalu menampilkannya di layar. Langkah tata letak adalah proses intensif matematis—semakin banyak jumlah anak dalam koleksi, semakin banyak jumlah perhitungan yang diperlukan. Misalnya, setiap kali objek anak UIElement dalam koleksi mengubah posisinya, hal ini berpotensi memicu ulang proses oleh sistem tata letak. Karena hubungan dekat antara karakteristik objek dan perilaku tata letak, penting untuk memahami jenis peristiwa yang dapat memanggil sistem tata letak. Aplikasi Anda akan berkinerja lebih baik dengan mengurangi sebanyak mungkin pemanggilan yang tidak perlu dari kode tata letak.

Sistem tata letak menyelesaikan dua pass untuk setiap anggota anak dalam koleksi: pass pengukuran, dan pass pengaturan. Setiap objek anak menyediakan implementasi yang di-override sendiri dari metode Measure dan Arrange untuk memberikan perilaku tata letak spesifiknya. Dalam bentuk yang paling sederhana, tata letak adalah sistem rekursif yang mengarah ke elemen yang ditentukan ukurannya, diposisikan, dan terlihat dalam layar.

  • Objek anak UIElement memulai proses tata letak dengan pertama-tama mengukur properti intinya.

  • Properti FrameworkElement objek yang terkait dengan ukuran, seperti Width, Height, dan Margin, dievaluasi.

  • Panel-logika khusus diterapkan, seperti properti Dock dari DockPanel, atau properti Orientation dari StackPanel.

  • Konten diatur atau posisinya ditentukan setelah pengukuran semua objek turunan.

  • Kumpulan objek anak digambar ke layar.

Proses penerapan tata letak dipanggil lagi jika salah satu tindakan berikut terjadi:

  • Objek anak ditambahkan ke koleksi.

  • LayoutTransform diterapkan pada objek anak.

  • Metode UpdateLayout dijalankan pada objek anak.

  • Ketika terjadi perubahan pada nilai properti dependensi yang ditandai dengan metadata yang memengaruhi proses pengukuran atau pengaturan.

Gunakan Panel Paling Efisien jika Memungkinkan

Kompleksitas proses tata letak secara langsung didasarkan pada perilaku tata letak elemen turunan Panelyang Anda gunakan. Misalnya, kontrol Grid atau StackPanel menyediakan lebih banyak fungsionalitas daripada kontrol Canvas. Harga untuk peningkatan fungsionalitas yang lebih besar ini adalah peningkatan biaya performa yang lebih besar. Namun, jika Anda tidak memerlukan fungsionalitas yang disediakan kontrol Grid, Anda harus menggunakan alternatif yang lebih murah, seperti Canvas atau panel kustom.

Untuk informasi selengkapnya, lihat Gambaran Umum Panel .

Memperbarui Daripada Mengganti RenderTransform

Anda mungkin dapat memperbarui Transform daripada menggantinya sebagai nilai properti RenderTransform. Ini terutama berlaku dalam skenario yang melibatkan animasi. Dengan memperbarui Transformyang ada, Anda menghindari memulai perhitungan tata letak yang tidak perlu.

Bangun Pohon Anda Top-Down

Ketika simpul ditambahkan atau dihapus dari pohon logika, pembatalan properti terjadi pada induk simpul dan semua anaknya. Akibatnya, pola konstruksi top-down harus selalu diikuti untuk menghindari biaya pembatalan yang tidak perlu pada simpul yang telah divalidasi. Tabel di bawah ini menunjukkan perbedaan kecepatan eksekusi antara membangun pohon secara top-down versus bottom-up, di mana pohon ini memiliki 150 tingkat dengan satu TextBlock dan DockPanel di setiap tingkat.

Tindakan Pembangunan pohon (dalam ms) Render—termasuk pembangunan pohon (dalam ms)
Bawah ke atas 366 454
Atas ke bawah 11 96

Contoh kode berikut menunjukkan cara membuat pohon di atas ke bawah.

private void OnBuildTreeTopDown(object sender, RoutedEventArgs e)
{
    TextBlock textBlock = new TextBlock();
    textBlock.Text = "Default";

    DockPanel parentPanel = new DockPanel();
    DockPanel childPanel;

    myCanvas.Children.Add(parentPanel);
    myCanvas.Children.Add(textBlock);

    for (int i = 0; i < 150; i++)
    {
        textBlock = new TextBlock();
        textBlock.Text = "Default";
        parentPanel.Children.Add(textBlock);

        childPanel = new DockPanel();
        parentPanel.Children.Add(childPanel);
        parentPanel = childPanel;
    }
}

Private Sub OnBuildTreeTopDown(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Dim textBlock As New TextBlock()
    textBlock.Text = "Default"

    Dim parentPanel As New DockPanel()
    Dim childPanel As DockPanel

    myCanvas.Children.Add(parentPanel)
    myCanvas.Children.Add(textBlock)

    For i As Integer = 0 To 149
        textBlock = New TextBlock()
        textBlock.Text = "Default"
        parentPanel.Children.Add(textBlock)

        childPanel = New DockPanel()
        parentPanel.Children.Add(childPanel)
        parentPanel = childPanel
    Next i
End Sub

Untuk informasi selengkapnya tentang pohon logis, lihat Pohon di WPF.

Lihat juga

  • Last updated on