Package all selectors together for optimized/minified output

[DavidWells]

This is a nifty plugin.

Does it add all those lines to every instance?

or will is gather up all selectors using the all:initial and package the resets together? (for a smaller final output)

[maximkoretskiy]

Thank You. Now it adds initial values in each node without optimisations. It would be nice to add such optimisation. In fact sectors grouping optimisation will be eliminated by gzip compression. Despite this I think plugin should generate more compact and expressive code.

If You want make code more compact now http://cssnano.co/ will be useful

Can You name this issue more clear?

[keithjgrant]

Unfortunately, grouping these selectors together will change the source order, which can affect the cascade behavior. Example:

.unrelated-selector {
  all: initial;
}

.foo {
  color: red;
}

.bar {
  all: initial;
}

Suppose this gets translated to:

.unrelated-selector,
.bar {
  /* all initial resets */
}

.foo {
  color: red;
}

Now, a <div class="foo bar"> will have red text, even though it should be reset to black.

Perhaps it might be worth putting some sort of warning about the weight in the documentation instead, and recommending the author group these themself, so the behavior remains as expected? Or make it opt-in with the config?

[maximkoretskiy]

@keithjgrant Thank You for the suggestion. You are right that it can affect the cascade behaviour. And it is a bad thing if we look on postcss-initial as a polyfill.

In the most of the cases, it is a sign of not very elegant code design if changing of source order affects final styles behaviour. So we can add an ability to group selectors optionally.

I think, the most of the authors would not like the idea to group selectors. A source code will lose declarativity.