The new Vue component creation API needs to be executed by a function, defineComponent, and the JavaScript object that is passed as an argument maintains almost the same structure as the old structure in Vue 2. In the examples, we used the same properties, data, render, methods, and template, all present in Vue 2.
In the example with the <template> structure, we didn't have to create a wrapper element to encapsulate the content of our application component and were able to have two root elements on the component directly.
In the render function example, the same behavior occurs, but the final example used the new exposed h API, where it is no longer a parameter of the render function. A breaking change was present in the example; in the button creation, we had to use the onClick property inside the data JavaScript object, not the on property, with the click method. This happens because of the new data structure of the VNode of Vue 3.