前端周刊發(fā)表每周前端技術(shù)相關(guān)的大事件、文章教程侍咱、一些框架的版本更新耐床、以及代碼和工具。每周定期發(fā)表楔脯,歡迎大家關(guān)注撩轰、轉(zhuǎn)載。
<span style="color:red;">如果外鏈不能訪問(wèn),關(guān)注公眾號(hào)前端每周看钧敞,里面有解決辦法</span>
大事件
- Angular v14 Released——長(zhǎng)期存在的 JavaScript 框架的一個(gè)關(guān)鍵版本蜡豹,其使用的地方比大多數(shù) JavaScript 開發(fā)人員意識(shí)到的要多得多(尤其是在大公司中)。一些新的東西:
- 獨(dú)立組件可提供更簡(jiǎn)單的創(chuàng)作體驗(yàn)溉苛。
- 嚴(yán)格類型的反應(yīng)形式镜廉。
- 改進(jìn)的更改檢測(cè)。
- 可訪問(wèn)性的改進(jìn)愚战。
JavaScript 和 TypeScript 中的 Monorepos——關(guān)于在 JavaScript中使用 monorepos(也有解釋)的全面介紹和教程娇唯,包括它們的好處以及如何使用 Yarn 創(chuàng)建和管理一個(gè)。
Jest Image Snapshot: A Jest Matcher for Image Comparison——使用 American Express 的這個(gè)工具向視覺回歸測(cè)試問(wèn)好寂玲。在測(cè)試中為您的應(yīng)用拍攝圖像快照塔插,并將它們與基線進(jìn)行比較。如果您想忽略細(xì)微的變化并且只拋出巨大的差異拓哟,它甚至可以處理公差想许。
文章
您現(xiàn)在可以使用 JavaScript 在 Microsoft Word 中制作游戲 — Office 插件是一種使用 JavaScript 編寫 Office 應(yīng)用程序腳本的機(jī)制。你可以用它來(lái)做一些有用的事情断序,或者流纹,如果你和這個(gè)人一樣聰明,你可以創(chuàng)建一個(gè)使用 Word 文檔作為畫布的圖形游戲违诗。
您可能不需要為您的 npm 分布式庫(kù)使用 Bundler漱凝。 — Colin 提出了一個(gè)很好的論點(diǎn),即盡可能干凈地運(yùn)行诸迟,但如果您愿意茸炒,還有很多其他選項(xiàng)的鏈接。
使用 Pinia 介紹 Vue.js 狀態(tài)管理 - Pinia現(xiàn)在是 Vue 的官方狀態(tài)管理庫(kù)(以前是 Vuex)阵苇,Tyler 在這里分享了他對(duì)它的興奮之情壁公。
如何使用 Vanilla JS、Twilio 和 Node 構(gòu)建群聊應(yīng)用程序 - 如果您不想自己將所有后端基礎(chǔ)設(shè)施放在一起......外包它慎玖。
在 Haskell 中將 JavaScript 的子集編譯為 ARM 程序集 - 其中一件您可能永遠(yuǎn)不需要做的事情贮尖,但如果有足夠的時(shí)間和意愿笛粘,您可能會(huì)想要做趁怔。
框架發(fā)布
- RE:DOM 3.28.0 – 微型 (2KB) UI 庫(kù)。
- gl-react 5.2 – React 中的 WebGL 著色器薪前。
- lint-staged 13.0 – 針對(duì)暫存的 git 文件運(yùn)行 linter润努。
- AVA 4.3.0 – Node.js 測(cè)試運(yùn)行器。
- Recoil 0.7.3 – 來(lái)自 Facebook 的 React 的替代狀態(tài)管理示括。
代碼和工具
Svelvet:用于基于節(jié)點(diǎn)的交互式圖表的 Svelte 組件庫(kù):您可以使用具有無(wú)縫縮放和平移铺浇、可拖動(dòng)交互性、可自定義邊緣/節(jié)點(diǎn)等的預(yù)構(gòu)建組件創(chuàng)建直觀的流程圖垛膝。
Shaka Player 4.1:播放自適應(yīng)媒體的庫(kù):在沒有插件或 Flash 的瀏覽器中播放 DASH 和 HLS 等格式鳍侣。它還可以通過(guò) IndexedDB離線播放媒體丁稀。
Glide Data Grid 4:適用于 React 項(xiàng)目的快速數(shù)據(jù)網(wǎng)格:自稱是“不折不扣、異骋芯郏快速的數(shù)據(jù)網(wǎng)格”线衫,可以支持多達(dá)數(shù)百萬(wàn)行,并具有豐富的渲染和 TypeScript 支持惑折。主頁(yè)上有一個(gè)簡(jiǎn)潔的演示授账,它也獲得了麻省理工學(xué)院的許可。
Terser:用于 ES6+ 的 JavaScript 'Mangler' 和 Compressor Toolkit: 一個(gè)可以從 Node 或命令行使用的壓縮工具惨驶。它去除注釋白热,壓縮變量名,刪除空格粗卜,并用更小的變體替換各種代碼模式屋确。
顏色圖例元素:在數(shù)據(jù)可視化中提供圖例的 Web 組件:使用 Lit/Lit-Element 和 D3.js 構(gòu)建。
highlight-code:A
<textarea>
with Automatic Syntax Highlighting —在這里試用续扔。API 允許您自定義語(yǔ)言乍恐、選項(xiàng)卡大小以及文本區(qū)域是否應(yīng)自動(dòng)擴(kuò)展以適應(yīng)。collect.js:100 多種數(shù)組和對(duì)象的便捷方法:類似于 Laravel 集合的 API:chunk测砂、flatten茵烈、shuffle、firstWhere砌些、mapWithKeys 等呜投。