Astro 更新

Astro 是一個(gè)現(xiàn)代化的輕量級(jí)靜態(tài)站點(diǎn)生成器，用于構(gòu)建以內(nèi)容為中心的高性能網(wǎng)站。

2023年，Astro 發(fā)布了兩個(gè)主要版本，第三個(gè)主要版本已經(jīng)在路上了。

• 1 月 24 日，Astro 2.0 發(fā)布，更新內(nèi)容如下：

• Markdown 和 MDX 的自動(dòng)類型安全；
• 支持靜態(tài)渲染和動(dòng)態(tài)渲染。
• 重新設(shè)計(jì)的錯(cuò)誤界面。
• 改進(jìn)的開發(fā)服務(wù)器 (HMR)。
• 支持 Vite 4.0。

• 8 月 30 日，Astro 3.0 發(fā)布，更新內(nèi)容如下：
• 圖片優(yōu)化（穩(wěn)定版）：已取消標(biāo)志，并且比以往更好。
• 更快的渲染性能：Astro 組件的渲染速度提高了 30-75%。
• 用于 Serverless 的 SSR 改進(jìn)：與托管平臺(tái)連接的新方式。
• 用于 JSX 的熱更新改進(jìn)：支持 React 和 Preact 的快速刷新。
• 優(yōu)化的構(gòu)建輸出：更干凈、更高效的 HTML。
• 11 月 28 日，Astro 4.0 Beta 發(fā)布

CSS 支持嵌套語法

主流瀏覽器的最新版本都已經(jīng)支持 CSS 嵌套語法。

對(duì)于以下 CSS 樣式：

table.colortable td {
  text-align:center;
}

table.colortable td.c {
  text-transform:uppercase;
}

table.colortable td:first-child, table.colortable td:first-child+td {
  border:1px solid black;
}

table.colortable th {
  text-align:center;
  background:black;
  color:white;
}

使用嵌套：

table.colortable {
  & td {
    text-align:center;
    &.c { text-transform:uppercase }
    &:first-child, &:first-child + td { border:1px solid black }
  }
  & th {
    text-align:center;
    background:black;
    color:white;
  }
}

React 紀(jì)錄片發(fā)布

2 月 11 日，Honeypot 發(fā)布了期待已久的 React 記錄片，記錄了 React 的發(fā)展歷程。React 紀(jì)錄片主要內(nèi)容如下：

• 早期，當(dāng) Jordan Walke 試圖說服 Facebook 的一小群工程師時(shí)，他有一個(gè)解決方案可以改善用戶界面并顯著縮短實(shí)施變更的時(shí)間。
• Facebook 的工程團(tuán)隊(duì)不得不面對(duì)的第一個(gè)困難，以及收購 Instagram 對(duì) React 項(xiàng)目的意義。
• 當(dāng) Tom Occhino 和 Jordan Walke 在 2013 年的美國 JS 會(huì)議上展示新框架時(shí)，JavaScript 社區(qū)出乎意料的做出了負(fù)面反應(yīng)。
• “早期使用者”如何幫助開源 React 更上一層樓。Sophie Alpert 成為團(tuán)隊(duì)一員的那一刻，以及 React 對(duì) JS 社區(qū)的“重新介紹”。
• Netflix 是如何成為第一家采用 React 的大型科技公司的。
• JS 社區(qū)在構(gòu)建今天的框架方面發(fā)揮了關(guān)鍵作用。
• Dan Abramov 和 Andrew Clark 加入了 React 團(tuán)隊(duì)。

Rspack 發(fā)布

3 月 10 日，字節(jié)跳動(dòng)自研 Web 構(gòu)建工具 Rspack 正式發(fā)布。Rspack 是由 ByteDance Web Infra 團(tuán)隊(duì)孵化的基于 Rust 語言開發(fā)的 Web 構(gòu)建工具，擁有高性能、兼容 Webpack 生態(tài)、定制性強(qiáng)等多種優(yōu)點(diǎn)，解決了我們?cè)跇I(yè)務(wù)場(chǎng)景中遇到的非常多的問題，讓很多開發(fā)者的體驗(yàn)有了質(zhì)的提升。

Rspack 的特性如下：

• 啟動(dòng)速度極快：基于 Rust，項(xiàng)目啟動(dòng)速度極快，帶給你極致的開發(fā)體驗(yàn)。
• 閃電般的 HMR：內(nèi)置增量編譯機(jī)制，HMR 速度極快，完全勝任大型項(xiàng)目的開發(fā)。
• 兼容 webpack：針對(duì) webpack 的架構(gòu)和生態(tài)進(jìn)行兼容，無需從頭搭建生態(tài)。
• 內(nèi)置常見構(gòu)建能力：對(duì) Typescript、JSX、CSS、CSS Modules、Sass 等提供開箱即用的支持。
• 默認(rèn)生產(chǎn)優(yōu)化：默認(rèn)內(nèi)置多種優(yōu)化策略，如 Tree Shaking、代碼壓縮等等。
• 框架無關(guān)：不和任何前端框架綁定，保證足夠的靈活性。

TypeScript 更新

2023 年，TypeScript 發(fā)布了一個(gè)主要版本，三個(gè)次要版本：

• 3 月 17 日，TypeScript 5.0 發(fā)布，更新內(nèi)容如下：

• 全新裝飾器
• const 類型參數(shù)
• extends 支持多配置文件
• 所有枚舉都是聯(lián)合枚舉
• --moduleResolutionbundler
• 自定義解析標(biāo)志
• --verbatimModuleSyntax
• 支持 export type *
• JSDoc 支持 @satisfies
• JSDoc 支持 @overload
• 編輯器中不區(qū)分大小寫的導(dǎo)入排序
• 完善 switch/case
• 優(yōu)化速度、內(nèi)存和包大小

• 6 月 1 日，TypeScript 5.1 發(fā)布，更新內(nèi)容如下：
• 改進(jìn)函數(shù)返回值類型 undefined 的類型推斷
• getter和setter支持設(shè)置不同類型
• JSX 元素和 JSX 標(biāo)簽類型之間解耦類型檢查
• 帶命名空間的 JSX 標(biāo)簽
• typeRoots在模塊解析中被查詢
• JSX 標(biāo)簽支持鏈接光標(biāo)
• @Param JSDoc 標(biāo)簽中支持代碼補(bǔ)全
• 8 月 22 日，TypeScript 5.2 發(fā)布，更新內(nèi)容如下：
• 支持顯式資源管理
• 裝飾器元數(shù)據(jù)
• 命名和匿名元組元素
• 聯(lián)合類型數(shù)組方法調(diào)用
• 對(duì)象成員的逗號(hào)自動(dòng)補(bǔ)全
• 內(nèi)聯(lián)變量重構(gòu)
• 重大變更和正確性修復(fù)
• 11 月 14 日，TypeScript 5.3 發(fā)布， 更新內(nèi)容如下：
• 導(dǎo)入屬性
• 導(dǎo)入類型中穩(wěn)定支持 resolution-mode
• 所有模塊模式均支持 resolution-mode
• switch (true) 縮小范圍
• 對(duì)布爾值進(jìn)行比較的縮小范圍
• 通過 Symbol.hasInstance 進(jìn)行 instanceof 類型縮小
• 實(shí)例字段上的 super 屬性訪問檢查
• 嵌入提示支持跳轉(zhuǎn)到類型的定義
• 通過跳過 JSDoc 解析進(jìn)行優(yōu)化
• 通過比較非標(biāo)準(zhǔn)交集進(jìn)行優(yōu)化
• 整合 tsserverlibrary.js 和 typescript.js

React 推出全新官方文檔

3 月 17 日，在 React 新文檔的 Beta 版上線一年之后，React 終于正式發(fā)布了全新的 React 官方文檔！新文檔已啟用新的域名：https://react.dev/。

新文檔主要包含以下部分：

• 教程和指南：提供了大量的教程和指南，幫助開發(fā)者從零開始學(xué)習(xí)React或深入研究特定主題。
• 代碼示例和演示：提供了一系列的代碼示例和演示，展示了React的強(qiáng)大和靈活性。
• 最佳實(shí)踐和技巧：了解最新的 React 最佳實(shí)踐和技巧，學(xué)習(xí)如何優(yōu)化代碼以實(shí)現(xiàn)更好的性能。
• 社區(qū)論壇：與其他 React 開發(fā)人員聯(lián)系，在項(xiàng)目中獲得幫助或在社區(qū)分享專業(yè)知識(shí)。
• 新聞和更新：第一時(shí)間了解 React 開發(fā)團(tuán)隊(duì)的最新版本、更新和新聞。

Electeon 更新

2023 年，跨平臺(tái)桌面應(yīng)用開發(fā)工具 Electron 發(fā)布了四個(gè)主要版本：

• 4 月 4 日， Electron 發(fā)布 24.0.0
• 5 月 30 日，Electron 發(fā)布 25.0.0
• 8 月 15 日，Electron 發(fā)布 26.0.0
• 10 月 10 日，Electron 發(fā)布 27.0.0

Chrome 發(fā)布 WebGPU

經(jīng)過多年的開發(fā)，Chrome 團(tuán)隊(duì)發(fā)布 WebGPU，它允許在 Web 上進(jìn)行高性能 3D 圖形和數(shù)據(jù)并行計(jì)算。WebGPU 默認(rèn)在 Chrome 113 中可用。

WebGPU 是一種新的 Web API，它公開了現(xiàn)代硬件功能，并允許在 GPU 上進(jìn)行渲染和計(jì)算操作，類似于 Direct3D 12、Metal 和 Vulkan。與 WebGL 系列 API 不同，WebGPU 提供了對(duì)更高級(jí) GPU 功能的訪問，并為 GPU 上的通用計(jì)算提供一流的支持。該 API 的設(shè)計(jì)考慮了 Web 平臺(tái)，具有常用的 JavaScript API、與 Promise 的集成、對(duì)導(dǎo)入視頻的支持以及帶有大量錯(cuò)誤消息的完善的開發(fā)人員體驗(yàn)。

Node.js 更新

2023 年，Node.js 發(fā)布了兩個(gè)主要版本：

• 4 月 18 日，Node.js 20 發(fā)布， 更新內(nèi)容如下：

• 全新的 Node.js 權(quán)限模型
• 自定義 ESM loader hooks
• 穩(wěn)定的測(cè)試運(yùn)行器
• Web Crypto API
• 更新 V8 JavaScript 引擎到 11.3
• 性能提升

• 8 月 28 日，Node.js 20.6 發(fā)布，該版本原生支持 .env 文件。
• 10 月 17 日，Node.js 21 發(fā)布，更新內(nèi)容如下：
• 將 V8 引擎升級(jí)到 11.8 版本
• 穩(wěn)定的WebStreams和 fetch 功能
• 用于更改模塊默認(rèn)值的新實(shí)驗(yàn)性標(biāo)志
• 對(duì)測(cè)試運(yùn)行器進(jìn)行更新
• 內(nèi)置 WebSocket 客戶端

除此之外，Node.js 16 已于 2023.9.11 到達(dá)生命周期結(jié)束（EOL），屆時(shí) Node.js 16 已停止維護(hù)。

Vite 更新

• 2 月，Vite 4.1 發(fā)布，該版本主要是將 Rollup 和 esbuild 的版本進(jìn)行同步。值得注意的是 React 插件的升級(jí)：Plugin-react 插件修復(fù)了很多熱更新（HMR）方面的問題，并且采用 SWC 的版本增加了對(duì) SWC 插件的支持。
• 3月，Vite 4.2 發(fā)布，該版本的主要改進(jìn)是提升了 source map 的調(diào)試體驗(yàn)。Vite 團(tuán)隊(duì)與 Chrome Devtools 團(tuán)隊(duì)進(jìn)行合作，修復(fù)了一些長(zhǎng)期存在的路徑顯示問題。通過x_google_ignoreList  source map 擴(kuò)展添加了排除文件的選項(xiàng)來排除堆棧跟蹤。
• 4 月，Vite 4.3 發(fā)布，該版本專注于改進(jìn)  devServer 的性能，性能大幅提升：

• 7 月，Vite 4.4 發(fā)布，該版本添加了對(duì) Lightning CSS 的實(shí)驗(yàn)性支持。這是一個(gè)使用 Rust 編寫的快速 CSS 編譯工具，它可以加快 CSS 的處理速度。這個(gè)功能是可選的，需要顯式地安裝 Lightning CSS，并將其用于處理 Vite 內(nèi)部的 CSS 轉(zhuǎn)換，如導(dǎo)入內(nèi)聯(lián)和 CSS 模塊化，還可以用于對(duì) CSS 進(jìn)行壓縮處理。
• 11 月，Vite 5.0 發(fā)布，該版本專注于清理 API（刪除不推薦使用的功能），并簡(jiǎn)化了解決長(zhǎng)期問題的幾個(gè)功能，例如切換定義以使用正確的 AST 替換而不是 regex。團(tuán)隊(duì)還將繼續(xù)采取措施來實(shí)現(xiàn)未來的 Vite（Node.js 18+ 現(xiàn)在是必需的，CJS Node API 已被棄用）。

Vue.js 推出框架能力官方認(rèn)證

4 月 25 日，Vue 正式推出框架能力官方認(rèn)證，即 Vue.js 框架能力證書，該認(rèn)證由 Vue School 與 Vue.js 團(tuán)隊(duì)合作提供支持。

該認(rèn)證的試題集和代碼挑戰(zhàn)由 Vue.js 核心團(tuán)隊(duì)審核，包括尤雨溪。他們的直接參與有助于確保所測(cè)試的能力是實(shí)現(xiàn) Vue.js 框架最佳使用所必需的能力。計(jì)劃收入的一部分將用于支持 Vue.js 開發(fā)。

Qwik 發(fā)布 1.0 版本

5 月 2 日，追求極致性能的前端框架 Qwik 發(fā)布了 1.0 版本！Qwik 類似于 React，它也使用用 JSX 編寫的組件作為模板，主要區(qū)別在于其專注于在瀏覽器中傳輸最少的 JavaScript。

Qwik 不依靠水合來為服務(wù)器上生成的頁面帶來交互性，而是使用一種稱為可恢復(fù)性的技術(shù)來提供即時(shí)交互的 HTML。它通過在 HTML 本身中序列化應(yīng)用的狀態(tài)來工作。該項(xiàng)目由 Mi?ko Hevery 領(lǐng)導(dǎo)，他是 AngularJS 的創(chuàng)建者，他的口號(hào)是“為 Web 應(yīng)用增強(qiáng) HTML”，Qwik 就是“HTML 優(yōu)先的框架”。

在 2022 年 JavaScript 明星項(xiàng)目的前端框架排行中，Qwik 排在第二位，僅次于 React。

Qwik 提供快速擴(kuò)展的即用型集成，可以與您喜歡的庫和框架輕松集成。只需在命令行上運(yùn)行npx qwik add，然后從列表中選擇所需的集成即可：

• 一次編寫，任意部署：支持多個(gè)主流云托管服務(wù)商，包括Azure、Cloudflare、Google Cloud Run、Netlify、Node.js、Deno、Vercel等，而且這個(gè)列表還在不斷增長(zhǎng)。以與托管提供商無關(guān)的方式編寫應(yīng)用，避免廠商鎖定。
• UI組件：選擇使用QwikUI、Papanasi UI或經(jīng)過實(shí)戰(zhàn)檢驗(yàn)的UI類庫，如Material UI、ChakraUI、Radix或通過Qwik-React使用其他基于React的組件庫。
• 圖像優(yōu)化：使用 @unpic/qwik 和 qwik-image 對(duì)圖像進(jìn)行優(yōu)化，以獲得最佳用戶體驗(yàn)。
• 國際化：使用 $localize 和 qwik-speak 支持多語言交付應(yīng)用。
• 身份驗(yàn)證：使用業(yè)界領(lǐng)先的AuthJS為應(yīng)用添加多種認(rèn)證策略。
• CMS：Qwik 與 Builder.io 原生集成，可用于結(jié)構(gòu)化數(shù)據(jù)和組件級(jí)頭部?jī)?nèi)容創(chuàng)建和發(fā)布。
• 樣式：Qwik 允許延遲加載和組件級(jí)樣式封裝。結(jié)合PostCSS、Vanilla Extract或Tailwind等流行解決方案，實(shí)現(xiàn)樣式需求。
• 測(cè)試：使用 Vitest 進(jìn)行單元測(cè)試，使用 Playwright 和 Cypress 進(jìn)行端到端測(cè)試。使用 Storybook 開發(fā)和測(cè)試組件。
• 企業(yè)準(zhǔn)備：使用qwik-nx為企業(yè)規(guī)模的應(yīng)用和monorepo開發(fā)提供特殊的生成器和執(zhí)行器。

React 推出 Canary 版本

React 團(tuán)隊(duì)希望給 React 社區(qū)提供一個(gè)選項(xiàng)，使其可以在新功能的設(shè)計(jì)接近完成時(shí)就可以選擇使用這些功能，而不必等到它們發(fā)布為穩(wěn)定版本，因此引入了一個(gè)新的官方支持的 Canary 發(fā)布渠道，這個(gè)渠道將使用單獨(dú)的 React 功能與 React 發(fā)布計(jì)劃解耦。

• React 團(tuán)隊(duì)為 React 引入官方支持的 Canary 發(fā)布渠道。由于它得到官方支持，如果出現(xiàn)任何回歸，將像對(duì)待穩(wěn)定版本中的錯(cuò)誤一樣緊急處理。
• 使用 Canary 可以在它們被發(fā)布為穩(wěn)定的語義化版本之前開始使用單獨(dú)的新 React 功能。
• 與實(shí)驗(yàn)功能不同，React Canaries 僅包含有理由相信可以采用的功能，鼓勵(lì)框架考慮捆綁固定的 Canary React 版本。
• 將在 React 官方博客上宣布 Canary 版本中的重大更改和新功能。
• React 將在每個(gè)穩(wěn)定版本中繼續(xù)遵循語義化版本（Semver）。

Vue 發(fā)布 3.3 版本

5 月 11 日，Vue 3.3 正式發(fā)布，代號(hào)為 Rurouni Kenshin。此版本更新主要針對(duì)開發(fā)者體驗(yàn)進(jìn)行了改進(jìn)，特別是在使用 TypeScript 時(shí)的 SFC <script setup>。與 Vue 語言工具（Volar）1.6 的發(fā)布相結(jié)合，解決了在使用 TypeScript 時(shí)存在的許多長(zhǎng)期困擾問題。

此外，Vue 2 將于 2023 年 12 月 31 日達(dá)到生命周期結(jié)束（EOL），屆時(shí) Vue 2 將停止支持。

2023 Google I/O 大會(huì)舉辦

在近日的 2023 Google I/O 大會(huì)上，介紹了很多新的 CSS 特性，包括：

• 容器查詢
• 樣式查詢
• :has()
• nth-of
• text-wrap: balance
• initial-letter
• 動(dòng)態(tài)視口單位
• 廣色域顏色空間
• color-mix()
• 嵌套
• 級(jí)聯(lián)層
• 作用域樣式
• 三角函數(shù)
• 單個(gè)變換屬性
• popover
• 定位錨點(diǎn)
• selectmenu
• 離散屬性過渡
• 滾動(dòng)驅(qū)動(dòng)的動(dòng)畫
• View transitions

Nuxt 更新

• 5 月 16 日，Nuxt 3.5 發(fā)布，該版本支持了最新的 Vue 3.3 版本、新的默認(rèn)設(shè)置、交互式服務(wù)端組件、類型化頁面、環(huán)境配置等。
• 6 月 23 日，Nuxt 3.6 發(fā)布，該版本帶來了性能優(yōu)化、完全靜態(tài)的服務(wù)端組件、更好的樣式內(nèi)聯(lián)、靜態(tài)預(yù)設(shè)、增強(qiáng)的類型安全等許多功能改進(jìn)。
• 8 月 25 日，Nuxt.js 3.7 發(fā)布，該版本帶來了全新的 CLI，原生Web流和響應(yīng)，渲染優(yōu)化，異步上下文支持等功能。
• 10 月 19 日，Nuxt 3.8 發(fā)布，該版本帶來了內(nèi)置 Devtools、自動(dòng)安裝 Nuxt Image、新的應(yīng)用清單等功能。

React 發(fā)布十周年

2013 年 5 月 29 日，React 正式開源，至今已過去了十年！自發(fā)布以來，React 已經(jīng)成為前端開發(fā)領(lǐng)域中最受歡迎的技術(shù)之一，其生態(tài)系統(tǒng)越來越豐富，Github 累計(jì)獲得了 208k Star，每月 npm 平均安裝量達(dá)到了 200w。

十年來 React 的重要里程碑總結(jié)如下：

• 【2011：早期原型】2011 年，F(xiàn)acebook 工程師 Jordan Walke 創(chuàng)建了 FaxJS，它是 React 的早期原型。
• 【2013：發(fā)布之年】在 2013 年的 JS ConfUS 會(huì)議期間，Jordan Walke 宣布 React 正式開源。
• 【2014：擴(kuò)張之年】2014 年初，隨著開發(fā)人員開始采用 React，React 的創(chuàng)建者計(jì)劃了參觀和會(huì)議來建立社區(qū)，來贏得開發(fā)者的認(rèn)可，并幫助他們認(rèn)識(shí)到 React 是為創(chuàng)新而設(shè)計(jì)的。
• 【2015：穩(wěn)定之年】React v0.13 于 2015 年 3 月發(fā)布，最引人注目的新特性是對(duì) ES6 類的支持，這讓開發(fā)人員在編寫組件時(shí)具有更大的靈活性。Dan Abramov 和 Andrew Clark 發(fā)布了，同時(shí)也推出了第一個(gè)穩(wěn)定版的 React Developer Tools。彼時(shí)，React 開始獲得廣泛認(rèn)可，并被一些大型企業(yè)使用，如 Netflix 和 Airbnb。
• 【2016：成為主流】2016 年 4 月，React 從版本 0.14.7 切換到主要穩(wěn)定版本：React v15.0。同時(shí)，為了使生產(chǎn)環(huán)境下的調(diào)試更加容易，在推出的 15.2.0 中引入了錯(cuò)誤代碼系統(tǒng)。
• 【2017：React Fiber 發(fā)布】React v16.0 于 2017 年 9 月發(fā)布，其中包含多項(xiàng)更改和新功能，其中包括：引入 Error Boundaries 以改進(jìn)錯(cuò)誤處理、改進(jìn)服務(wù)端渲染、推出全新的 React Fiber 架構(gòu)等。
• 【2019：React Hooks 發(fā)布】React v16.8 于 2019 年 2 月發(fā)布，正式推出 React Hooks，Hooks 讓我們無需編寫類就可以使用狀態(tài)和其他 React 特性。
• 【2020：更新更簡(jiǎn)單】React v17.0 于 2020 年 10 月發(fā)布，此版本主要側(cè)重于使從以前的版本更新 React 本身變得更簡(jiǎn)單，提供了一次升級(jí)整個(gè)應(yīng)用或按認(rèn)為合適的方式逐個(gè)升級(jí)應(yīng)用的選項(xiàng)。
• 【2022：持續(xù)改進(jìn)】React v18.0 于 2022 年 3 月發(fā)布，這個(gè)主要版本包括開箱即用的改進(jìn)，例如自動(dòng)批處理、新 API（例如 startTransition）以及支持 Suspense 的流式服務(wù)端渲染。
• 【未來規(guī)劃】2022 年 6 月，React Labs 公布正在研究的方向：

• React Server Components (RSC)
• 優(yōu)化資源加載
• 靜態(tài)服務(wù)端渲染優(yōu)化
• React 優(yōu)化編譯器
• 離屏渲染
• 過渡跟蹤
• 新的 React 文檔

多個(gè)框架宣布放棄TypeScript

6 月，前端框架 Svelte 的創(chuàng)建者 Rich Harris 提出要將 Svelte 從 TypeScript 切換到使用 JSDoc 的 JavaScript。這種轉(zhuǎn)變得到了 Svelte 團(tuán)隊(duì)的大力支持，他們決定在 Svelte 4 代碼庫中從 TypeScript 遷移到 JavaScript JSDoc。

8 月，前端工具 Turbo 宣布放棄 TypeScript。

Stack Overflow 2023 開發(fā)者調(diào)查報(bào)告

6 月 15 日，程序員社區(qū) Stack Overflow 正式發(fā)布了 2023 年度的開發(fā)者調(diào)查報(bào)告。報(bào)告顯示，今年，JavaScript 已經(jīng)連續(xù)第 11 年成為最常用編程語言。

Node.js 和 React.js 是所有受訪者最常用的兩種 Web 技術(shù)。值得注意的是 Next.js 從 2022 年的第 11 位上升到今年的第 6 位。

Visual Studio Code 仍然是所有開發(fā)人員的首選 IDE，今年它在所有開發(fā)人員中的使用率從 75% 增加到 81%。

Rust 是最受推崇的語言，超過 80% 使用它的開發(fā)人員希望明年再次使用它。

React Native 發(fā)布 0.72 版本

6 月 21 日，React Native 0.72 正式發(fā)布，該版本增加了 Metro 強(qiáng)烈要求的功能，改進(jìn)了錯(cuò)誤處理和其他開發(fā)者體驗(yàn)方面的改進(jìn)。

Svelte 發(fā)布 4.0 版本

時(shí)隔四年，6 月 22 日，前端框架 Svelte 發(fā)布了全新的主要版本：4.0。Svelte 4 主要是一個(gè)維護(hù)版本，提高了最低版本要求，并在特定領(lǐng)域優(yōu)化了設(shè)計(jì)。它為下一代 Svelte 發(fā)布（Svelte 5）奠定了基礎(chǔ)。

ECMAScript 2023 標(biāo)準(zhǔn)發(fā)布

2023 年 6 月 27 日，第 125 屆 ECMA 大會(huì)正式批準(zhǔn)了 ECMAScript 2023 語言規(guī)范，其正式成為最新 ECMAScript 標(biāo)準(zhǔn)。

ECMAScript 2023 的更新內(nèi)容包括：

• 從頭到尾搜索數(shù)組：findLast() 、findLastIndex()
• Hashbang 語法
• 通過副本更改數(shù)組：toReversed()、toSorted()、toSpliced()、with()
• Symbol 作為 WeakMap 的鍵

React 核心成員 Dan Abramov 離職

7 月 20 日，React 團(tuán)隊(duì)核心成員、Redux 作者 Dan Abramov 在社交平臺(tái)表示，他即將離開 React 團(tuán)隊(duì)，開啟新的旅程。

離開 Meta 就意味著要離開 React 團(tuán)隊(duì)，也意味著以后不會(huì)杯被任何公司積極贊助全職從事 React 工作，但是 Dan 表示會(huì)繼續(xù)參與團(tuán)隊(duì)的工作并參加會(huì)議。

WebStorm 更新

2023 年截止至今，WebStorm 發(fā)布了兩個(gè)主要版本，最后一個(gè)主要版本已經(jīng)在路上了。

• 3 月 28 日，WebStorm v2023.1 發(fā)布，該版本的主要新功能和改進(jìn)包括：

• 框架和技術(shù)：Astro 支持、Vue 改進(jìn)、復(fù)制粘貼時(shí)添加的組件導(dǎo)入、React 屬性的形參信息、將全局符號(hào)和導(dǎo)出符號(hào)自動(dòng)導(dǎo)入 Angular 模板、Svelte 錯(cuò)誤修復(fù)等。
• JavaScript 和 TypeScript：將字符串自動(dòng)轉(zhuǎn)換為模板文字，為自動(dòng)導(dǎo)入更好地確定導(dǎo)入庫的優(yōu)先級(jí)，在 TypeScript 和 JavaScript 之間對(duì)齊導(dǎo)入行為等。
• HTML和 CSS：Tailwind CSS 配置、配置 HTML 代碼完成的選項(xiàng)、在 Markdown 文件中重新格式化表格的能力等。
• 全新 UI：工具窗口的垂直拆分、緊湊模式、macOS 上的項(xiàng)目選項(xiàng)卡、重新設(shè)計(jì)的 run 小部件等。
• 用戶體驗(yàn)：完整的 IDE 縮放、每個(gè)工具窗口設(shè)置的新記住大小、為新項(xiàng)目配置保存操作的設(shè)置、在智能模式下掃描文件以建立索引等。
• 版本控制：改進(jìn)了 GitHub 的代碼審查工作流程、Structure 工具窗口中的 VCS 狀態(tài)顏色提示、改進(jìn)的 Branches 彈出窗口等。

• 7 月 24 日，WebStorm v2023.2 發(fā)布，該版本的主要新功能和改進(jìn)包括：
• JavaScript、TypeScript 和 CSS：改進(jìn)了 JavaScript 和 TypeScript 的錯(cuò)誤格式、快速修復(fù)和實(shí)時(shí)模板的自動(dòng)導(dǎo)入、CSS 嵌套支持、將顏色轉(zhuǎn)換為 lch 和 oklch 等。
• 框架和技術(shù)：Vue 語言服務(wù)器支持以及對(duì)提供/注入和定義模型的支持、對(duì) Next.js 中 App Router 的更好支持、React hooks 的新實(shí)時(shí)模板、SolidJS 和 Preact 改進(jìn)等。
• 新 UI：改進(jìn)了主工具欄自定義、彩色項(xiàng)目標(biāo)題、帶有淺色標(biāo)題的淺色主題、重新設(shè)計(jì)的漢堡菜單等。
• 集成開發(fā)工具：AI Assistant 預(yù)覽、GitLab 集成、提交特定代碼行的選項(xiàng)、Docker 改進(jìn)、HTTP 客戶端改進(jìn)等。
• 用戶體驗(yàn)：“Search Everywhere”中的文本搜索、“項(xiàng)目”視圖中按修改時(shí)間對(duì)文件進(jìn)行排序、“設(shè)置”中的建議插件等等。
• 插件開發(fā)：為插件開發(fā)人員提供 LSP 支持。

2023 State of CSS 調(diào)查結(jié)果

8 月 26 日，2023 年度 State of CSS 調(diào)查（CSS 現(xiàn)狀調(diào)查）結(jié)果正式公布。

State of CSS 調(diào)查旨在確定 Web 開發(fā)生態(tài)系統(tǒng)中即將出現(xiàn)的趨勢(shì)，以幫助開發(fā)人員做出技術(shù)選擇。因此，這些調(diào)查的重點(diǎn)是預(yù)測(cè)未來幾年會(huì)發(fā)生什么，而不是分析現(xiàn)在流行的趨勢(shì)。此外，瀏覽器供應(yīng)商會(huì)使用調(diào)查數(shù)據(jù)來確定功能的優(yōu)先級(jí)并為 Interop 2023 等計(jì)劃提供信息。

htmx 發(fā)布

今年，前端出現(xiàn)了一個(gè)名為 HTMX 工具，引發(fā)了熱議，它可以說是增強(qiáng)版的 HTML。

HTMX 允許在不使用 JavaScript 的情況下添加現(xiàn)代瀏覽器功能。可以直接在 HTML 中使用屬性來訪問 AJAX、CSS 過渡效果、WebSockets 和服務(wù)器推送等功能，以便以超文本的簡(jiǎn)單性和強(qiáng)大性構(gòu)建現(xiàn)代用戶界面。

HTMX 的設(shè)計(jì)理念是通過解除HTML在前端開發(fā)中的一些限制，使其成為一個(gè)更加完整和強(qiáng)大的超文本工具。通常情況下，在傳統(tǒng)的Web開發(fā)中，只有<a>和<form>標(biāo)簽可以發(fā)起HTTP請(qǐng)求，只有點(diǎn)擊和提交事件可以觸發(fā)這些請(qǐng)求，只有GET和POST方法可用，并且只能替換整個(gè)屏幕內(nèi)容。而HTMX打破了這些限制，允許使用額外的HTML屬性來實(shí)現(xiàn)更多的功能，而不需要編寫大量的JavaScript代碼。例如，在HTML中使用特定的屬性即可實(shí)現(xiàn)進(jìn)度條、懶加載、無限滾動(dòng)、內(nèi)聯(lián)驗(yàn)證等特性。

htmx 成功地將 HTML 的簡(jiǎn)潔性與通常與復(fù)雜JavaScript庫相關(guān)的動(dòng)態(tài)功能相結(jié)合，為創(chuàng)建交互式網(wǎng)絡(luò)應(yīng)用程序提供了一個(gè)全新的選擇。然而，它并不是適用于所有情況的解決方案。對(duì)于更復(fù)雜的應(yīng)用，我們可能仍然需要使用JavaScript框架。但是，如果目標(biāo)是創(chuàng)建一個(gè)快速、交互性強(qiáng)且用戶友好的Web應(yīng)用，而又不增加太多復(fù)雜性，那么 htmx 絕對(duì)是值得考慮的。

了解更多：《htmx：增強(qiáng)版 HTML 來了！》

Rome 停止維護(hù).

9 月 2 日，F(xiàn)acebook 出品的前端工具 Rome 宣布停止維護(hù)，儲(chǔ)存庫已存檔。

發(fā)布僅三年的前端工具鏈 Rome 涼了。

Bun 發(fā)布 1.0 版本

9 月 8 日，前端運(yùn)行時(shí) Bun 1.0 正式發(fā)布，如今，Bun 已經(jīng)穩(wěn)定并且適用于生產(chǎn)環(huán)境。Bun 不僅是一個(gè)專注性能與開發(fā)者體驗(yàn)的全新 JavaScript 運(yùn)行時(shí)，還是一個(gè)快速的、全能的工具包，可用于運(yùn)行、構(gòu)建、測(cè)試和調(diào)試JavaScript和TypeScript代碼，無論是單個(gè)文件還是完整的全棧應(yīng)用。

2022 年 7 月，Bun 發(fā)布，隨即爆火，成為年度最火的前端項(xiàng)目：

僅一個(gè)月內(nèi)，就在 GitHub 上獲得了超過兩萬顆 Star。

Bun 不僅僅是一個(gè)運(yùn)行時(shí)。它也是：

• 一個(gè)包管理器 (類似 Yarn、 NPM、 PNPM)
• 一個(gè)構(gòu)建工具 (類似 Webpack、 ESBuild、 Parcel)
• 一個(gè)測(cè)試運(yùn)行器

由于是一個(gè)新的工具，所以難免存在一些問題。1.0 版本發(fā)布之后，Bun 的作者一直積極的改Bug、增加新功能。

延伸閱讀：JS三大運(yùn)行時(shí)全面對(duì)比：Node.js vs Bun vs Deno

Chrome 更新

9 月，Chrome 迎來了 15 歲生日。盡管過去 15 年發(fā)生了很多變化，但最初的目標(biāo)仍然不變——構(gòu)建一個(gè)快速、可靠、安全且易于使用的瀏覽器。

這一目標(biāo)推動(dòng)著 Chrome 團(tuán)隊(duì)對(duì) Chrome 所做的每一項(xiàng)改進(jìn)。我們以比任何其他瀏覽器更快的速度向數(shù)十億用戶發(fā)布有用的功能和更新，并與開發(fā)人員合作，幫助他們提高網(wǎng)站性能。今年，Chrome在基準(zhǔn)測(cè)試中實(shí)現(xiàn)了最快的加載速度。為了增強(qiáng)安全性，幫助將網(wǎng)絡(luò)默認(rèn)轉(zhuǎn)向 HTTPS，并使人們更容易管理和保護(hù)其密碼。除此之外，還融入了機(jī)器學(xué)習(xí)，以提供更易于訪問和個(gè)性化的瀏覽體驗(yàn)。

為了慶祝 15 歲生日，新版 Chrome 桌面版帶來了全新的外觀、全新的搜索功能、全新的應(yīng)用商店、全新的安全策略，以讓用戶繼續(xù)在 Chrome 上輕松、快速、安全地瀏覽。

Remix 發(fā)布 2.0 版本

9 月 16 日，全棧 Web 框架 Remix 正式發(fā)布了 2.0 版本，Remix 團(tuán)隊(duì)在發(fā)布 1.0 版本后經(jīng)過近 2 年的持續(xù)努力，發(fā)布了 19 個(gè)次要版本、100 多個(gè)補(bǔ)丁版本，并解決了數(shù)千個(gè)問題和拉取請(qǐng)求，終于迎來了第二個(gè)主要版本！

Remix 是一個(gè)由 React Router 開發(fā)團(tuán)隊(duì)所開發(fā)的基于 React 和 TypeScript 的全棧框架。2021 年 11 月，Remix 正式開源，至今已在 Github 上獲得了 24.6k star。Remix 正式開源時(shí)，引發(fā)了前端圈不小的關(guān)注，其被普遍認(rèn)為是 Next.js 的強(qiáng)勁對(duì)手。

時(shí)隔兩年，Next.js 擁有 112k star，是 Remix 的近 5 倍。Next.js 周下載量 279 萬，而 Remix 僅有 1.4 萬，Next.js 是 Remix 的近 200 倍。可見，Remix 并沒有像大家預(yù)料的那樣，成為 Next.js 的有力競(jìng)爭(zhēng)對(duì)手，在開發(fā)者社區(qū)中只有較小的市場(chǎng)份額。盡管如此，Remix 仍然吸引了一些開發(fā)者，并且在特定領(lǐng)域或項(xiàng)目中有其優(yōu)勢(shì)和適用性。

Next 更新

• 4 月7 日，Next.js 13.3 發(fā)布
• 5 月 5 日，Next.js 13.4 發(fā)布，在該版本中，App Router 已經(jīng)穩(wěn)定，可用于生產(chǎn)。
• 9 月 19 日，Next.js 13.5 發(fā)布，該版本通過以下方式提高了本地開發(fā)性能和可靠性：

• 本地服務(wù)器啟動(dòng)速度提高 22%：使用App和Pages Router可以更快地進(jìn)行迭代
• HMR（快速刷新）速度提高 29%：在保存更改時(shí)進(jìn)行更快的迭代
• 內(nèi)存使用量減少 40%：在運(yùn)行next start 時(shí)測(cè)量
• 優(yōu)化的包導(dǎo)入：使用流行的圖標(biāo)和組件庫時(shí)進(jìn)行更快的更新
• next/image 改進(jìn)：支持<picture>標(biāo)簽、暗模式等
• 修復(fù)了超過 438 個(gè)錯(cuò)誤！

• 10 月 26 日，Next.js 14 發(fā)布，該版本的主要更新如下：
• 集成了緩存和重新驗(yàn)證
• 簡(jiǎn)單的函數(shù)調(diào)用，或者與表單原生配合工作
• 本地服務(wù)器啟動(dòng)速度提高了 53%
• 通過快速刷新，代碼更新速度提高 94%
• Turbopack：App & Pages Router 通過 5000 個(gè)測(cè)試
• 服務(wù)端操作（穩(wěn)定）：逐步增強(qiáng)的數(shù)據(jù)變更
• 部分預(yù)渲染（預(yù)覽）：快速的初始靜態(tài)響應(yīng) + 流式動(dòng)態(tài)內(nèi)容
• Next.js Learn（全新）：教授 App Router、身份驗(yàn)證、數(shù)據(jù)庫等內(nèi)容的免費(fèi)課程。

ViteConf 2023

10 月 5 日 - 6 日，ViteConf 2023 在線舉行，Vue 和 Vite 的創(chuàng)建者尤雨溪發(fā)表了題為《The State of Vite》 的演講，在演講中，尤雨溪總結(jié)了 Vite 的版本發(fā)布情況、Vite 增長(zhǎng)和采用情況，并對(duì) Vite 的未來進(jìn)行了展望。

Vite 團(tuán)隊(duì)正在研發(fā) Rolldown，它是使用 Rust 開發(fā)的 Rollup 替代品。從零開始用 Rust 編寫一個(gè)打包工具并非易事，這需要花費(fèi)大量的努力。下面來看一下 Rolldown 的路線圖，以及從短期到長(zhǎng)期的關(guān)鍵節(jié)點(diǎn)。

第一階段：聚焦基礎(chǔ)打包功能

第一階段的目標(biāo)是能夠替代 esbuild 進(jìn)行依賴預(yù)打包，其中關(guān)鍵的挑戰(zhàn)在于處理 CommonJS 和偽 ESM 依賴項(xiàng)。

第二階段：實(shí)現(xiàn) Rollup 的功能

第二階段的目標(biāo)是實(shí)現(xiàn)與 Rollup 相當(dāng)?shù)墓δ埽绕涫桥c Rollup 插件生態(tài)系統(tǒng)的兼容性，以及實(shí)現(xiàn) tree-shaking 和高級(jí)塊分割控制。最終目標(biāo)是在 Vite 中使用 Rolldown 作為生產(chǎn)構(gòu)建的替代品，以提供功能更強(qiáng)大、高效、易用和靈活的打包工具。

第三階段：常見需求的內(nèi)置轉(zhuǎn)換

第三個(gè)階段會(huì)稍微遙遠(yuǎn)一些，它將包括一些最常見需求的內(nèi)置轉(zhuǎn)換，例如 TypeScript、JSX、代碼壓縮，以及基于目標(biāo)環(huán)境進(jìn)行語法降級(jí)。這個(gè)階段的目標(biāo)是實(shí)現(xiàn) esbuild 的功能，最終將用 Rolldown 取代 esbuild 和 Rollup。

第四階段：使用 Rust 重構(gòu) Vite

從長(zhǎng)遠(yuǎn)來看，Vite 團(tuán)隊(duì)也在考慮如何讓 Vite 本身能夠更好地受益于原生級(jí)別的速度。一種可能的實(shí)現(xiàn)方式是通過 Rust API 來公開 Rolldown 的插件容器，并將 Rolldown 作為 Vite 引入自己的Rust核心的依賴項(xiàng)。這樣一來，Vite 就可以將許多內(nèi)部插件和轉(zhuǎn)換使用 Rust 重構(gòu)，從而提高性能關(guān)鍵路徑上的效率。此外，為那些開發(fā)過程中有太多未打包模塊的項(xiàng)目引入完全打包模式也是一個(gè)備選方案。

最終，Rolldown 的目標(biāo)并不是取代現(xiàn)有的工具，而是更好地滿足在 Vite 中所面臨的獨(dú)特需求，并最終使所有使用 Vite 的用戶受益。

Angular 更新

2023 年，Angular 發(fā)布了兩個(gè)主要版本：16 和 17。

• 5 月 4 日，Angular 16 發(fā)布，主要特性如下：

• 開發(fā)者預(yù)覽版引入全新的 Angular 響應(yīng)式模型，提供 Angular Signals 庫，與 RxJS 保持互操作
• 服務(wù)器端渲染和水合作用增強(qiáng)
• 開發(fā)者預(yù)覽版引入基于 esbuild 的構(gòu)建系統(tǒng)
• 使用 Jest 和 Web Test Runner 進(jìn)行更好的單元測(cè)試
• 其他一系列改善開發(fā)者體驗(yàn)的功能

• 10 月 7 日，Angular 發(fā)布全新官方文檔：Angular.dev。并發(fā)布了全新 Logo。
• 11 月 8 日，Angular 17 發(fā)布，該版本帶來了很多重要更新，包括：

• 引入了可延遲的視圖，將性能和開發(fā)者體驗(yàn)提升到新的高度。
• 內(nèi)置控制流循環(huán)使運(yùn)行速度在公共基準(zhǔn)測(cè)試中提高了高達(dá)90%。
• 混合渲染和客戶端渲染的構(gòu)建速度分別提高了87%和67%。
• 全新的外觀體現(xiàn)了 Angular 未來的功能。
• 全新的互動(dòng)學(xué)習(xí)之旅，帶來更好的用戶體驗(yàn)。

Prittier 重金懸賞用 Rust 重構(gòu)

Facebook 法國前端工程師、React Native 和 Prettier 的聯(lián)合創(chuàng)始人 Vjeux 在社交平臺(tái)發(fā)帖，尋求有能力的開發(fā)者來使用 Rust 重寫前端代碼格式化工具 Prettier，并懸賞 1 萬美元。Vercel 的首席執(zhí)行官 Guillermo Rauch 也跟帖表示，進(jìn)一步對(duì)該懸賞進(jìn)行加碼，將賞金升級(jí)到了 2 萬美元。此外，Wasmer 官方也附議了 Vjeux 的這一提議，并表示將額外提供 2500 美元的獎(jiǎng)勵(lì)。

最終，Biome 贏得 Prettier 挑戰(zhàn)的 $22.5K 獎(jiǎng)金。