Merge pull request #14682 from peppy/fix-playlist-listing-performance

Improve multiplayer lounge listing performance

osu.Game.Tests/Visual/Multiplayer/TestSceneDrawableRoom.cs

@@ -130,6 +130,8 @@ namespace osu.Game.Tests.Visual.Multiplayer
                 Type = { Value = MatchType.HeadToHead },
             }));
 
+            AddUntilStep("wait for panel load", () => drawableRoom.ChildrenOfType<RecentParticipantsList>().Any());
+
             AddAssert("password icon hidden", () => Precision.AlmostEquals(0, drawableRoom.ChildrenOfType<DrawableRoom.PasswordProtectedIcon>().Single().Alpha));
 
             AddStep("set password", () => room.Password.Value = "password");

osu.Game.Tests/Visual/Playlists/TestScenePlaylistsLoungeSubScreen.cs

@@ -32,6 +32,12 @@ namespace osu.Game.Tests.Visual.Playlists
 
         private RoomsContainer roomsContainer => loungeScreen.ChildrenOfType<RoomsContainer>().First();
 
+        [Test]
+        public void TestManyRooms()
+        {
+            AddStep("add rooms", () => RoomManager.AddRooms(500));
+        }
+
         [Test]
         public void TestScrollByDraggingRooms()
         {

osu.Game/Screens/OnlinePlay/Lounge/Components/DrawableRoom.cs

@@ -43,6 +43,8 @@ namespace osu.Game.Screens.OnlinePlay.Lounge.Components
         private PasswordProtectedIcon passwordIcon;
         private EndDateInfo endDateInfo;
 
+        private DelayedLoadWrapper wrapper;
+
         public DrawableRoom(Room room)
         {
             Room = room;
@@ -63,6 +65,14 @@ namespace osu.Game.Screens.OnlinePlay.Lounge.Components
         [BackgroundDependencyLoader]
         private void load(OverlayColourProvider colours)
         {
+            ButtonsContainer = new Container
+            {
+                Anchor = Anchor.CentreRight,
+                Origin = Anchor.CentreRight,
+                RelativeSizeAxes = Axes.Y,
+                AutoSizeAxes = Axes.X
+            };
+
             InternalChildren = new[]
             {
                 // This resolves internal 1px gaps due to applying the (parenting) corner radius and masking across multiple filling background sprites.
@@ -75,155 +85,153 @@ namespace osu.Game.Screens.OnlinePlay.Lounge.Components
                 {
                     d.RelativeSizeAxes = Axes.Both;
                 }),
-                new Container
+                wrapper = new DelayedLoadWrapper(() =>
-                {
+                    new Container
-                    Name = @"Room content",
-                    RelativeSizeAxes = Axes.Both,
-                    // This negative padding resolves 1px gaps between this background and the background above.
-                    Padding = new MarginPadding { Left = 20, Vertical = -0.5f },
-                    Child = new Container
                     {
+                        Name = @"Room content",
                         RelativeSizeAxes = Axes.Both,
-                        Masking = true,
+                        // This negative padding resolves 1px gaps between this background and the background above.
-                        CornerRadius = CORNER_RADIUS,
+                        Padding = new MarginPadding { Left = 20, Vertical = -0.5f },
-                        Children = new Drawable[]
+                        Child = new Container
                         {
-                            new GridContainer
+                            RelativeSizeAxes = Axes.Both,
+                            Masking = true,
+                            CornerRadius = CORNER_RADIUS,
+                            Children = new Drawable[]
                             {
-                                RelativeSizeAxes = Axes.Both,
+                                new GridContainer
-                                ColumnDimensions = new[]
                                 {
-                                    new Dimension(GridSizeMode.Relative, 0.2f)
+                                    RelativeSizeAxes = Axes.Both,
-                                },
+                                    ColumnDimensions = new[]
-                                Content = new[]
-                                {
-                                    new Drawable[]
                                     {
-                                        new Box
+                                        new Dimension(GridSizeMode.Relative, 0.2f)
-                                        {
-                                            RelativeSizeAxes = Axes.Both,
-                                            Colour = colours.Background5,
-                                        },
-                                        new Box
-                                        {
-                                            RelativeSizeAxes = Axes.Both,
-                                            Colour = ColourInfo.GradientHorizontal(colours.Background5, colours.Background5.Opacity(0.3f))
-                                        },
-                                    }
-                                }
-                            },
-                            new Container
-                            {
-                                Name = @"Left details",
-                                RelativeSizeAxes = Axes.Both,
-                                Padding = new MarginPadding
-                                {
-                                    Left = 20,
-                                    Vertical = 5
-                                },
-                                Children = new Drawable[]
-                                {
-                                    new FillFlowContainer
-                                    {
-                                        AutoSizeAxes = Axes.Both,
-                                        Direction = FillDirection.Vertical,
-                                        Children = new Drawable[]
-                                        {
-                                            new FillFlowContainer
-                                            {
-                                                AutoSizeAxes = Axes.Both,
-                                                Direction = FillDirection.Horizontal,
-                                                Spacing = new Vector2(5),
-                                                Children = new Drawable[]
-                                                {
-                                                    new RoomStatusPill
-                                                    {
-                                                        Anchor = Anchor.CentreLeft,
-                                                        Origin = Anchor.CentreLeft
-                                                    },
-                                                    specialCategoryPill = new RoomSpecialCategoryPill
-                                                    {
-                                                        Anchor = Anchor.CentreLeft,
-                                                        Origin = Anchor.CentreLeft
-                                                    },
-                                                    endDateInfo = new EndDateInfo
-                                                    {
-                                                        Anchor = Anchor.CentreLeft,
-                                                        Origin = Anchor.CentreLeft,
-                                                    },
-                                                }
-                                            },
-                                            new FillFlowContainer
-                                            {
-                                                AutoSizeAxes = Axes.Both,
-                                                Padding = new MarginPadding { Top = 3 },
-                                                Direction = FillDirection.Vertical,
-                                                Children = new Drawable[]
-                                                {
-                                                    new RoomNameText(),
-                                                    new RoomHostText(),
-                                                }
-                                            }
-                                        },
                                     },
-                                    new FillFlowContainer
+                                    Content = new[]
                                     {
-                                        Anchor = Anchor.BottomLeft,
+                                        new Drawable[]
-                                        Origin = Anchor.BottomLeft,
-                                        AutoSizeAxes = Axes.Both,
-                                        Direction = FillDirection.Horizontal,
-                                        Spacing = new Vector2(5),
-                                        Children = new Drawable[]
                                         {
-                                            new PlaylistCountPill
+                                            new Box
                                             {
-                                                Anchor = Anchor.CentreLeft,
+                                                RelativeSizeAxes = Axes.Both,
-                                                Origin = Anchor.CentreLeft,
+                                                Colour = colours.Background5,
                                             },
-                                            new StarRatingRangeDisplay
+                                            new Box
                                             {
-                                                Anchor = Anchor.CentreLeft,
+                                                RelativeSizeAxes = Axes.Both,
-                                                Origin = Anchor.CentreLeft,
+                                                Colour = ColourInfo.GradientHorizontal(colours.Background5, colours.Background5.Opacity(0.3f))
-                                                Scale = new Vector2(0.8f)
+                                            },
+                                        }
+                                    }
+                                },
+                                new Container
+                                {
+                                    Name = @"Left details",
+                                    RelativeSizeAxes = Axes.Both,
+                                    Padding = new MarginPadding
+                                    {
+                                        Left = 20,
+                                        Vertical = 5
+                                    },
+                                    Children = new Drawable[]
+                                    {
+                                        new FillFlowContainer
+                                        {
+                                            AutoSizeAxes = Axes.Both,
+                                            Direction = FillDirection.Vertical,
+                                            Children = new Drawable[]
+                                            {
+                                                new FillFlowContainer
+                                                {
+                                                    AutoSizeAxes = Axes.Both,
+                                                    Direction = FillDirection.Horizontal,
+                                                    Spacing = new Vector2(5),
+                                                    Children = new Drawable[]
+                                                    {
+                                                        new RoomStatusPill
+                                                        {
+                                                            Anchor = Anchor.CentreLeft,
+                                                            Origin = Anchor.CentreLeft
+                                                        },
+                                                        specialCategoryPill = new RoomSpecialCategoryPill
+                                                        {
+                                                            Anchor = Anchor.CentreLeft,
+                                                            Origin = Anchor.CentreLeft
+                                                        },
+                                                        endDateInfo = new EndDateInfo
+                                                        {
+                                                            Anchor = Anchor.CentreLeft,
+                                                            Origin = Anchor.CentreLeft,
+                                                        },
+                                                    }
+                                                },
+                                                new FillFlowContainer
+                                                {
+                                                    AutoSizeAxes = Axes.Both,
+                                                    Padding = new MarginPadding { Top = 3 },
+                                                    Direction = FillDirection.Vertical,
+                                                    Children = new Drawable[]
+                                                    {
+                                                        new RoomNameText(),
+                                                        new RoomHostText(),
+                                                    }
+                                                }
+                                            },
+                                        },
+                                        new FillFlowContainer
+                                        {
+                                            Anchor = Anchor.BottomLeft,
+                                            Origin = Anchor.BottomLeft,
+                                            AutoSizeAxes = Axes.Both,
+                                            Direction = FillDirection.Horizontal,
+                                            Spacing = new Vector2(5),
+                                            Children = new Drawable[]
+                                            {
+                                                new PlaylistCountPill
+                                                {
+                                                    Anchor = Anchor.CentreLeft,
+                                                    Origin = Anchor.CentreLeft,
+                                                },
+                                                new StarRatingRangeDisplay
+                                                {
+                                                    Anchor = Anchor.CentreLeft,
+                                                    Origin = Anchor.CentreLeft,
+                                                    Scale = new Vector2(0.8f)
+                                                }
                                             }
                                         }
                                     }
-                                }
-                            },
-                            new FillFlowContainer
-                            {
-                                Name = "Right content",
-                                Anchor = Anchor.CentreRight,
-                                Origin = Anchor.CentreRight,
-                                AutoSizeAxes = Axes.X,
-                                RelativeSizeAxes = Axes.Y,
-                                Spacing = new Vector2(5),
-                                Padding = new MarginPadding
-                                {
-                                    Right = 10,
-                                    Vertical = 20,
                                 },
-                                Children = new Drawable[]
+                                new FillFlowContainer
                                 {
-                                    ButtonsContainer = new Container
+                                    Name = "Right content",
+                                    Anchor = Anchor.CentreRight,
+                                    Origin = Anchor.CentreRight,
+                                    AutoSizeAxes = Axes.X,
+                                    RelativeSizeAxes = Axes.Y,
+                                    Spacing = new Vector2(5),
+                                    Padding = new MarginPadding
                                     {
-                                        Anchor = Anchor.CentreRight,
+                                        Right = 10,
-                                        Origin = Anchor.CentreRight,
+                                        Vertical = 20,
-                                        RelativeSizeAxes = Axes.Y,
-                                        AutoSizeAxes = Axes.X
                                     },
-                                    recentParticipantsList = new RecentParticipantsList
+                                    Children = new Drawable[]
                                     {
-                                        Anchor = Anchor.CentreRight,
+                                        ButtonsContainer,
-                                        Origin = Anchor.CentreRight,
+                                        recentParticipantsList = new RecentParticipantsList
-                                        NumberOfCircles = NumberOfAvatars
+                                        {
+                                            Anchor = Anchor.CentreRight,
+                                            Origin = Anchor.CentreRight,
+                                            NumberOfCircles = NumberOfAvatars
+                                        }
                                     }
-                                }
+                                },
+                                passwordIcon = new PasswordProtectedIcon { Alpha = 0 }
                             },
-                            passwordIcon = new PasswordProtectedIcon { Alpha = 0 }
                         },
-                    },
+                    }, 0)
-                },
+                {
+                    RelativeSizeAxes = Axes.Both,
+                }
             };
         }
 
@@ -231,23 +239,28 @@ namespace osu.Game.Screens.OnlinePlay.Lounge.Components
         {
             base.LoadComplete();
 
-            roomCategory.BindTo(Room.Category);
+            wrapper.DelayedLoadComplete += _ =>
-            roomCategory.BindValueChanged(c =>
             {
-                if (c.NewValue == RoomCategory.Spotlight)
+                wrapper.FadeInFromZero(200);
-                    specialCategoryPill.Show();
-                else
-                    specialCategoryPill.Hide();
-            }, true);
 
-            roomType.BindTo(Room.Type);
+                roomCategory.BindTo(Room.Category);
-            roomType.BindValueChanged(t =>
+                roomCategory.BindValueChanged(c =>
-            {
+                {
-                endDateInfo.Alpha = t.NewValue == MatchType.Playlists ? 1 : 0;
+                    if (c.NewValue == RoomCategory.Spotlight)
-            }, true);
+                        specialCategoryPill.Show();
+                    else
+                        specialCategoryPill.Hide();
+                }, true);
 
-            hasPassword.BindTo(Room.HasPassword);
+                roomType.BindTo(Room.Type);
-            hasPassword.BindValueChanged(v => passwordIcon.Alpha = v.NewValue ? 1 : 0, true);
+                roomType.BindValueChanged(t =>
+                {
+                    endDateInfo.Alpha = t.NewValue == MatchType.Playlists ? 1 : 0;
+                }, true);
+
+                hasPassword.BindTo(Room.HasPassword);
+                hasPassword.BindValueChanged(v => passwordIcon.Alpha = v.NewValue ? 1 : 0, true);
+            };
         }
 
         protected override IReadOnlyDependencyContainer CreateChildDependencies(IReadOnlyDependencyContainer parent)

osu.Game/Screens/OnlinePlay/Lounge/DrawableLoungeRoom.cs

@@ -83,12 +83,10 @@ namespace osu.Game.Screens.OnlinePlay.Lounge
         {
             base.LoadComplete();
 
-            if (matchingFilter)
+            Alpha = matchingFilter ? 1 : 0;
-                this.FadeInFromZero(transition_duration);
+            selectionBox.Alpha = SelectedRoom.Value == Room ? 1 : 0;
-            else
-                Alpha = 0;
 
-            SelectedRoom.BindValueChanged(updateSelectedRoom, true);
+            SelectedRoom.BindValueChanged(updateSelectedRoom);
         }
 
         private void updateSelectedRoom(ValueChangedEvent<Room> selected)