STATISTICS.md

Statistics

This statistics file, can have some old data, from previous commits. We tried to frequently update it.

Here a statistics for each of implementation/example. Also available as .xlsx file in the root of project - statistics.xlsx Declarations, selectors, rules, selectors per rule and declarations per rule for CSS files got with a help of grunt-css-count module. You can also see this statics by run Gruntfile.js:

npm i

npm i grunt -g

grunt

Number of lines

Implementation	HTML	CSS	Total
OOCSS	116	233	349
SMACSS	125	220	345
Atomic	114	231	345
Organic	122	255	377
BEM Bootstrap 4	127	6232	6359
BEM CSS	131	245	376
BEM Platform	105	260	365
BEM Flexboxgrid	133	1074	1207
CSS Modules	144	220	364
Raw	96	242	338

File size

Implementation	HTML	CSS	Total
OOCSS	5.17 KB	2.22 KB	7.39 KB
SMACSS	6.09 KB	2.25 KB	8.34 KB
Atomic	6.24 KB	2.82 KB	9.06 KB
Organic	5.28 KB	3.59 KB	8.87 KB
BEM Bootstrap 4	6.26 KB	148 KB	154.26 KB
BEM CSS	5.9 KB	2.55 KB	8.45 KB
BEM Platform	5.02 KB	2.77 KB	7.79 KB
BEM Flexboxgrid	6.07 KB	42.8 KB	48.87 KB
CSS Modules	4.41 KB	2.35 KB	6.76 KB
Raw	4.31 KB	2.53 KB	6.84 KB

CSS statistics

Implementation	Selectors	Declarations	Rules	S/R	D/R
OOCSS	38	92	35	1.1	2.6
SMACSS	31	92	31	1.0	2.54
Atomic	78	82	74	1.1	1.1
Organic	80	94	55	1.5	1.7
BEM Bootstrap 4	2610	3266	1856	1.4	1.8
BEM CSS	38	96	38	1.0	2.5
BEM Platform	40	103	40	1.0	2.6
BEM Flexboxgrid	282	394	249	1.1	1.6
CSS Modules	30	95	30	1.0	3.2
Raw	49	86	44	1.1	2.0

Graphics statistics

HTML (Number of lines)

CSS (Number of lines)

Total (Number of lines)

HTML (File sizes)

CSS (File sizes)

Total (File sizes)

Selectors

Declarations

Rules

S/R

D/R