📚 Reference

• 공식 문서 1

📜 Chapter

Vue Flow

markRaw()

ref, reactive

triggerRef()

shallowRef()

• shallowRef()
• shallowRef는 Vue의 반응성 API 중 하나로, 기본 ref의 얕은(shallow) 버전이다.
• 얕은 반응성: ref가 내부의 값(객체인 경우)을 깊게 반응형으로 만드는 것과 달리, shallowRef는 .value 속성 접근에 대한 반응성만 가진다.
• .value 변경 감지: shallowRef는 오직 .value 자체가 새로운 값으로 대체될 때만 변경을 감지하고 관련 효과(컴포넌트 리렌더링 등)를 트리거한다.
• 내부 값 변경 미감지: shallowRef의 .value가 객체일 때, 그 객체의 내부 속성을 변경하더라도 Vue는 이 변경을 감지하지 못하여 관련 효과를 트리거하지 않는다.

ref와의 차이점 비교

필요성

성능 최적화 (Performance Optimization)

• 대규모 데이터 구조를 다룰 때 유용하다.
• ref를 사용하면 Vue가 객체의 모든 중첩된 속성까지 반응형으로 만들기 위해 많은 오버헤드가 발생할 수 있다.