
Volar has made a tremendous impact as the official Vue.js VSCode extension, starting from humble beginnings as an individual endeavor and gradually gaining recognition as the new standard for its advanced architecture and enhanced performance. Now, the journey takes a massive leap forward with the birth of a distinct and innovative project: [Volar.js](https://volarjs.github.io/).

In this article, we dive into the inception and capabilities of Volar.js, its ability to serve multiple meta frameworks, the performance optimizations it brings to the table, and the potential use cases it intends to solve. Furthermore, we will also discuss the establishment of the Volar.js Core Team and some thrilling future developments.

## Volar.js: A Game-Changer for Embedded Language Tooling

Volar.js emerges as a framework-independent toolkit that can support any file format incorporating embedded languages, extending beyond the realms of Vue to embrace frameworks such as Astro, Svelte, and Angular. Additionally, it can seamlessly implement single-language LSP servers for TypeScript, CSS, and HTML.

Volar.js has an unwavering focus on performance, striving to reduce overhead and match the performance characteristics of native embedded language services. Its optimization is a result of learnings gleaned from millions of downloads and a vast user community.

For example, the Lynx team at ByteDance, early adopters of Volar.js, managed to create an entire set of language tools for their custom framework in merely two weeks with a single developer's efforts. Building the same set of tools from scratch would have consumed months and required an entire team.

## Evolution in Volar Codebase and Project Structure

The birth of Volar.js triggered the movement of the original Volar extension and `vue-tsc` codebases to the [`vuejs/language-tools`](https://github.com/vuejs/language-tools) repository. This repository now depends on Volar.js for its core foundation and contains Vue-specific code. Some npm packages are also transitioning from the `@volar` npm organization to `@vue`. However, these changes should not impact end users.

Similar to [Vite](https://vitejs.dev/), which originated in the Vue ecosystem and eventually formed a community connecting users from the broader web development landscape, Volar.js aspires to tread the same path.

To achieve this vision, the Volar.js Core Team was founded by Volar creator, Johnson ([@johnsoncodehk](https://github.com/johnsoncodehk)), and Astro core team member, Erika ([@erika](https://elk.zone/mastodon.gamedevalliance.fr/@erika)). Together, they plan to enhance the development experience for web developers across the board.

A new [`volarjs` organization](https://github.com/volarjs) has been established to maintain the framework and associated repositories.

## The Road Ahead: Exciting Prospects for Volar.js

Although the long-term roadmap for Volar.js is still under development, several major areas are being actively investigated:

1. **Monaco Support:** Integrating support for Monaco within the framework will allow all Volar.js-based language servers to utilize it effortlessly.
2. **Compatibility with IDEs Beyond VSCode:** Leveraging contributions of those who have implemented language clients for various IDEs, such as Vim, Sublime, Atom, Emacs, Nova, and Lapce, to reduce the workload required for implementing language clients outside VSCode.
3. **Bun-based Language Server:** Investigating the potential for boosting Volar's language server performance by running it within [Bun](https://bun.sh/). Success in this area will provide benefits for all language servers relying on Volar.js.
4. **Monoserver:** Implementing a single, shared server for multiple language servers built on Volar.js, which can improve performance and efficiency when dealing with TypeScript language services.
5. **Rules API (Built-in Linter):** Introducing a unified API to avoid interference between different linting tools while providing effortless integration with IDE features and top-notch performance.
6. **Scripts API:** Offering access to the formatting and linting capabilities of the language server for scripting purposes, ensuring consistent results in CI, git pre-commit hooks, and IDE environments.

In a nutshell, Volar.js is poised to make a significant impact as a powerful solution for embedded language tooling. Its revolutionary features, high-performance capabilities, and adaptability to work with a wide range of meta frameworks make it an essential tool for modern developers. Keep an eye on Volar.js's progress as it continues to evolve and transform the development landscape.


Get insights on Volar.js, an extracted core of Volar designed to cater to various meta frameworks, featuring performance optimizations and potential use cases.

Delving Developer

Vue.js Archives

Posts found under the category "Vue.js"

Introducing Volar.js: A Powerful Framework for Embedded Language Tooling