前端周刊第三十八期
- 2022 年 10 月 7 日
- 筆記
前端周刊發表每周前端技術相關的大事件、文章教程、一些框架的版本更新、以及程式碼和工具。每周定期發表，歡迎大家關注、轉載。
如果外鏈不能訪問，關注公眾號「前端每周看」，裡面有解決辦法
大事件
-
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 組件。
文章
-
在 .NET 7 中使用任何 JavaScript 應用程式中的 .NET — 通過著名的TodoMVC 移植到通過 WebAssembly 運行的 .NET 來展示 JavaScript 到 .NET 的互操作Blazor是瀏覽器中最常與 .NET 和 C# 關聯的框架，但該支援也獨立於 Blazor 工作。
-
使用 JavaScript 編寫可組合 SQL — 使用 SQL 資料庫的方法有很多，作者更喜歡純 SQL 和Slonik。如果您更喜歡更抽象的東西，當然， Knex.js仍然是一個選擇。
-
在 React 中構建一個可訪問的選擇組件 — 一步一步（或者我們應該說一磚一瓦？）教程，介紹如何構建一個專門考慮可訪問性的選擇組件，這是一個像 LEGO 這樣的國際企業所關注的主題心。
-
使用 JavaScript 進行電話振動的快速指南 — 了解如何做到這一點，然後不要這樣做
框架發布
-
Electron 21
-
Node.js 18.10.0（當前）
-
Astro 1.4
-
Neutralino.js 4.8
↳ 輕量級跨平台桌面應用程式框架。 -
Boa 0.16
↳ 用 Rust 編寫的 JS 詞法分析器、解析器和編譯器。 -
react-number-format 5.0
↳ 用於在輸入中格式化數字或作為文本的組件。 -
jest-native 5.0
↳ 用於測試 React Native 應用程式狀態的 Jest 匹配器。 -
Pogo 0.6
↳ Deno 的伺服器框架。 -
Eruption
↳ React/TypeScript 的「下一代」樣板，建立在Vite之上。
程式碼和工具
-
Billboard.js 3.6：基於 D3.js 的 JavaScript 圖表庫：非常強大且流行的聊天庫現在具有官方 React 包裝器、新的「線性漸變」條形圖選項和。
-
Liqe: Lightweight Lucene-like Parser and Search Engine：讓您使用 Lucene 風格的搜索查詢語法來查詢或測試 JavaScript 對象中已有的內容，例如filter(parse(‘height:>170’), people);
-
create-t3-app：互動式 CLI，用於快速建立一個自以為是的、全棧的、類型安全的 Next.js 項目：甚至還有來自Theo 的10 分鐘截屏影片- ping․gg展示了如何使用它。
-
Glide.js 3.6：無依賴的滑塊和輪播控制項：「專為滑動而設計。不多，不多」，創作者說。麻省理工學院許可和成熟。
-
Preview.js：IDE 中的快速組件預覽：此擴展將自動在預覽中的組件中生成有效的道具，支援 CSS-in-JS，並且可以離線工作。適用於 VS Code 和 IntelliJ/WebStorm，也支援 Solid 和 Vue 組件。
-
‘Photoshop 將圖層快速導出到文件’ ：你知道你可以使用 JavaScript編寫 Adobe Photoshop 腳本嗎？它非常強大，但是當我使用它時，我發現很難找到可以學習的好例子——所以這個項目非常受歡迎。 -
Ezno：一個實驗性的 JavaScript 編譯器：一長串 JavaScript 編譯實驗中的最新一個——我們都在這裡。這篇文章解釋了哲學和推理以及為什麼類型檢查是它的核心： 「您可以將其視為 TSC 的擴展，類似的想法但更進一步。」
-
textlint: 用於文本和 Markdown 的可插拔 Linting 工具：想像一下 ESLint，但用於自然語言和標點符號。開箱即用地支援 Markdown 和文本，但可以添加其他格式（例如 HTML）。
