Giters

purifycss / purifycss

Remove unused CSS. Also works with single-page apps.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

v2 proposal

Ffloriel opened this issue · comments

commented

I've been working on a complete reimplementation of purifycss.
I will try to explain the ideas behind the implementation and provide a checklist for the potential completion of the v2.

The implementation is more modular than the previous one. It is based on extracters, extracters are just a function that takes a string (like html content) and return an array of css selectors.
Purifycss will then use the array of selectors to keep only the one used.

The extracter will be specific to a type of file (html, js, pug), making it more accurate and fixing some issues that purifycss currently has (#131, #145, #147, ...)

Those extracters can be external of purifycss, imported on specified in the configuration.
A default extracter will also be present and will have the same effect as the current purifycss.

The implementation uses postcss and it seems to fix css compatibily issues like #151

  • Purifycss new architecture (in progress)
  • Setting file (#164)
  • whitelist comment in css (#137)
  • html extracter
  • Plugins (webpack, gulp, grunt, ...)
  • Website (documentation)

By writing this issue, I am looking for suggestions, feedback, potential features to add so feel free to respond to the comment.
@Illyism, I also want to know what you think of those changes of course, to be sure it is not an unwanted modification.

commented

Watch out for issue #184 also: at least in HTML you should ideally avoid randomly retaining classes based on text fragments in HTML comment, actual human-readable text, and other attributes such as id that can't be classes. Maybe walk the DOM tree for HTML files and only match in the elements that could contain real class references?

commented

@DamonHD I moved away from purifycss to have more control over the project (versioning, release, maintaining). It is still a work in progress but you can try purgecss.
A documentation website is on the way with more tools and explanation about the differences with purifycss. The readme contains some explanation already.

commented

Thanks, I shall have a look.