Filter by entry point

[chriskrogh]

At Faire, we use @next/bundle-analyzer (which is just a wrapper around webpack-bundle-analyzer) to understand our page weight.
We currently have > 450 "routes" in our next app and the current entrypoint dropdown makes it really difficult for teams to find the route they care about.

it'd be great if we could filter the list of entry points by typing into the input before selecting an option.

[valscion]

Hi! I'm not sure I follow — are you able to post some screenshots or some videos of how the analyzer looks like to you and how it's difficult with this big amount of "routes"?

[chriskrogh]

sure. here's a screen recording. this is on a 16" MBP.

Screen.Recording.2023-11-09.at.7.15.13.AM.mov

the ask here is to be able to type into the input to filter the list (instead of using a simple select tag)

because the list is so long, I find myself needing to inspect element, copy all of the option elements into a text file where I can search for the route I care about. then bisect the list in the UI to eventually find my route.

[valscion]

Oh yeah thanks, now I see!

This select dropdown was added in here:

• Add ability to filter to only initial JS by entrypoint #519

@pas-trop-de-zele would you be interested in trying to make this select dropdown more accessible when the contents of that dropdown get as large as @chriskrogh has here?

@chriskrogh you can also take a look at figuring this out on your own if you'd so want to.

[chriskrogh]

I can give it a go this weekend if @pas-trop-de-zele doesn't get to it before then

[chriskrogh]

#624

[valscion]

The pull request implementing this idea was released in v4.10.0! Thanks again, @chriskrogh ☺️

• Allow filtering the list of entrypoints #624