Imperative vs declarative

Imperative – you instruct a machine what to do step by step. Example: assembly language.
Declarative – you instruct a machine what you want to get and it supposes to figure it how to do it. Example: SQL.

Imperative vs declarative is an example of limitation of categorical thinking. There is a spectrum of values, but we trapped with two categories.

Let’s take a look at some examples.

List operations

List operations (iteration, filtering etc) from most imperative to most declarative approach:

  1. Imperative programming, which includes goto (or jump in terms of modern assembly). For example assembly.
  2. Structured programming, which includes for loops and indexed access to elements of the array. For example Pascal.
  3. Map/Reduce concept, which includes map and reduce operations, but abstracts away how list itself is organized. For example map/reduce in Scheme.
  4. Relational databases, which abstracts away all implementation details of storage. For example SQL.

CSS position models

CSS position models from most imperative to most declarative approach:

  1. positionfloatpaddingmargin. You need to juggle those properties to achieve the desired layout. For example, see how to position div in the center.
  2. Flexbox. A lot of hacks went away, but you still can’t describe layout precisely, it is still some approximation
  3. CSS Grid Layout. You can describe the layout.

Also, need to notice that there is a way too much “knobs” in CSS to manipulate layout. See this video from deconstructconf to understand how this task can be solved better.

Source: dev