CSS 缩小器

什么是 CSS 压缩器以及为什么要关心？

曾经加载过一个网站却感觉很慢吗？也许这是你的互联网。或者也许该网站只是臃肿。大部分膨胀来自于比实际需要大得多的 CSS 文件。输入 CSS 压缩器 - 您安静的幕后英雄，可实现更快的加载时间和更清晰的代码。

CSS 缩小器会采用常规的、可读的 CSS 并删除所有不必要的内容。这意味着注释、额外的空格、换行符，甚至冗余的代码。结果呢？一个较小的文件，可以执行完全相同的操作，但加载速度更快。可以把它想象成旅行的行李：为了以防万一，你不会带三双相同的鞋子。你只带你需要的东西，仅此而已。

优秀 CSS 压缩器的主要特点

• 删除空格和注释 – 不再有不必要的空格或开发人员注释使文件变得混乱。
• 缩短颜色代码 – 在可能的情况下将 #ffffff 转换为 #fff。节省字节而不失去意义。
• 合并重复的规则 – 如果您不小心对同一个类设置了两次样式，一个好的压缩器可以合并它们。
• 优化简写属性 – 转换简写声明，例如 margin-top: 0; margin-right: 0; 变为 margin: 0;。
• 保留功能 – 缩小后的 CSS 应该与原始 CSS 完全一样。没有破坏的布局，没有惊喜。
• 工作速度快 - 无论您是在线使用还是在构建过程中使用它，它都不会减慢您的速度。

常见问题

缩小会破坏我的 CSS 吗？
如果您使用可靠的工具，则不会。大多数现代压缩器都足够聪明，可以避免破坏有效代码。也就是说，为了安全起见，请务必在缩小后测试您的网站。在移动设备和桌面设备上快速刷新通常会发现任何异常情况。

我应该在开发过程中缩小规模吗？
不。在编码时保留原始的、可读的 CSS。仅当您准备好部署时才进行缩小。在投入生产之前使用 PostCSS、Gulp 等工具，甚至在线压缩器。这就像编辑照片 - 您保留高分辨率版本，然后将压缩版本导出到网络。