[system] Unnecessary media query with 0px breakpoints about material-ui

[yasminebeji]

Hi @aarongarciah, I've been pondering the issue with unnecessary media queries at 0px breakpoints. Is there a specific reason why these queries are generated, even for values like 0px, 0rem, or 0em? It seems like an intriguing challenge to optimize CSS bundle size without compromising on design flexibility.

[aarongarciah]

@yasminebeji the API/developer experience will be kept intact; this would be an internal optimization. It probably requires some changes in how breakpoints are translated into media queries.

[brijeshb42]

@yasminebeji With the current implementation, even with the change to remove the 0px media query, it won't affect the bundle size in any way for emotion/@mui/system since these are generated at runtime.
But it will definitely help Pigment CSS reduce the generated CSS bundle size since internally, Pigment also uses @mui/system.
This might have been overlooked during the initial implementation. That could explain why these are generated.