CSS in JS

L'uno contro l'altro
Praticamente amici

@giucot

Renato Pozzetto

CSS

renato
tomas

Tomas Milian

Javascript

Una storia a lieto fine?

Cosa significa JS con un po' di CSS?

Non sono problemi ma (to be continued)

  • Namespace globale
  • Linguaggio dichiarativo
  • Risoluzione non deterministica

opportunità!

  • Preprocessori
  • Metodologie CSS

Client API

  • css Prop
  • css String
  • styled
  • composition
  • componenti selettori

css prop

cssProp

css string

styled

Composition

Componenti selettori

Emotion

Code Sandbox

Linaria

Code Sandbox

CSS modules

CSS in JS under the hood

  • Parsing stile del componente
  • Nuova classe css
  • Preprocessing il css (i.e. stylis)
  • Nuovo tag style

CSS in JS run time

  • styled-component
  • emotion

CSS in JS zero run time

  • css modules
  • linaria
The unseen performance costs of css in js in react apps

@AggArvanitakis

Punti di forza CSS in JS

  • Confidenza nel codice
  • Tools out of the box