Vue.js: What is the difference between h() and render function in Vue?

h() — creates virtual nodes. render — returns vnodes.

h() function:

1import { h } from "vue"
2
3export default {
4    setup() {
5        return () => h("div", { class: "container" }, [
6            h("h1", "Title"),
7            h("p", "Content")
8        ])
9    }
10}

Parameters:

• Type: tag name or component.
• Props: attributes and events.
• Children: text or vnodes.

Use cases:

• Dynamic components.
• Functional components.
• Programmatic rendering.