[manigandham]

Vue 3 will change all that. It's written in typescript with first-class support and the composition API is like React hooks but better for most cases.

Vue's templating is standard HTML which means it can be delivered by any server-side language/framework. This is where Vue shines in adding interactivity to many typical apps without going fully SPA.

[williamdclt]

It is standard HTML in the sense that it's valid HTML, which React JSX isn't, of course. But without the JS runtime it won't do anything, so in the end what's the advantage over React? You can add interactivity without going full SPA with React too after all

[manigandham]

It's a subtle but huge difference. In React, using JSX means you can create components and mount them on top of the existing elements on the page.

With Vue's HTML templates, the page itself can be the component and everything can become interactive. For example, you can easily output a HTML table from server-side code, then Vue can convert that into a interactive component while using the existing structure and data.

This lets you render the page using existing web frameworks, it's faster because the server puts it together, it's progressive enhancement and works without JS and on slow devices, and Vue can seamlessly add on top with nothing more than a single JS tag and no compilation step.

[eblanshey]

> For example, you can easily output a HTML table from server-side code, then Vue can convert that into a interactive component while using the existing structure and data.

If you're using vue, you inherently use state or props, and those are handled using {{ myState }} syntax. If you load everything from the backend, it's going to have the actual data in the table. How would you convert the already-rendered HTML to something interactive if the template isn't set up that way?

[kumarvvr]

Fantastic point.

Vue has a bit more flexibility in that regard.

[honopu]

I think you're talking about universal or isomorphic rendering, but each of these allow for it.

[manigandham]

No, I'm talking about using hundreds of existing server-side web frameworks that output HTML, not Node/React SSR which is far more limiting.

[azangru]

> In React, using JSX means you can create components and mount them on top of the existing elements on the page.

I am not sure this analysis is entirely correct.

In case of server-side-rendered React pages, React takes the html that arrives from the server and makes it interactive ("hydrates" it, according to the common React community parlance), provided that that DOM generated from that HTML corresponds to the virtual DOM that React generates. It doesn't throw the original DOM away.

[manigandham]

This is only if you use SSR and is the opposite of being able to render with any existing web framework.

[keithnz]

you can use the composition api already in Vue2, which is what I have been doing, and I'm using typescript for everything. There is a chance the api may change, but it seems pretty stable. I combo this with using tailwindcss and I think that makes for a pretty productive combo.

[StreamBright]

>> This is where Vue shines in adding interactivity to many typical apps without going fully SPA.

That is good to know. I wasn't aware. Most of the apps we are working on cannot be SPAs easily, so it matters if the JS framework supports operating without it.

[DanielBMarkham]

Apologies, I a bit confused. SPA stands for Single-Page Application, does it not? So if you have a single page that works as an application, it is a SPA, no?

I understand the desire to use webkit, Typescript, and so forth to develop modern apps, I'm just confused at why Vue in a stand alone page delivered by ftp or usb drive isn't a "full" SPA

[oefrha]

You can mix and match traditional server-rendered content and JS framework (in this case Vue)-rendered components on the same page (not considering SSR here). Going full SPA means using the latter exclusively.

[frosted-flakes]

You can easily do that with React too. In fact, that's how Facebook first used it, using it for just the chatbox (or something) with the rest of the page as it was.

[manigandham]

React with JSX means you can easily mount a component into an element, but you can't easily add interactivity to all of the existing HTML on the page as delivered by the server.

[DanielBMarkham]

Got it. Thanks. We have several content-delivery pipelines at work. It had been so long since I used server-side dynamic content creation that it had slipped my mind.

[sebazzz]

Vue 3 is getting delayed, isn't it? Not weird for a community project, but still something to note.

[manigandham]

I don't know, there's no hard deadline but you can check the official roadmap: https://github.com/vuejs/vue/projects/6