I was looking through CodePen's "popular pens" and I noticed this cool little spiral animation somebody made with a seemingly ridiculously small amount of code.

This is quite impressive until you click the headings for HTML and CSS to show the "compiled" versions of the same code. Suddenly the 3 lines of HAML and ~40 lines of SCSS turns into a gigantic monster of repetition. Here's where my question comes in:

Is it acceptable to do something like this in practice? Don't get me wrong - I love using preprocessors to help me write code faster, but in some cases it looks like it's an automatic copy-paste machine.

  • 1
    In what practice? Sometimes that trade off is worth it, usually it's not. – Telastyn Oct 26 '13 at 3:32
  • I'm talking about production websites, which really leans towards "no" to me. Using that much code in production is going to slow everything down. – Scott Oct 26 '13 at 3:35
  • 2
    There's two types of "code that generates code" that I know of - one is when code is compiled into a more verbose form and that form is saved/used, the other is when the code is generated dynamically on the fly during runtime. Both are good for different things. Are you asking an overarching question that encompasses all these types, or one specific version? – Izkata Oct 26 '13 at 4:58
  • @Izkata If I understand correctly, he means the former. – Radu Murzea Oct 26 '13 at 5:01
  • @Jaxo well apparently there aren't any haml/scss interpreting browsers yet, so to me, the code generation is unavoidable. – nurettin Oct 26 '13 at 6:56

A few things:

  • A compiler is a code generator, it takes a high level language and creates assembly or bytecode
  • Generated code is usually not as optimized as code written directly because despite of all the optimizations the compiler just doesn't understand the big picture all that well.
  • The code that is used to generate code is often shorter, more concise and easier to understand which leads to considerably less errors and easier maintenance.

In my opinion it comes down to one of the fundamental trade-offs for programming languages: optimality of result vs programmer productivity. And by optimality I also mean things relevant in this case like the size of the resulting site which has to be downloaded.

In general "code that generates code" is great.

  • 2
    Or, in other words, do you want to maintain 3 lines of HAML or 50 lines of HTML? It doesn't really matter that the HAML "compiles" into 200 lines of HTML, because you don't consume that, only the machine does. Unless the generated code is unacceptable in terms of performance or bandwidth, it's not even worth considering. – Aaronaught Oct 26 '13 at 12:57

HTML and CSS are not programming languages. So HTML and CSS are not code in the same sense that the HAML and LESS compilers are code. So the conversion from HAML to HTML and LESS to CSS is not 'code generating code'. It is code generating data. To get a browser to display a complex graphic, a lot of DOM elements must be created. Using HAML and LESS allows them to be generated automatically from a simple specification. This is good.

  • 3
    I don't get the "HTML and CSS are not programming languages" bit and also think that it's irrelevant to the core of your point. HTML + CSS are in fact turing complete. Rather than making some disputable distinctions, I think you should base your argument simply on the fact that from a certain perspective, all code is data. – back2dos Oct 27 '13 at 9:33

In your precise case, having HAML to HTML and SCSS to CSS is a good practice. This is because they translate the source to the compiled code directly. The rules applied are quite simple when compared to programming languages. Preprocessors just get a lot of work out of your way, don't do magic.

So, to answer the question, yes: it is a good practice to use this "code generated by code".

There are another cases where I hate it, such as purely graphical programming. Some tools are not that good and doesn't provide the programmer with a way to customize the final, compiled code. Purely graphical programming may have its limits and you don't want limits with a project with three or more months of code. (Actually, that ended in a completely rewrite of one of our projects).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.