L
L
lukoie2019-01-04 05:05:13
css
lukoie, 2019-01-04 05:05:13

Should I use a preprocessor other than SCSS?

I decided to dig a little deeper into the history of preprocessors. And there will be a couple of questions for people who could tell.
In a nutshell, the story is such that today there is only
Sass / SCSS, Less, Stylus

  • Sass Initially, the Ruby people came up with the idea of ​​simplifying their lives with styles, and bringing them closer to ruby-like simplicity by removing parentheses, semicolons from sss, and adding buns like mixins, variables and mathematics. This is how Sass was born.
  • LESS But not everyone liked such radicalism, so they came up with the idea to make the same bike with mixins and variables, only leave the syntax like css, with brackets and dots. And so LESS was born.
  • SCSS In Sass, they thought, and decided that they really got excited, so they made that the simplified format would be an alternative, introducing a second syntax option into Sass, also the same as in native css. Thus, SCSS was born. Which is still called Sass. It's just that the first version is considered "indented sass", and both dialects are supported.
  • Stylus But not everyone liked the fact that the revolution "down with brackets and semicolons" was suppressed, so they decided to go further, inventing that it is possible at least this way, that is, in one file to use both pure css syntax style and lightweight. And in general, you can even abolish the colon - the computer will understand what is what, and he will rake all these spells. Thus was born Stylys.
  • alternatives I have small projects in my stash like Myth , Resin , styl , sly , Rework , CSSOnDiet , csscrush , Stylecow , suitcss ,
    and post processors like PostCSS and pleeease

Of course, there is also a "small" difference - if Sass works in ruby ​​(ok, there are implementations for other server languages, and the library is in C), and when you write styles, they need to be compiled, that is, you still give the collected CSS to production, then LESS is already working on JS, so you can simply give it to the browser by connecting the .js file (although you can also collect it).

Here are my questions:
0 there is a well-known annual front-end survey here, where, among other things, we are interested in:
Sass 65.39%,
No Preprocessor 14.58%
PostCSS 8.66%
Less 6.52%
Stylus 2.18%
Other 2.67%
spoiler
q3.jpg


1 In total, there are actually 3 preprocessors. Everywhere on the Internet where preprocessors are discussed, only three are mentioned. Recently, a postCSS handler has been added (for now, let's leave aside the discussion of what pre- and post-processors are, and that in fact in this case they are one and the same, and even rather just "processors", without pre- and post- ).
Do you know any other variants of css preprocessors besides those listed, which would be worth paying attention to and spending time on? Do you use anything other than...sass?

2 Why, since it all started with DRY, did they still return to the usual css "redundant" syntax? After all, neither sass nor stylus, other things being equal, but with a simple clean syntax, have not become as popular as scss and less, which need brackets, quotes and semicolons.

3 why sass won the race against less (even bootstrap switched to sass in version 4), while preprocessing is a bit more tedious than just the ability to connect javascript and give it as is to the client?

4 Why is such a cool stylus, where there are more goodies from a "real programming language", and even has its own frameworks, generally somewhere in the back in terms of the percentage of its use? Even Koala can't compile it. And in VS Studio live reload does not work with it (however, with Sass too, although it works with scss)

5 Does it make sense to use Stylus at all? Or score, and use ssss, like everyone else?

6 interesting article2018, wondering whether preprocessors are needed now, or you can get by with native CSS tools that try to realize the benefits of preprocessors (mathematical expressions, variables, nesting, mixins). Comes to the conclusion that preprocessors are more likely to be needed. And in the comments I give links to articles where noble verstuns tell why they don’t use preprocessors.

7 But there is an opinion that it is enough just to write vanilla CSS, and give it to the postprocessor. I don't get how a postprocessor can replace a preprocessor. That's why someone can abandon sass and switch only to postcss?

Answer the question

In order to leave comments, you need to log in

6 answer(s)
S
Sergey Goryachev, 2016-03-25
@webirus

ul li {
  float: left;
  width: 25%;
}

codepen.io/anon/pen/GZEqWP
What's so special about it?

V
Vasily, 2016-03-25
@xnscripter

ul {
  list-style-type: none;
  width: 800px;
}
ul li a {
  float: left;
  width: 25%;
  padding: 10px 0;
  background: #ddd;
  text-decoration: none;
  color: #000;
}

R
ramzs, 2016-03-26
@ramzs

It is necessary exactly so according to the layout
When I do this
ul li a {
float: left;
width: 25%
}
then it turns out that
the width of the container with the menu is 750px. Enlarge menu container is not an option

P
Pavel Ivannikov, 2019-01-05
@lukoie

At various times I used SASS -> SCSS -> Less -> PostCSS -> SCSS. My personal experience suggests that there is nothing better than PostCSS at the moment.
What is its advantage - you write CSS with JS impurities that bring the functionality you need. You can configure the processor (I did not make a reservation, it is no longer a post-processor) for yourself. Works many times faster, supports css modules. If something is missing, you take it and add it yourself. Pts strong mechanism of plug-ins and functions.
I see two drawbacks - ignoring the tool by the CLI developers (hello to the Angular-cli team, whose mind was only enough to use the autoprefixer) and ignoring by JetBrains, who could not breed for adequate support for this tool. Now I have successfully moved from IDEA to vsc.
Conclusion: SCSS is good and sufficient, SASS is ruby ​​on rails only, Less is perhaps no longer relevant, PostCSS is still a little better than SCSS and offers a different and more convenient mechanism for working with CSS (I recommend trying it after learning scss).
PS Purely my opinion based on experience, I do not impose. It's stupid to chill

D
Dmitry Dart, 2019-01-04
@gobananas

I don't think it's worth it. You can see. You will still seriously apply only one of them in your work, which means why waste a lot of time.

S
Sanes, 2019-01-05
@Sanes

I think LESS will be enough for you if you ask such a question. The same Uikit3 is written in LESS and SASS . The framework will be more abruptly there than the bootstrap.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question