前端週刊第三十八期

2022-10-08 06:00:46

前端週刊發表每週前端技術相關的大事件、文章教學、一些框架的版本更新、以及程式碼和工具。每週定期發表,歡迎大家關注、轉載。
如果外連不能存取,關注公眾號前端每週看,裡面有解決辦法

大事件

  • Web Almanac 2022 對現實世界中 JavaScript 狀態的看法—— 更好的是:調查還是來自 800 萬個站點的真實世界使用資料?如果您更喜歡後者,那麼這是給您的。Web Almanac是關於線上使用哪些技術的年度「網路狀態」報告,在 20 多章的見解中,有一個特定於 JavaScript 的章節。一些亮點:
  • 比以往任何時候都更多的 JavaScript 正在通過網路傳輸。1.3MB 的頁面只會讓你處於第 90 個百分位(!)大約一半也沒有使用。
  • 77% 的移動頁面在<head>
  • import幾乎看不到動態——大約佔頁面的 0.3-0.4%。
  • Web Workers用於 12% 的頁面。
  • 在 1,000 個頂級網站中,17% 使用 webpack,約 1.5% 使用 Parcel。
  • Psst .. jQuery 仍然在各地使用..
  • 宣佈 TypeScript 4.9 Beta—— 這是一個非常令人滿意的更新,它引入了satisfies運運算元,當您想要驗證表示式的型別與某種型別匹配但不更改實際結果型別時。當in縮小具有未列出屬性的型別時,運運算元也變得更強大。

  • JavaScript Web 框架的「新浪潮」—— 幾個月前,他介紹了 React 狀態管理的新浪潮,現在 Rem 又回來嘗試「理解新的 Javascript Web 框架的擴散」。我們都一樣。Vue、Svelte、Solid、Remix、Astro 和 Qwik 都在這裡亮相。雖然沒有 Lit 或 Web 元件。

文章

  1. 在 .NET 7 中使用任何 JavaScript 應用程式中的 .NET — 通過著名的TodoMVC 移植到通過 WebAssembly 執行的 .NET 來展示 JavaScript 到 .NET 的互操作Blazor是瀏覽器中最常與 .NET 和 C# 關聯的框架,但該支援也獨立於 Blazor 工作。

  2. 使用 JavaScript 編寫可組合 SQL — 使用 SQL 資料庫的方法有很多,作者更喜歡純 SQL 和Slonik。如果您更喜歡更抽象的東西,當然, Knex.js仍然是一個選擇。

  3. 在 React 中構建一個可存取的選擇元件 — 一步一步(或者我們應該說一磚一瓦?)教學,介紹如何構建一個專門考慮可存取性的選擇元件,這是一個像 LEGO 這樣的國際企業所關注的主題心。

  4. 使用 JavaScript 進行電話振動的快速指南 — 瞭解如何做到這一點,然後不要這樣做

框架釋出

  1. Electron 21

  2. Node.js 18.10.0(當前)

  3. Astro 1.4

  4. Neutralino.js 4.8
    ↳ 輕量級跨平臺桌面應用程式框架。

  5. Boa 0.16
    ↳ 用 Rust 編寫的 JS 詞法分析器、解析器和編譯器。

  6. react-number-format 5.0
    ↳ 用於在輸入中格式化數位或作為文字的元件。

  7. jest-native 5.0
    ↳ 用於測試 React Native 應用程式狀態的 Jest 匹配器。

  8. Pogo 0.6
    ↳ Deno 的伺服器框架。

  9. Eruption
    ↳ React/TypeScript 的「下一代」樣板,建立在Vite之上。

程式碼和工具

  1. Billboard.js 3.6:基於 D3.js 的 JavaScript 圖表庫:非常強大且流行的聊天庫現在具有官方 React 包裝器、新的「線性漸變」條形圖選項和。

  2. Liqe: Lightweight Lucene-like Parser and Search Engine:讓您使用 Lucene 風格的搜尋查詢語法來查詢或測試 JavaScript 物件中已有的內容,例如filter(parse('height:>170'), people);

  3. create-t3-app:互動式 CLI,用於快速建立一個自以為是的、全棧的、型別安全的 Next.js 專案:甚至還有來自Theo 的10 分鐘截圖視訊- ping․gg展示瞭如何使用它。

  4. Glide.js 3.6:無依賴的滾軸和輪播控制元件:「專為滑動而設計。不多,不多」,創作者說。麻省理工學院許可和成熟。

  5. Preview.js:IDE 中的快速元件預覽:此擴充套件將自動在預覽中的元件中生成有效的道具,支援 CSS-in-JS,並且可以離線工作。適用於 VS Code 和 IntelliJ/WebStorm,也支援 Solid 和 Vue 元件。