前端周刊發(fā)表每周前端技術(shù)相關(guān)的大事件乘粒、文章教程豌注、一些框架的版本更新、以及代碼和工具灯萍。每周定期發(fā)表轧铁,歡迎大家關(guān)注、轉(zhuǎn)載旦棉。
<span style="color:red;">如果外鏈不能訪問(wèn)齿风,關(guān)注公眾號(hào)前端每周看,里面有解決辦法</span>
大事件
使用 Google 的 CrUX 比較 JS 框架的性能——Chrome用戶體驗(yàn)報(bào)告 ( CrUX ) 是從真實(shí)世界的 Chrome 用戶收集的用戶體驗(yàn)指標(biāo)數(shù)據(jù)集绑洛,可以使用它來(lái)分析和比較不同 UI 框架的性能配置文件
Meta 將 Jest 項(xiàng)目轉(zhuǎn)移到 OpenJS 基金會(huì)——Meta救斑,née Facebook,在 10 多年前創(chuàng)建了現(xiàn)在流行的 Jest JavaScript 測(cè)試框架真屯,雖然它將在內(nèi)部繼續(xù)使用脸候,但他們現(xiàn)在認(rèn)為它“功能完整”,因此認(rèn)為它可能會(huì)蓬勃發(fā)展在更廣泛的社區(qū)中得到更好的管理绑蔫。
關(guān)于 React 即將推出的useEventHook的思考——用于新的基本 React 鉤子或定義一個(gè)“看到”新的 props/state 但具有穩(wěn)定函數(shù)標(biāo)識(shí)的事件處理程序运沦。
文章
使用 Web 音頻 API 構(gòu)建樂(lè)器 — 我們?cè)谇岸祟I(lǐng)域最喜歡的作家之一回來(lái)了,她簡(jiǎn)單地介紹了她如何構(gòu)建Keyboard Accordion配深,這是一種基于 Web 的全音階手風(fēng)琴(我很難以任何連貫的方式演奏它一切携添,但聽(tīng)起來(lái)很棒)。
了解您的瀏覽器的性能分析器 — 如果您的瀏覽器開(kāi)發(fā)工具中的性能選項(xiàng)卡看起來(lái)有點(diǎn)嚇人篓叶,那么本文試圖總結(jié)您需要了解的關(guān)于它所顯示內(nèi)容的絕對(duì)基礎(chǔ)知識(shí)薪寓。
JavaScript 開(kāi)發(fā)人員從 0% 到 80% 的 Rust - 如果關(guān)于用 Rust (重新)編寫(xiě) JavaScript 工具的永無(wú)止境的消息還沒(méi)有讓你感到厭倦,也許你想知道如何從 JS 的角度學(xué)習(xí) Rust澜共。Daniel Bulant 的Rust 基礎(chǔ)向叉,從高級(jí)程序員的角度來(lái)看,也是一個(gè)很好的解釋者嗦董。
使用 PyScript 在瀏覽器中運(yùn)行 Python - 從 Rust 到 Python母谎,我們開(kāi)始了。最近發(fā)布的PyScript提供了一種在網(wǎng)頁(yè)上編寫(xiě) Python 代碼的簡(jiǎn)單方法京革,就像您現(xiàn)在編寫(xiě) JavaScript 一樣奇唤。這個(gè) 8 分鐘的截屏視頻稍微展示了一點(diǎn)。
用 JavaScript 制作一個(gè)基本的“落沙”游戲 - 一個(gè)平靜而平和的教程匹摇,其中包含貫穿始終的示例咬扇。
框架發(fā)布
- Wild Wild Path 3.0 – 使用路徑和查詢挖掘?qū)ο蟆?/li>
- GraphQL Yoga 2.0 – 完整的 GraphQL 服務(wù)器功能。
- Hexo 6.2.0 – Node.js 博客框架廊勃。
- graphql-schema-linter 3.0 - 驗(yàn)證 GraphQL 模式定義懈贺。
- pnpm 7.1.0
- Solid 1.4 – 很棒的聲明式 UI 庫(kù)经窖。
代碼和工具
InfiniteGrid 4.3:在網(wǎng)格布局上無(wú)限排列卡片元素:非常成熟和成熟,可以輕松創(chuàng)建由不同大小的卡片元素組成的網(wǎng)格梭灿。它也適用于您選擇的框架画侣,并且在桌面和移動(dòng)設(shè)備上都很滿意。
blursort 1.9: Fast Fuzzy Search Library:靈感來(lái)自 Sublime Text 中的模糊搜索堡妒。查看現(xiàn)場(chǎng)示例- 確實(shí)感覺(jué)很快配乱。
Parvus:無(wú)依賴的可訪問(wèn)燈箱:我喜歡它所說(shuō)的不要在網(wǎng)頁(yè)上使用疊加層,但如果必須皮迟,使用它搬泥!有一個(gè) CodePen 示例。
crypto-random-string 5.0:生成加密強(qiáng)隨機(jī)字符串:例如:cryptoRandomString({length: 10})可能會(huì)返回2cf05d94db(雖然我真的希望你嘗試它時(shí)不會(huì)返回伏尼,否則它會(huì)失敗??)∮蛹兀現(xiàn)在可以在 Node.js 和瀏覽器中使用。
Reagraph: WebGL Graph Visualizations for React:一個(gè)在底層使用 WebGL 的高性能網(wǎng)絡(luò)圖形可視化庫(kù)烦粒。您可以使用的基本示例休溶。
DFlex:適用于所有 JS 框架的拖放庫(kù):這是一個(gè)原生 JavaScript 解決方案,專注于良好的性能和易于實(shí)現(xiàn)扰她。在這里嘗試一些演示兽掰。
nve 15.0:使用特定的 Node.js 版本運(yùn)行事物:使用特定版本(或多個(gè)版本)的 Node.js 輕松執(zhí)行文件、命令或 REPL徒役。例如孽尽,您可以一次運(yùn)行npm test多個(gè)版本。
actions/github-script:用 JavaScript 編寫(xiě) GitHub API 腳本的工作流程:如果你想編寫(xiě)通過(guò) GitHub API 執(zhí)行操作的 GitHub 操作忧勿,這可以讓你的生活更輕松杉女。