更少的 CSS 行以获得更好的性能？答案

【问题标题】：Less CSS lines for better performance?更少的 CSS 行以获得更好的性能？
【发布时间】：2015-09-07 15:48:18
【问题描述】：

显然有两组编码员：

第一组：

#wrapper {
	margin: 0 auto;
}

第 2 组：

#wrapper {margin: 0 auto;}

什么方法最有效？第 2 组是否因为行数较少而获得更好的性能？

【问题讨论】：

【解决方案1】：

解析器将从上到下读取文件。因此，它必须阅读的行越少越好。在性能方面，第二个例子更胜一筹。但是缩小完全消除了这个问题。

【讨论】：

【解决方案2】：

请考虑您的两个示例，其中包含多个规则：

第 1 组：

#wrapper {
    margin: 0 auto;
    padding: 10px 5px;
    text-transform: uppercase;
}

第 2 组：

#wrapper { margin: 0 auto; padding: 10px 5px; text-transform: uppercase; }

第一种方法更容易维护，并且对维护者（通常是人工，并不总是保证）更具可读性。如果您minify您的 CSS 和 JavaScript，那么您的写作风格将无关紧要，因为缩小会为您解决这些问题。尝试将我的第 1 组代码粘贴到 cssminifier.com 上，看看会发生什么。

【讨论】：

【解决方案3】：

是的，它提高了性能，因此存在缩小工具。也就是说，不要在这样的一行中开始开发代码，因为没有可读性。

为了可读性而写出你正在做的代码，然后按照评论者所说的那样缩小结果。

【讨论】：