前端周刊發(fā)表每周前端技術(shù)相關(guān)的大事件蒸走、文章教程仇奶、一些框架的版本更新、以及代碼和工具比驻。每周定期發(fā)表该溯,歡迎大家關(guān)注、轉(zhuǎn)載别惦。
<span style="color:red;">如果外鏈不能訪問狈茉,關(guān)注公眾號前端每周看,里面有解決辦法</span>
大事件
Sliderland:一個極簡主義的編碼游樂場——這是一種滑塊式的可視化掸掸,您可以使用簡單的公式進(jìn)行編碼(看看這個)氯庆。代碼很簡單,但包含一些簡潔的功能扰付,例如由ffmpeg.wasm提供的 WebAssembly 驅(qū)動的 MP4 記錄器堤撵。
Playwright 現(xiàn)在可以測試 React、Vue 和 Svelte 組件——Playwright是 Microsoft 的 Node.js 瀏覽器控件庫羽莺,它采取了一個有趣的步驟实昨,允許您使用 Playwright 測試(Playwright 自己的測試運(yùn)行器)使用 Playwright 的所有功能以編程方式測試您的組件。
Web 應(yīng)用程序 101 ——一篇涉及構(gòu)建現(xiàn)代網(wǎng)站所涉及的許多結(jié)構(gòu)概念的文章盐固,從最簡單的 HTML 頁面到服務(wù)器端呈現(xiàn) (SSR) 和靜態(tài)站點生成 (SSG)荒给。不是教程,而是為您繪制建筑圖片刁卜。
文章
使用 JavaScript 和 MIDI 構(gòu)建動畫鋼琴鍵盤 — 如果您喜歡 Tania Rascia上周的手風(fēng)琴锐墙,這篇精美的帖子適合您。Jamie 正在做的工作也在為他的爵士鋼琴培訓(xùn)網(wǎng)站提供服務(wù)长酗。
為什么不需要void 0 — JavaScript 的void運(yùn)算符多年來一直以一些有趣的方式使用溪北,undefined但 Lars 認(rèn)為undefined現(xiàn)在是更好的選擇。
RFC 9239:ECMAScript 媒體類型的更新 - 其中之一“我是否需要知道這一點夺脾,即使這聽起來很重要之拨?” 話題。Axel 博士保持簡單咧叭,但本質(zhì)上 JavaScript 的 MIME 類型現(xiàn)在是明確 text/javascript的蚀乔,并且.mjs是 JS 模塊的注冊文件擴(kuò)展名。
將 Node-RED 部署到 Google App Engine - Node-RED是一種基于 JavaScript 的低代碼事件驅(qū)動編程環(huán)境菲茬,通常與物聯(lián)網(wǎng)相關(guān)聯(lián)吉挣,并以各種方式將硬件設(shè)備整合在一起派撕。但是您也可以將其部署在云中,以創(chuàng)建您自己的自動化系統(tǒng)睬魂。
用 JavaScript 制作一個基本的“落沙”游戲 - 一個平靜而平和的教程终吼,其中包含貫穿始終的示例。
框架發(fā)布
- Mithril.js 2.2 – 流行的 SPA 框架氯哮,2年來首次發(fā)布际跪。
- Electron React Boilerplate 4.6 - 現(xiàn)在使用 React 18。
- Helmet 5.1.0 - 使用 HTTP 標(biāo)頭保護(hù) Express.js 應(yīng)用程序喉钢。
- Deno 1.22
- melonJS 10.8.0 – JS 2D 游戲引擎姆打。
- Angular 14 Release Candidate
- Node 18.2.0 – Node Weekly中的更多內(nèi)容。
代碼和工具
JSON 掩碼:一種選擇 JS 對象特定部分的方法:給 JSON 掩碼一個對象和一個(XPathesque)查詢肠虽,你會得到一個具有相同結(jié)構(gòu)但只包含其余部分“掩碼”的對象(由此得名)幔戏。
Fontkit:適用于節(jié)點和瀏覽器的高級字體引擎:適用于 TrueType、OpenType税课、WOFF 和其他格式 — 支持將字符映射到字形闲延、替換、讀取指標(biāo)伯复、布局字形慨代、字體子集等邢笙。用作PDFKit PDF 生成庫的一部分啸如。
PushIn.js:適用于網(wǎng)頁的輕量級視差/推車/推入效果:在滾動時模擬交互式推車或推入動畫。主頁本身就是一個現(xiàn)場演示氮惯。
Vuestic 1.4.0:Vue 3 的開源 UI 庫:包含 50 多個可定制組件的庫叮雳。1.4.0帶來了 Nuxt 3 支持以及新的輪播和計數(shù)器組件。
Timewave:一個微型時鐘和日期庫(具有模擬支持):擁有“與 MomentJS 及其替代 Luzxon 的大部分功能相同的功能”妇汗,該庫還允許您以不同的速度并行運(yùn)行多個時鐘帘不。
Elder.js:一個專注于 SEO 的基于 Svelte 的靜態(tài)站點生成器:專為大規(guī)模構(gòu)建對 SEO 友好的站點而設(shè)計,名稱不僅僅是隨機(jī)的杨箭,它還用于在生產(chǎn)中運(yùn)行一個關(guān)于尋找老年人住房的站點寞焙。
minimatch: A Glob Matcher:將 glob 樣式的表達(dá)式轉(zhuǎn)換為正則表達(dá)式。由 內(nèi)部使用npm互婿。
在 100 LOC 內(nèi)實現(xiàn)的 React 路由器:任何人都可以從中學(xué)習(xí)的實驗之一捣郊。