Autoprefixer vs LESS/Sass mixins? [closed]

Question

The autoprefixer tool is a CSS post-processor that adds the correct vendor prefixes to otherwise 'naive' style declarations.

How does this compare (in terms of effectiveness and developer experience) to mixins provided by LESS and Sass for this same goal of generating vendor-specific styles?

Answer 1

LESS and Sass both have various frameworks and libraries you can integrate into your workflow, most of which include some kind of prefixing mixin, so you will very likely get the same results from either method, and if that's the only thing you use it for, then it probably won't matter which one you use.

Where LESS and Sass get their power is in all the other things they can do, including things like declaration nesting, variables, loops, and other mixins, which may or may not be what you need for a given project.

With this power, of course, comes differences in syntax - you start moving away from native CSS, including the syntax for handling prefixes. In LESS and Sass, if you want to have vendor prefixes on something, you generally go through the @mixin syntax. This is the main difference in "developer experience" that you're going to see, but again, LESS and Sass are larger tools than autoprefixer, so you're probably going to be taking the mixin syntax in part and parcel with the other syntax changes.

In other words - use tools like autoprefixer or prefixr if all you're using is the prefixing, and use LESS or Sass if you want to use the other features.