[Feature Request]: Implement virtual list for playlist views

[Lordmau5]

Preflight Checklist

• I use the latest version of YouTube Music (Application).
• I have searched the issue tracker for a feature request that matches the one I want to file, without success.

Problem Description

I wanted to try out YouTube's suggestions algorithm for one of my playlists that has about 800 songs and the "Suggestions" list shows at the end of the playlist.

The problem is that when I scroll down it loads more and more songs, and they are all loaded into the DOM, causing massive slowdowns (because YouTube / Google aren't smart and implemented something like Virtual Lists)

Example DIV height of scrolling all the way to the bottom of said 800 song playlist

Proposed Solution

See if it's possible to wrap the playlist / list of songs in a virtual list renderer.

I know this is quite the ask to fix YouTube's issues, but the slowdowns are making the app quite unbearable.

Alternatives Considered

Not touching the code, as I don't know how much work it'd be to implement something like this

Additional Information

I'm not very familiar with the codebase but I've seen some tsx files so I assume there's React support?

In which case, there probably are quite a few libraries for implementing virtual lists.
I looked at a few but haven't seen them having an event / callback for when the end of the list was reached, though maybe something like that could be implemented from scratch.

Additionally, the height of the elements / songs always seems to be the same so that shouldn't be an issue

[ArjixWasTaken]

funnily enough I've had this idea in the past as well

[ArjixWasTaken]

I'm not very familiar with the codebase but I've seen some tsx files so I assume there's React support?

We are using SolidJS for inserting our own UI into the website, e.g. synced-lyrics.

[ArjixWasTaken]

The biggest issue would be to implement a virtual list w/o having to do any business logic on our side.
If there is a way to hijack the component that renders the playlist view, it would be really easy.

Sadly, youtube music is written using Polymer web-components, which makes it hard to hijack any component at all.

[ArjixWasTaken]

If any polymer god is here to bless us with knowledge, I'd be grateful.

[Lordmau5]

I'm not very familiar with the codebase but I've seen some tsx files so I assume there's React support?

We are using SolidJS for inserting our own UI into the website, e.g. synced-lyrics.

Interesting, the name does ring a bell but I'd need to get somewhat familiar with it first haha

As for implementing it without having to do business logic, I do fear that it might have to be reimplemented from scratch...
But if there's a way this can be done by hooking into it (similar to how you can hook into React instances etc.) then that'd be amazing for sure heh

[JellyBrick]

See #2266 (comment)

[Lordmau5]

Oh wow, yeah turning off the In-App Menu plugin does bring back the performance - albeit at the cost of thick scrollbars (which is a price I'm willing to pay haha)