《前端技術觀察》是由字節跳動IES前端團隊收集、整理、推薦的業界高品質前端資源合集,主要分爲如下幾個板塊:javascript
-
Highlights -
優秀的工具、庫 -
好的教程、深度解讀已有技術的文章 -
業界最新的技術、熱點文章 -
業界對(新)技術的深度地、優秀地實踐 -
Tutorial -
Tools And Codes
《前端技術觀察》的目的是讓你們:css
-
更及時的瞭解到業界最新的技術 -
受益於高質量的教程、文章 -
瞭解業界更優秀的代碼、工具 -
更多地、氛圍更濃厚地討論、研究、落地技術
highlights
瀏覽器如何節流requestAnimationFrame(英)
文章探討了何時而且爲何在特殊場景下rAF被節流。html
https://mattperry.is/writing-code/browsers-may-throttle-requestanimationframe-to-30fps前端
使用HTML和CSS新特性實現響應式佈局(英)
除了使用媒體查詢和flexbox和grid之類的現代CSS佈局建立響應網站以外,本文介紹了HTML特性和CSS的新函數minimum,clamp等來實現響應式。java
https://css-tricks.com/beyond-media-queries-using-newer-html-css-features-for-responsive-designs/ios
JavaScript類裝飾器新提議(英)
針對JavaScript類裝飾器的新提議,目前處於TC39流程的第二階段,它提供了一種經過將方法和其餘」語法形式」包裝額外功能來擴展自身的方法,而且增長了元數據,此提案不一樣於2018年向TC39提出的裝飾器,Babel 7支持的裝飾器以及在TypeScript中啓發了`實驗性'裝飾器的設計器。git
https://github.com/tc39/proposal-decorators/blob/simplified/README.mdgithub
Brahmos一個小巧的構建用戶界面庫,但沒有使用虛擬DOM(英)
Brahmos是一個使用現代React API和本機模板構建用戶界面的庫,具備輕巧快速,使用jsx語法編寫(可是源碼佔用空間相比jsx更小),而且沒有使用VDOM的特性。web
https://github.com/brahmosjs/brahmostypescript
EVT: 新型EventEmitter,更安全更友好(英)
EVT, 新型EventEmitter,相比於原有的EventEmitters,EVT提供了typescript的類型推斷確保類型安全等等EventEmitter不具有的特色,而且已經適用於全部的js運行環境。
https://github.com/garronej/evt
Inspect: 移動Web DevTools的「新標準」(英)
適用於macOS和Windows的開發人員工具,可檢查和調試iOS設備上的Web應用程序和網站。支持在設備上經過USB或WiFi調試Safari, WebViews(和Chrome),也能夠在windows上調試ios web,同時支持多種框架的devtools等多個特色。
https://inspect.dev/
Mongoose 5.10新增樂觀併發控制(樂觀鎖)(英)
Optimistic concurrency核心思想是追蹤文檔的版本並在每次保存後增長版本,當在加載文檔和保存文檔之間,此時數據庫的版本發生變化,則會提早報錯。Optimistic concurrency能夠有效的保證依賴於多個屬性的邏輯驗證,確保其具備一致的數據視圖。
http://thecodebarbarian.com/whats-new-in-mongoose-5-10-optimistic-concurrency.html
prefers-reduced-motion-media特性能夠幫助緩解運動敏感人羣的不適(英)
屏幕上的某些運動可能會對運動敏感的人產生影響,如眩暈,噁心等。經過設置prefers-reduced-motion-media特性能夠給這些人更友好的體驗。
https://www.smashingmagazine.com/2020/09/design-reduced-motion-sensitivities/
App審覈流程更新(英)
更新內容:對於App Store中已存在的應用程序,錯誤修復將再也不因違反準則而延遲,但與法律問題相關的錯誤修復除外。相反,能夠在下一次提交時解決違反準則的狀況。
https://developer.apple.com/news/?id=84w3e5bm
tutorial
Visual Studio Code 擴展開發指南(英)
使用 TypeScript 開發 Visual Studio Code 擴展
https://javascriptweekly.com/link/95088/web
將表單數據保存到 Google Sheet(英)
用 express 和 Google Sheets API 將數據從 HTML 表單 保存到 Google Sheet
https://javascriptweekly.com/link/95084/web
TypeScript 4.0 發佈(英)
TypeScript 語法變化以及編輯器支持
https://javascriptweekly.com/link/94736/web
Designing a JavaScript Plugin System(英)
使用設計模式更好的設計代碼結構
https://javascriptweekly.com/link/94726/web
tools And codes
Print.js:小型的打印PDF插件(英)
Print.js的主要目的是幫助咱們直接在咱們的應用程序中打印PDF文件,而無需離開界面,也不使用嵌入
https://javascriptweekly.com/link/94746/web
Stencil:用於構建 Web Components 和 PWA
2.0版本發佈,幾乎沒有重大更改
https://github.com/ionic-team/stencil
vanilla-colorful.js:一個小型的拾色器
小型、快速、支持 TS、支持移動端
https://github.com/web-padawan/vanilla-colorful
Cropper.js:JavaScript 圖像裁剪器
一直維護了五年的JavaScript庫,提供了 ES module 導出
https://fengyuanchen.github.io/cropperjs/
本文分享自微信公衆號 - 圖雀社區(tuture-dev)。
若有侵權,請聯繫 support@oschina.cn 刪除。
本文參與「OSC源創計劃」,歡迎正在閱讀的你也加入,一塊兒分享。