Latest Frontend Releases: Next.js 11.1, Vue 3.2, and Cutting‑Edge Open‑Source Tools

News

Next.js 11.1 released

On the 12th of this month, Next.js announced the official release of version 11.1, adding several new features and performance optimizations:

Security patch: an important update preventing potential open redirects.

ES Module support: can be enabled today via the experimental flag.

Rust‑based tooling: integration of SWC to replace JavaScript tools such as Babel and Terser.

Faster data fetching: keep‑alive capability during prerendering improves data fetch speed by up to 2×.

Faster source maps: builds with source maps are 70% faster and use 67% less memory.

…etc.

Release blog: Next.js 11.1 | Next.js

Vue 3.2 released

On the 5th of this month, Evan You announced the official release of Vue.js 3.2, bringing new features and performance improvements:

Stable <script setup> and <style v-bind> syntax in single‑file components.

New ref syntax sugar.

New defineCustomElement method for creating custom elements.

New effectScope API with onTrack/onTrigger for debugging computed .

New v-memo directive.

…etc.

Release blog: Vue 3.2 Released! | The Vue Point

Open Source

quickjs-rs

A Rust wrapper for the QuickJS engine.

GitHub repo: theduke/quickjs-rs

MDX

Write JSX inside Markdown and render it.

<code># Hello, *world*!

Below is an example of JSX embedded in Markdown. <br/> **Try and change
the background color!**

<section style={{ padding: '20px', backgroundColor: 'tomato' }}>
  <h3>This is JSX</h3>
</section>
</code>

Home page: MDX

mdast

mdast is a specification for representing Markdown as an abstract syntax tree, implementing the unist spec and supporting various Markdown flavors such as CommonMark and GitHub Flavored Markdown.

In MDX, MDXAST (an mdast superset) can be used to convert MDX to an AST.

GitHub repo: syntax-tree/mdast

Puerts

Puerts provides a TypeScript programming solution for game engines, offering a JavaScript runtime and TypeScript access to the host engine.

GitHub repo: Tencent/puerts

wasm-pack

wasm-pack offers an all‑in‑one workflow for building Rust‑generated WebAssembly and interacting with JavaScript in browsers or Node.js.

GitHub repo: rustwasm/wasm-pack

instant.page

Research by Amazon and others shows that eliminating a 100 ms delay can increase sales by 1 %. instant.page preloads link destinations on desktop and mobile with different strategies to speed up page navigation.

GitHub repo: instantpage/instant.page

txiki.js

txiki.js is a tiny yet powerful JavaScript runtime built on QuickJS and libuv.

GitHub repo: saghul/txiki.js

Article

One‑click Dark Mode Support for Front‑End Sites

This article explains how to use PostCSS and Stylelint to add one‑click dark‑mode support to existing front‑end projects, replacing existing colors with CSS variables.

How We Reduced Next.js Page Size by 3.5× and Achieved a 98 Lighthouse Score

Papyrus, a Next.js‑based blog framework, reduces bundle size by dynamically importing, removing unused code and styles, resulting in a 3.5× smaller build and a Lighthouse score of 98.