UI freezes for 2-3 seconds when loading a carouselview

Question

I have a carouselview binded to a viewmodel, on the previous page (call it first page) user can select 2 arguments and with the help of those, the next view (call it second page) is generated accordingly. However, I can't wrap my head around why my view won't load asynchronously.

So my problem: When I click the button on the first page the UI would freeze for like a solid 2-3 seconds, and then start load (asynchronously?) and once it's done it's all good.

Also I couldn't really figure out a better way to inherit values from first page to second so if someone has an idea please let me know.

Any help on how can I fix this I would really appreciate.

The viewmodel for second page

public class DataSelectionViewModel : BaseViewModel
{
   public ObservableCollection<Items> FilteredData { get; set; }

   public UserSelectionViewModel()
   {
            _dataStore = DependencyService.Get<IDataStore>();

            LoadData= new AsyncAwaitBestPractices.MVVM.AsyncCommand(FilterData);

            FilteredData = new ObservableRangeCollection<Items>();
   }
   public async Task FilterData()
   {
            FilteredData.Clear();
            var filtereddata = await _dataStore.SearchData(Hard, Subject).ConfigureAwait(false);
            foreach (var data in filtereddata)
            { 
                FilteredData.Add(data);
            }
   }  
}

The carouselview in second page

<ContentPage.BindingContext>
    <db:DataSelectionViewModel/>  
</ContentPage.BindingContext>
...
<!-- DataTemplate for carouselview has radiobuttons, label and button all in a grid -->
<CarouselView ItemsSource="{Binding FilteredData}">

Second Page c#

public partial class SecondPage : ContentPage
{

     public Coll(bool hard, string subject)
     {
            InitializeComponent();
            var vm = (BaseViewModel)BindingContext;

            vm.Hard = hard;
            vm.Subject = subject;
            /* had to set "hard" and "subject" here again, otherwise data won't load */
     }

     protected override async void OnAppearing()
     {
         var vm = (DataSelectionViewModel)BindingContext;
         base.OnAppearing();
         await vm.LoadData.ExecuteAsync().ConfigureAwait(false);
     }
}

The first page view containing the button

<Button x:Name="Start" Pressed="ButtonClick"/>

First page c# --> Here I also tried doing it with a command and a pressed at the same time, because I couldn't come up with a way to save variables to second page viewmodel, that's why I use pressed here

private async void ButtonClick(object sender, EventArgs e)
{
   var vm = (BaseViewModel)BindingContext;

   vm.Hard = HardButtonSelected == Hard;
   vm.Subject = vm.Subject.ToLower();

   await Navigation.PushAsync(new SecondPage(vm.Hard, vm.Subject));
   
}

I have tried not using the OnAppearing method to get my data, but then it wouldn't bind to the page and it would not show, if I were to previously fill the ObservableCollection with my data and then load the page although I would love to be able to do this because it would allow me to create a loading popup also.