Giter Site home page Giter Site logo

Remove dublicates about csscomb.js HOT 7 CLOSED

csscomb avatar csscomb commented on May 24, 2024
Remove dublicates

from csscomb.js.

Comments (7)

kizu avatar kizu commented on May 24, 2024

This is not a task for this tool, it should be done using any other available minifier like CSSO.

However, you can always write a plugin for csscomb doing this if you wish.

from csscomb.js.

drgullin avatar drgullin commented on May 24, 2024

CSSO is a great tool for the CSS optimization, but it shrinks all the code and makes it unreadable.

CSSComb is needed to provide a better CSS output, it's all about the quality.
Dublicates removal is one of the parts of making the final code better.

from csscomb.js.

mishanga avatar mishanga commented on May 24, 2024

Duplicates — is about optimization, not coding style.

Additionly, it may work incorrectly in ambiguous cases.
For example there can be such code:

a { color: blue }
a:hover { color: red }
a:visited { color: blue } /* visited link under pointer will be blue */

It can not be tranlated into

a, a:visited { color: blue }
a:hover { color: red } /* visited link under pointer will be red */

because result will be broken.

from csscomb.js.

drgullin avatar drgullin commented on May 24, 2024

That's a structural optimization, I meant a simpler one:

=indent()
  overflow: hidden
  display: block
  text-indent: 100%
  white-space: nowrap

a
  display: block;
  white-space: nowrap
  +indent()

Should be compiled to (dublicates removal and sort order):

a {
  display: block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}

Now this code compiles to:

a {
  display: block;
  display: block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  white-space: nowrap;
}

That's a quite strange coding style.

CSSO shrinks all the code, it doesn't help when a size optimization is not needed.

While there's a "strip-spaces": true option, "strip-dublicates": true won't be a bloat.

CSSComb may erase === synonyms only (' and " should be handled as a same symbols) and keep all the others.

from csscomb.js.

mishanga avatar mishanga commented on May 24, 2024

Should it remove rules with comments?
Like this:

a {
color: red;
color: /* important */ red;
}

Is it equal synonyms?

from csscomb.js.

drgullin avatar drgullin commented on May 24, 2024

Yes, this one too:

color: red; /* important */

It may keep the last match or the one with comment.

from csscomb.js.

mishanga avatar mishanga commented on May 24, 2024
a {
color: /* foo */ red;
color: red; /* bar */
color: red;
}

If you choose one of rules, you'll loose one or both comments.

So, the issue is:

  1. complicated
  2. ambiguous
  3. not about coding style.

Sorry :)

from csscomb.js.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.