From 7159c8ffed0d2329e2beaa7fd03cfc08c802679b Mon Sep 17 00:00:00 2001
From: Kevin Matsubara <kevin.matsubara@proton.me>
Date: Wed, 26 Mar 2025 00:09:03 +0100
Subject: [PATCH] Replace foreach loop with Virtualize component.

Improves performance greatly when lots of li elements are to be created. Note that every li should have the same height in pixels in order for the Virtualize component to work properly.
---
 ServerManagement/Components/Pages/Servers.razor | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/ServerManagement/Components/Pages/Servers.razor b/ServerManagement/Components/Pages/Servers.razor
index c333000..34e5b0d 100644
--- a/ServerManagement/Components/Pages/Servers.razor
+++ b/ServerManagement/Components/Pages/Servers.razor
@@ -36,8 +36,7 @@
 <br/>
 
 <ul>
-  @foreach(var server in servers)
-  {
+  <Virtualize Items="this.servers" Context="server">
     <li @key="server.Id">
       @server.Name in @server.City is
       <span style="color:@(server.IsOnline ? "green" : "red")">
@@ -53,7 +52,7 @@
         <button type="submit" class="btn btn-danger">Delete</button>
       </EditForm>
     </li>
-  }
+  </Virtualize>
 </ul>
 
 @code {