With frontend development, is it better to start simple and build on top of standard HTML, CSS and JavaScript? Or do you need a swiss army knife framework, like Next.js or Angular, with built-in functionality like server-side rendering (SSR), routing and navigation, and more complex forms of state management?
Of course, it depends on what scale of site you’re building. But if you’re a Vue.js user, you’re already a proponent of starting simple. If you do need more complex functionality, you can add it using additional configuration or third-party tooling. For instance, there is an option to implement SSR with Vue using Node.js, or you can use Nuxt.js (a framework built on top of Vue.js). Indeed, Nuxt.js is specifically designed to handle SSR and other advanced functionalities.
On its homepage, Vue.js positions itself as “the progressive JavaScript framework.” The word “progressive” is doing some heavy lifting, but in a nutshell it means that Vue can be used for a variety of use cases and is (as the project documentation puts it) “incrementally adoptable.”
On the progressive framework approach, Evan You believes Vue is “the only one that has implemented it really well.”
At the recent Vue.js Live conference, Vue.js creator and lead maintainer Evan You doubled down on the progressive framework concept. “I believe Vue [was] the first one to pioneer this idea and it’s also the only one that has implemented it really well,” he said.
The key to Vue is its “Single File Component” feature (SFC), which allows developers to “author modularized components using familiar HTML, CSS and JavaScript syntax.”
React and Vue are both component-based models, but the syntax is a key difference. React uses JSX syntax, which combines HTML and JavaScript, while Vue uses “an HTML-based template syntax.” Importantly, “all Vue templates are syntactically valid HTML that can be parsed by spec-compliant browsers and HTML parsers.”
Vue’s syntax is designed to be more approachable for web developers familiar with standard HTML — hopefully just about all of them! — while JSX requires an understanding of JavaScript. According to a podcast interview You did last month, Vue’s syntax was the key reason it gained traction in the early days, in February 2014 when it was released.
“Really the only feature it had, was it just gave you this template syntax. And then you can declare your state with plain JavaScript objects. And it will just automatically update things as you change the objects, as you mutate the objects. So that was the start of it.”
“We essentially distilled the parts that anyone doing frontend would care about.”
– Evan You, Vue creator
Asked why Vue.js took off when there were well-known alternatives, like AngularJS, available at that time, You’s reply is revealing — and offers a clue as to why there is growing dissatisfaction with React complexity.
“AngularJS was already out there,” said You, talking about when he released Vue a decade ago. “But I think for a lot of users […] AngularJS still felt quite intimidating, because of all the additional concepts you need to first understand before you can efficiently use it. So I think Vue came at the time where we essentially distilled the parts that anyone doing frontend would care about. […] Essentially, we started with only that and threw everything else away. And I think that this kind of simplicity really made it easier for people to understand what it is…understand the problem that it’s solving.”
He went on to explain that Vue has expanded over the past decade to include a lot of new features, including a single-page application router, state management tools, a toolchain CLI, dev tools, documentation, and more.
Even though Vue’s tool set has expanded, You says that the scope of the project is still focused on the frontend. That isn’t the case, he argues, with React.
“I would argue that with React Server Components, React is no longer a frontend framework.”
– Evan You, Vue creator
“Even in React, all the new features are centered around server components,” he said, “which is […] very significantly expanding the scope of what you would consider a frontend framework, I would argue that with React Server Components, React is no longer a frontend framework. But Vue, at this point, we still consider ourselves focused on the frontend.”
In another podcast interview, You suggested that the Vue approach of using HTML templating also appeals to backend developers who need to do some frontend things, but don’t want to deal with complex frontend frameworks.
Frontend frameworks like Angular and React usually involve the use of a Node.js server for server-side rendering (SSR), which generates HTML on the server and sends it to the client. React Server Components, a relatively new feature in React, further helps the rendering process by handling some logic and rendering on the server side before delivering the content to the client.
But backend developers don’t necessarily want that type of functionality, according to You.
“The worldview is completely different for, say, PHP developers — or other back-end languages,” he said. “For them, the worldview is […] the backend framework is sending all the HTML to the frontend, and then they think about how to make it interactive.”
“JavaScript developers will do absolutely anything to avoid writing code that isn’t JavaScript.”
– Paul Scanlon, developer
JavaScript frameworks have attracted a lot of criticism over the past couple of years — and not just for their ever-increasing complexity. Many developers feel that too much is being done with JavaScript these days. As my writing colleague Paul Scanlon put it recently, “JavaScript developers will do absolutely anything to avoid writing code that isn’t JavaScript. They’ll put their CSS in JavaScript, HTML in JSX, and now SQL in JavaScript!”
Some have argued that over-reliance on JavaScript not only devalues the web ecosystem, but puts developer jobs at risk too. Icelandic developer Baldur Bjarnason made that very argument recently. He claims that React “is, for the vast, vast majority of organisations making web-facing software, objectively worse than many of the alternatives.” Further, he thinks that React and the frameworks built on top of it have resulted in a generation of developers “who don’t have the training to troubleshoot DOM code or solve problems using CSS.” This, he said, makes it easier for tech companies to lay off those workers when demand for jobs isn’t high (such as now).
Unlike React frameworks like Next.js, including the more modern ones like Remix, Vue doesn’t try to shoehorn everything into JavaScript. Although, as Evan You himself notes, advanced JavaScript is available to Vue users if they really need it.
