(React) input을 controlled로 하라던데 uncontrolled랑 뭐가 다른가요

폼을 만드는데 input을 두 가지 방식으로 짤 수 있다고 하더라고요.

// 이거랑
<input value={name} onChange={e => setName(e.target.value)} />

// 이거
<input ref={inputRef} />

위에껄 controlled, 아래껄 uncontrolled라고 부른다는데 뭐가 다른 거예요? 그냥 ref로 값 꺼내 쓰는 게 코드도 짧고 편한데 왜 굳이 state로 묶는 controlled를 권장하는지 모르겠어요. 각각 언제 쓰는 게 맞나요?