zoukankan      html  css  js  c++  java
  • MaintainableCSS 《可维护性 CSS》 --- 复用篇

    复用

    通常,Harry Roberts 所说的 DRY (Don't repeat yourself) 经常被曲解成永远不要重复做通一件事。 但实际上这是不现实的,而且常常导致过分抽象,用太多的精力去过分优化代码,最后得不偿失。

    过度抽象化代码有多痛苦,在 语义篇 已经讲过了,Mixins 也是一个问题。

    同时我们要去考虑抽象, 我们怎么办呢?

    如何复用 Style ?

    一种做法是用逗号分隔符实现,例如:

    .someThing,
    .anotherThing {
        color: red;
    }
    

    这就是一个简单的复用技术,关于其他的复用技术,我们会在模块篇,状态篇,修饰符篇讨论。

    有关 Mixins

    就像工具类一样,修改 mixins 后会自动作用到所有的实例。

    同时 mixins 容易致使多个规则,多参数和多条件。这导致后期难以维护。

    为了降低复杂度,我们会创建小粒度的 mixins ,例如,作用红色文本 (red text) 。期初开起来不错,但是这并非是 red mixins 声明,更像一个规则本身。color: red?

    如果我们需要在多个地方更新规则,搜索和替换就非常必要了,此外,当 red mixin 变为 orange 时,其名称都要更新。

    所以,mixins 很不错,我们应该使用它,但是要明智地使用它。

    有关 Performance

    如果 css 超过了 100kb, 再进行盲目的 DRY ,收效就不是很大了,我们要做的就是使 css 更小,才能使 HTML 更强大。

    压缩图片能显著提高性能。这就是我想表达的,解决其他形式的冗余可以提高维护性和性能。

    违反 DRY 的原则

    例如,如果尝试复用 float:left,就像在不同的 Javascript 对象中复用变量名,这也是不可取的。

    最后总结

    DRY 如果导致过度抽象和过度编程, 我们会难以维护。所有,我们不应该痴迷它的形式,而应该关注于复用具体的模块。我会在以后章节中说明这些。

  • 相关阅读:
    csuoj 1111: 三家人
    csu oj 1339: 最后一滴血
    csuoj 1337: 搞笑版费马大定理
    csuoj 1334: 好老师
    csu oj 1330 字符识别?
    C++动态内存分配
    变量内存分配
    codevs 2235 机票打折
    contesthunter CH Round #64
    面试分享:一年经验初探阿里巴巴前端社招
  • 原文地址:https://www.cnblogs.com/lvyongbo/p/7109951.html
Copyright © 2011-2022 走看看