VUE DOM

Virtual DOM (가상DOM)

• Vue 컴포넌트 트리로 만들어진 VNode 트리
• 가상 DOM을 생성해서 실제 DOM(HTML DOM)에 붙이는 방식.
• 실제 DOM의 조작을 줄이기 위함으로, 다시 그려야 하는 요소를 계산하여 성능부하를 최소화함.
  (DOM 전체를 Reflow하지 않고, 특정요소만 Reflow 함.)

render 함수란?

vue에서는 render함수를 호출하여 가상DOM을 구현함.
(template에 기술된 HTML을 createElement라는 인자를 받아 VNode 트리로 만들어 반환)

new Vue({
  el: "#app",
  render: h => h(App)
});

render 함수는 어떻게 생겼을까?

render: function (createElement) {
  return createElement('h1', this.blogTitle);
}