On 3 Jul, 11:14, Yashgt <yas...@gmail.comwrote:
Quote:
I have a large CSS file which has classes defined such as:
myclass {
margin-right:7px;
margin-top:5px;
padding-bottom:5px;
padding-top:5px;
>
}
>
I would like to reduce the CSS file to its minimum with
- redundant lines removed
- defintion shortened. e,g. the above class should be changed to
margin : 5px 7px 0px 0px;
padding : 5px 0px 5px 0px;
This is a difficult problem, so difficult that it's impractical. It's
certainly not possible to do it (usefully) by processing the CSS
alone.
The trivially simple case of margin-right: <1vs. margin: <4is easy
enough, but just not very useful. It's only easy to do within the
scope of a single block, and if all four values are supplied. If some
of these values are equal, it's still easy to generate the 1,2 or 3
valued version of the margin property.
The problem is though if some of the values _aren't_ supplied. In your
example, margin : 5px 7px 0px 0px; is just wrong - that sets margin-
bottom and margin-left to 0 when previously they hadn't been set at
all.
If you group the CSS properties for blocks with exactly matching
selectors, then you can likely save a bit more (if the CSS was written
in that way, which it often isn't for sophisitcated work). Again
though, you're only able to replace dumb matches of entire sets in CSS
that's _obviously_ inefficient.
Overall, this trivial minimisation is just that: trivial. It might
save a few bytes, but not enough to be worthwhile.
The real optimisation is in realising the properties in one block will
provably never be applied as they're always going to be preceded by
properties in another block with a different selector. This is
computationally difficult and requires knowledge of the entire site -
the HTML as well. Not just one page of HTML, but the whole CSS meta-
structure that applies across the whole site. _IF_ you know that the
"nav-menu" class is only ever applied to HTML elements that are
children of the "header-bar" class, then you can potentially do
simplifications on the basis of this. However this also _changes_ the
behaviour of the CSS (the CSS alone) and a page with a "bare" nav-menu
used outside the header might notice a resultant change in behaviour.
CSS is almost all badly coded. So where a tool is difficult to provide
and only shows a benefiit where the design structure is consistent,
yet slightly inefficient in its coding, then that's a very narrow
margin of usefulness for such a tool.
