When comparing cssnext vs CSS-On-Diet, the Slant community recommends cssnext for most people. In the question“What are the best CSS preprocessors/postprocessors?” cssnext is ranked 5th while CSS-On-Diet is ranked 15th. The most important reason people chose cssnext is:
cssnext is a PostCSS plugin, which makes it pretty easy to use for people who are already using PostCSS.
Ranked in these QuestionsQuestion Ranking
Pros
Pro Built on PostCSS
cssnext is a PostCSS plugin, which makes it pretty easy to use for people who are already using PostCSS.
Pro JavaScript-based
Because the parser/compiler can function in a web browser, it can be used with systems that cannot run similar technology on the server. For example, you could build a WordPress plugin with a front-end application that transforms CSS.
Pro No need to learn a new syntax
Since css-next only adds new CSS features in a way that all browsers can support it, it's still CSS. So there's no need to learn any new syntax.
Pro Fast to read and write CSS
Works like Emmet, shorting CSS keywords, but it's not limited only to writing. Also modifying and reading COD(CSS-On-Diet) files is faster.
Pro Easy to learn and use
Doesn't require programming skill to work with variables, mixins, media breakpoints
Cons
Con Lack of support in IDEs
Currently there is very little support for syntax highlighting when writing PostCSS plugins.
Con It's difficult adjusting to different keywords
The keywords are shortened to 3 letters. For example, "background-color" becomes "bac" and "max-width" becomes "maw". These keywords are far less intuitive than their original form and make the CSS much less readable for those who don't know CSS-On-Diet.
Con Extremely limited adoption
CSS-On-Diet has just 7 stars on Github and a very small adoption rate. For an open source project this usually means less bugs reported, lesser documentation and few third-party learning resources.