pleeease icon indicating copy to clipboard operation
pleeease copied to clipboard

Remove duplication feature

Open raphaelgoetter opened this issue 11 years ago • 7 comments

En plus de combiner les MQ et minifier CSS en général, il pourrait être très intéressant de regrouper les règles identiques.

Par exemple :

/* layout.css */
.truc {
  width: 100%;
}
/* colors.css */
.truc {
  color: #184894;
}

Deviendrait :

/* build.css */
.truc {
  width: 100%;
  color: #184894;
}

Comme ce n'est pas anodin, il faudrait que ce soit une option non appliquée par défaut.

raphaelgoetter avatar Nov 17 '14 15:11 raphaelgoetter

En attendant de mettre en place une solution viable dans Pleeease, tu peux regarder CSS Shrink qui fait ça très bien.

7studio avatar Nov 17 '14 15:11 7studio

@7studio Ah oui il est pas mal effectivement, mais pas parfait non plus :

body {
    color: red;
}

/* layout.css */
.truc {
  width: 100%;
}

/* colors.css */
.truc {
  color: #184894;
}

body {
    color: green;
}

va être compilé ainsi :

body{color:red}.truc{width:100%;color:#184894}body{color:green}

raphaelgoetter avatar Nov 17 '14 15:11 raphaelgoetter

@raphaelgoetter Excuse moi pour cette mauvaise information (et ma mauvaise compréhension) :confused: CSS Shrink combine uniquement les choses similaires adjacentes (cf. : http://cssshrink.com/velocity/#53) :disappointed_relieved: Ça n'a plus grand intérêt finalement mais voici un début d'explication : https://github.com/stoyan/cssshrink/issues/7#issuecomment-47508577.

7studio avatar Nov 17 '14 15:11 7studio

C'est effectivement pas évident dans tous les cas, et l'intérêt est somme toute limité (Gzip fait ça déjà très bien). Par contre, on se rapproche d'un linter qui créerait une sorte de feuille de route des bonnes pratiques / retours / optimisation à réaliser, plutôt qu'un outil 100% automatique. Est-ce que ce genre de retours seraient intéressant?

iamvdo avatar Nov 18 '14 22:11 iamvdo

Est-ce que ce genre de retours seraient intéressant?

Mouais, sans plus. (en ce qui me concerne, j'ai déjà des lint directement dans l'IDE)

raphaelgoetter avatar Nov 19 '14 13:11 raphaelgoetter

Ca me parait dangereux comme jeux. Un linter en complément à plus de sens que d'intégrer ça ici.

MoOx avatar Nov 19 '14 13:11 MoOx

Il y a maintenant un module pour ça: https://www.npmjs.com/package/postcss-discard-duplicates Toujours pas fan, mais permet de tester les edge-case...

iamvdo avatar Mar 26 '15 13:03 iamvdo