The following sections are included.
- Most Popular Projects
- Front-end frameworks
- Node.js frameworks
- Build tools
- Vue ecosystem
- React Ecosystem
- Testing frameworks
- Mobile Development
- Desktop Development
- Static Site Builder
- State Management
Most Popular Items
Basically it allows you to embed any bash expression in your code (
git … and any other command!) and
It introduces utilities provided by several popular packages.
- node-fetch has the same API as
fetchin the browser, and can create HTTP requests.
- fs-extra Handles filesystem operations.
- globby matches a given filename in user-friendly mode.
Second, Vite is a build tool with excellent performance using the esbuild compiler. At birth, it was only connected to the Vue.js community, but now it provides support for all the major UI frameworks: React, Svelte, Lit.
In third place, Next.js maintains its position as the leading “meta-framework” in the React world.
Fifth in line, Tauri is a solution for building desktop applications using web technologies.
In contrast to Electron, it is written in Rust and it does not ship the Node.js runtime with every application. 1.0 beta was just released in May.
It is close in concept to Static Site Generation (SSG), but the key difference is that Astro allows you to introduce dynamic interactive parts called “islands” into your web pages.
Different strategies can be applied when rendering dynamic components on the client side.
- when the page is loaded
- When the page is idle, if it is a low-priority component (consider tracking.)
- When the component is visible, using the tourer Intersection Observer API
One of the most powerful parts is that Astro pages can be built with a combination of HTML and components written in any framework. react, Vue.js or Svelte…
The biggest change is the rise of Svelte, which overtook Angular to take the third place.
More and more tools or components are incorporating Svelte into their target frameworks (such as Vite, which we mentioned).
One of the major headlines this year is that Rich Harris, the creator of Svelte, is joining the Vercel team behind Next.js.
Like Next.js, Svelte has its own meta-framework for building high-performance applications: SvelteKit.
Solid, in fifth place, is an interesting alternative to React. The component is written in JSX, but it doesn’t rely on the virtual DOM like React does.
It also inspired Mitosis, a tool for writing and compiling components for any framework: React, Vue.js, Angular, Svelte…
The major UI frameworks have their own “meta-frameworks” to build modern and scalable applications, providing features such as routing, server-side rendering, advance static page generation, building for production optimization… and more.
- React’s Next.js, the winner in this category and arguably the pioneer in this space
- Vue.js’s Nuxt, which is now split into Vue.js v2 and v3 versions
- Svelte also has SvelteKit
Remix, a full-stack framework for building React apps, is the new kid on the block in this category. It’s also one of the biggest stories of the year. It was created by the authors of React Router, and until October it was only available to paid backers.
The project has received a lot of boost since it went public (and $3 million in seed funding, which helps!) . Its motto is clear: “Web Basics, Modern UX”, as its API follows web standards as much as possible (HTTP responses, form submissions…) …).
Here are two examples that blew my mind.
To handle form submissions, you can… Just do a normal form submission. This seems obvious, but developers are more used to writing
In addition, it handles nested routes in a very smart way, being able to load all the data needed for all the components on a given page in an efficient way, rather than producing a waterfall of HTTP calls that often result in a lot of spinning indicators on the screen.
In addition to these meta-frameworks, in second place Nest is the leader in more traditional server-side Node.js frameworks that are not tied to any UI libraries.
Finally in third place, Strapi is the leader in “Headless CMS”, applications that offer rich dashboards for users to manage data and modern APIs for developers to build anything from the data. The latest version offers a design system built on top of the React component library.
In 2021, an already existing trend goes even further.
The acceptance of native ES modules continues. vite has been widely adopted (faster than snowpack), leading to a new ecosystem of tools (such as Vitest, a modern ES-based testing framework). es modules are also gaining acceptance in the Node.js ecosystem, but it won’t be easy. typeScript is even in Node.js TypeScript has even postponed support for ES modules in Node.js.
For performance reasons, more and more front-end tools are being built in other languages (see awesomejs-tooling-not-in-js).
Parcel2 has released a new Rust compiler, and the Rome toolchain is being rewritten in Rust, but one of its founders, Jamie Kyle, has just left the company without a word.
Rust is clearly the leading non-JS language, but it’s not the only one that offers great performance. bun is written in Zig. turborepo and esbuild are written in Go. It is worth noting that Evan Wallace left Figma: this probably gave him more time to work on esbuild.
In the monorepo space, Lerna is still widely used, but not very well maintained. nx, a single-engine tool that helps reduce build time dramatically, has been growing rapidly. Its newer competitor, Turborepo, has benefited from great marketing after being acquired by Vercel.
One year after the official release of Vue 3, we are seeing the ecosystem evolve rapidly along with many great innovations.
New syntax, such as
<script setup> in the Vue 3 core, takes the component authoring experience to a new level. The new VS Code extension Volar brings first-class TypeScript support to Vue; the new state manager Pinia, built on the Composition API, becomes the successor to Vuex.
With Vite as the new default tool for Vue, meta-frameworks like Nuxt 3, Quasar, and VitePress now use Vite as their default engine. Making the developer experience a huge improvement and opening many new doors for innovation.
The community has also put a lot of effort into tuning the developer experience from Vue2 to Vue3, making the migration process much smoother. It’s been a great year for Vue developers, and their apps have seen huge improvements in both developer experience and performance. Can’t wait to see what’s coming in 2022!
React 18 will be released soon and is now available in RC and benefits from some out-of-the-box improvements such as automatic batching to reduce rendering or SSR support for Suspense.
React continues to power the browser and server side, and it’s becoming ubiquitous with React Native’s multi-platform vision.
Static Website Generator