复用

正如 Harry Roberts 所说， DRY 经常被误解为永远不要重复同样的事情两次。这是不切实际的，通常会适得其反，并可能导致代码的强制抽象、过度思考和过度设计。

这种强制抽象，过度思考，过度设计的代码在视觉和原子 class 中经常出现。我们知道这有多痛苦，我们之前在语义化章节讨论过。混合（Mixins）同样也会成为问题。

我们经常尝试对 CSS 进行过多过快的抽象，当我们尝试复用的时候，肯定是需要进行几次抽象的。问题来了, 我们如何复用样式？

我们该如何复用一个样式？

如果我们想复用一个样式，一个选择是用逗号分隔多个选择器，在 SASS 中可以使用 @extends 实现。例如多个元素的文字要是红色，我们可以这样做：

.someThing,
.anotherThing {
  color: red;
}

这种方法主要是用起来方便，而不是为了性能。(如果抽象只有一个规则，它也是简单的把这一行代码交给了另一个选择器。)

如果选择器偏离了抽象中的规则，那么它应该从列表中删除。否则，可能会回归影响其他选择器，甚至可能出现样式覆盖问题。

值得注意的是，这是我们可以使用的几种技术之一。当一个事物被很好的理解我们也可以使用其他技术，我们将会在模块, 状态 and 修饰器中讨论。

Mixins 是个好东西，至少在理论上它是。

像实用 class，更新一个 mixin 会广播作用到所有的实例。如果没有一个控制器来管理使用的 mixin, 我们就增加了回归的风险。如果不这么做，我们可以创建另一个 class，不过这样就导致了冗余。

同样，mixins 在多个规则，多个参数和条件下，很容易得到很多结果。这很复杂。复杂就很难维护。

为了降低复杂度，我们可以创建细粒度的 mixins, 例如表示红色文本。咋一看这挺好。但是这个红色 mixin 的声明，不是和规则本身，例如color: red一样吗？

如果我们要更新多个地方的规则，搜索和替换应该足够了。同样的，当 mixin 红色变为黄色, 无论如何，它的名字也需要更新。

说了那么多，mixins 还是很有用的。我们可能，例如想要应用 clearfix 规则跨越不同的元素和某些断点。这是原生 CSS 做不到的。

总之， mixins 不坏，我们应该明智而审慎地使用它。

当涉及到性能时，我们会把事情复杂化。我们沉迷于最小的细节。

即便是 CSS 总大小超过了 100kb，在整个项目中，为了 DRYness 付出大量的精力但是收效甚微。正如我们所讨论的，使 CSS 小了但是 HTML 更大了。

压缩一张图片带来的效益更好。正如我们所讨论的，解决其他形式的冗余来改善可维护性和性能。

尝试复用，例如 float: left，类似于尝试在 JS 对象中复用变量名。这根本就没有违反 DRY。

追求 DRY 导致过度思考和过度设计的代码。这样做，我们使维护更加困难，而不是更容易。我们应该专注于重用有形的模块，而不是沉迷于样式。我们将在接下来的章节中讨论。