¿Cuál es la diferencia entre margin: auto y justify-content / align-items center?

Para centrar tanto horizontal como verticalmente simultáneamente, hay dos opciones simples:

primero

.outer {
  display:flex;
}
.inner {
  margin:auto;
}

Segundo

.outer {
  display: flex;
  justify-content: center;
  align-items: center;
}

¿Cual es la diferencia? ¿En qué situaciones usaríamos uno sobre el otro?