> Except neither of these examples are "just" JavaScript and require a preprocessor to convert it to valid JavaScript that the browser can actually run.
That is true. But the syntax is much closer to native JavaScript.
IMO it's a weird claim to make that invalid JavaScript is much closer to native JavaScript than actual valid JavaScript.
They're just stylistic preferences, both have valid JavaScript expressions inside their component event handlers, the difference is syntactical, React went with JSX whilst Vue/Angular/Alpine.js/Aurelia adopted a HTML (valid) centric syntax.
I don't think so. Vue places almost it's entire rendering logic into HTML strings. To me this is worse than something that appears to be JavaScript, acts like JavaScript and has the same syntax as JavaScript.
> I don't think so. Vue places almost it's entire rendering logic into HTML strings.
I don't know what this is supposed to mean. The logic in Vue 3 components is maintained in its JavaScript setup function. The template syntax is just HTML based template syntax that can be parsed natively by browser's HTML parsers for binding component functionality to the DOM. Behind the scenes it compiles down to JavaScript functions like React does, where in addition to its template syntax Vue also supports Render Functions [1] and JSX/TSX [2].
The template can be maintained in a string, in the HTML DOM or in a SFC. Templates in a string or DOM don't need a preprocessor whereas Vue SFC's does as compiles down into more optimal JavaScript functions than React's and its template syntax is non-existent at runtime as it never makes it to its compiled .js builds.
Both Vue and React use their view functions to construct a Virtual DOM that they use to calculate which DOM modifications need to be made, i.e. they both serve the same function and their differences is largely cosmetic, effectively just a stylistic preference.
That is true. But the syntax is much closer to native JavaScript.