Fix very laggy Sources tab in DevTools when using "Patch all" in Spacepack

[uwx]

The problem: DevTools Sources tab is incredibly laggy
The cause: Using "Patch all" creates hundreds of thousands of modules in one directory which is a lot to render in the sidebar and the list isn't virtualized
The solution: Group patched webpack modules by the first 3 chars of the ID, reducing the amount of rendered files in the sidebar

Also my moonbase disappeared but I reverted my changes and it's still gone so maybe unrelated? I need to test if the crash screen works properly but I can't install Crash Me right now. it was my fault

[uwx]

crashScreen is working, PR is now ready for review.

[NotNite]

I'm worried about merging something like this because of potential breakage of other things around the ecosystem, but this seems small enough that it's probably fine.

[uwx]

I'm worried about merging something like this because of potential breakage of other things around the ecosystem, but this seems small enough that it's probably fine.

Definitely aware, but I've been rolling with this patch for a few days now and nothing terrible has happened (besides crash screen which had to be fixed, obviously)

[Cynosphere]

I think it would just be better to split on the boundary of "Webpack-Module" instead of the first 3 of the module ID.

[uwx]

I think it would just be better to split on the boundary of "Webpack-Module" instead of the first 3 of the module ID.

How do you mean? The thing that causes the performance issue is the fact that all the modules are in "the same directory" as far as DevTools sees it. So it needs to be keyed somehow.

[Cynosphere]

It's something we can't truly solve because its an upstream issue we're merely trying to work around. Any and all solutions are not going to be desireable.

I guess a better solution would be something close to how most hashed object storage works where it usually splits by the first two into a folder instead of splitting the entire string where it could lead to confusion

[uwx]

it usually splits by the first two into a folder instead of splitting the entire string where it could lead to confusion

So instead of Webpack-Module-123/12345 you want 123/Webpack-Module-12345? That can be done

[Cynosphere]

I was under the assumption it was splitting like Webpack-Module-123/45. But in my specific example I would just add another / so its Webpack-Module/123/12345

[uwx]

Did the requested changes, should be good now

[uwx]

By the way, have an idea of how the DevTools Sources tab looks with these patches: