dotnet / maui

.NET MAUI is the .NET Multi-platform App UI, a framework for building native device applications spanning mobile, tablet, and desktop.
https://dot.net/maui
MIT License
21.63k stars 1.61k forks source link

BindableLayout Height loading Time #22076

Open PauchardThomas opened 2 weeks ago

PauchardThomas commented 2 weeks ago

Description

As you can see below, I try to load the same view 3 times, and it take more and more time to load...

https://github.com/dotnet/maui/assets/9884985/77d0993e-9533-499d-87b2-f14de91a6820

==> It's running on Release mode ! (On debug i can take my shower, eat, sleep...)

I really don't know if it's a bindablelayout issue or DataTemplate.

Steps to Reproduce

MainView :

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="DatatTemplatePerfIssue.NewPage1"
             xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:DatatTemplatePerfIssue"
             Title="NewPage1">
    <ScrollView>
        <StackLayout>
            <HorizontalStackLayout>
                <VerticalStackLayout>
                    <Button BackgroundColor="Black" Clicked="Button_Clicked" HorizontalOptions="Center" Text="Load Tab 1" TextColor="White" WidthRequest="200" />
                    <Label x:Name="lb1" />
                </VerticalStackLayout>
                <VerticalStackLayout>
                    <Button BackgroundColor="Black" Clicked="Button_Clicked_1" HorizontalOptions="Center" Text="Load Tab 2" TextColor="White" WidthRequest="200" />
                    <Label x:Name="lb2" />
                </VerticalStackLayout>
                <VerticalStackLayout>
                    <Button BackgroundColor="Black" Clicked="Button_Clicked_2" HorizontalOptions="Center" Text="Load Tab 3" TextColor="White" WidthRequest="200" />
                    <Label x:Name="lb3" />
                </VerticalStackLayout>
            </HorizontalStackLayout>
            <Label x:Name="lbLoaded" FontSize="Large" HorizontalOptions="Center" VerticalOptions="Center" />
            <local:Table x:Name="tb1" />
            <local:Table x:Name="tb2" />
            <local:Table x:Name="tb3" />
        </StackLayout>
    </ScrollView>
</ContentPage>
<?xml version="1.0" encoding="utf-8" ?>
<ContentView x:Class="DatatTemplatePerfIssue.Table"
             xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:DatatTemplatePerfIssue">
    <VerticalStackLayout>
        <VerticalStackLayout x:Name="Rows" Spacing="10">
            <BindableLayout.ItemTemplate>
                <DataTemplate x:DataType="local:Row">
                    <Grid RowDefinitions="45,1">
                        <Grid Grid.Row="0" ColumnDefinitions="auto,auto,*" ColumnSpacing="10">
                            <Label Grid.Column="0" Text="{Binding Title, Mode=OneTime}" />
                            <Label Grid.Column="1" Text="{Binding Description, Mode=OneTime}" />
                            <HorizontalStackLayout Grid.Column="2" BindableLayout.ItemsSource="{Binding Cols, Mode=OneTime}" Spacing="10" WidthRequest="500">
                                <BindableLayout.ItemTemplate>
                                    <DataTemplate x:DataType="local:Col">
                                        <HorizontalStackLayout WidthRequest="100">
                                            <Border HeightRequest="25" Stroke="Blue" WidthRequest="25" />
                                            <Border HeightRequest="25" Stroke="Green" WidthRequest="25" />
                                            <Border HeightRequest="25" Stroke="Orange" WidthRequest="25" />
                                            <Border HeightRequest="25" Stroke="Red" WidthRequest="25" />
                                        </HorizontalStackLayout>
                                    </DataTemplate>
                                </BindableLayout.ItemTemplate>
                            </HorizontalStackLayout>
                        </Grid>
                        <BoxView Grid.Row="1" BackgroundColor="Black" />
                    </Grid>
                </DataTemplate>
            </BindableLayout.ItemTemplate>
        </VerticalStackLayout>
        <BoxView BackgroundColor="Red" HeightRequest="2" HorizontalOptions="FillAndExpand" />
    </VerticalStackLayout>
</ContentView>
using System.Collections.ObjectModel;
using System.Diagnostics;

namespace DatatTemplatePerfIssue;

public partial class Table : ContentView
{
    public Table()
    {
        InitializeComponent();
    }

    public void Load()
    {
        ObservableCollection<Col> cols = new ObservableCollection<Col>();
        for (int i = 0; i < 7; i++)
        {
            cols.Add(new Col("Title" + i));
        }
        ObservableCollection<Row> rows = new ObservableCollection<Row>();
        for (int i = 0; i < 5; i++)
        {
            rows.Add(new Row("Row " + i, "Description " + i, cols));
        }

        BindableLayout.SetItemsSource(Rows, rows);
    }
}

Link to public reproduction project repository

https://github.com/PauchardThomas/MauiBindableLayoutPerfIssue

Version with bug

8.0.3 GA

Is this a regression from previous behavior?

Not sure, did not test other versions

Last version that worked well

Unknown/Other

Affected platforms

Android

Affected platform versions

No response

Did you find any workaround?

No

Relevant log output

No response

PauchardThomas commented 2 weeks ago

Associated speedscope (zipped file size too big) dotnet-dsrouter.exe_20240426_164744.speedscope.zip

PauchardThomas commented 4 days ago

Any workaround please ? I don't know how to analyse the speedcope trace.