在将我的主要 css 重构为模块化方法时，我@media all {}用来在 IDE 中包装 css 模块。这种方法使得扫描文件内容变得更加容易，因为我们现在不能使用像 less 或 sass 这样的预处理器。
我唯一担心的是所有这些媒体查询（每个 css 模块/一组连贯选择器一个）可能会在渲染站点时导致性能下降。我不关心我们的 css 文件的文件大小，因为这是一个小型模块化 css 框架和正确压缩的小问题。
如果经常使用媒体查询，@media all {}是否会对性能（台式机和移动/其他）设备产生影响？
答案是否定的……是的。拥有一堆媒体查询不会使网站更难呈现。但是更多的代码行会使文件更大，并且在技术上需要更长的时间来加载。尽管如此，这对性能的影响并不大。
但是在调整浏览器大小时，重新计算一堆不同的 mq 设置会对浏览器造成负担。在此处阅读更多内容：Web 性能：一个或数千个媒体查询？
但是...如果您想对此采取主动，没有预处理器，只需使用Pleeease。Pleeease 为您提供类似于香草 css 的预处理器能力。并且它提供了一个名为 mqpacker 的 PostProcessor 函数。它将在您的样式表中找到所有类似的媒体查询，并将它们合并到相关的媒体查询中。但同样，如果您在服务器上压缩样式表，则无需担心。
祝你好运！保持好状况！