本周熱點
欄目主編：平俠
官宣！前端熱愛，技術無界，第十五屆 D2 前端技術論壇，我們雲端相聚！
https://mp.weixin.qq.com/s/xucSDGSEVW_ln_bAzBuq9Q前端小夥伴們大家好，很開心在 1024 程式員節即将到來之際跟大家分享今年 D2 的最新消息。在 D2 走過那些年裡，伴随了前端見證了大前端領域翻天覆地的變化。如今，跨端的研發、全棧的探索、智能化的代碼生成、雲端一體研發等，前端總在用自己的創新和活力來重新定義着“未來前端”。在這個特别的 2020 年，前端熱愛，技術無界，第十五屆 D2 前端技術論壇，我們相信将最優質的内容和最前沿的技術趨勢帶給前端開發者會是最好的禮物！過去的14屆D2裡面彙集了無數前端的心血和情懷，今年我們也希望能夠集大家之力，讓我們的D2普惠到更多的前端開發者，請大家幫忙一起轉發，一起擴散，讓更多人看到！！（上優酷搜“ D2前端技術論壇”馬上參與）
React v17.0
https://reactjs.org/blog/2020/10/20/react-v17.htmlThe React 17 release is unusual because it doesn’t add any new developer-facing features. Instead, this release is primarily focused on making it easier to upgrade React itself. In particular, React 17 is a “stepping stone” release that makes it safer to embed a tree managed by one version of React inside a tree managed by a different version of React. It also makes it easier to embed React into apps built with other technologies. Releated: What Vue.js Does Better Than React.
Node.js v15.0.0 is here!
https://nodejs.medium.com/node-js-v15-0-0-is-here-deb00750f278Just some of the features delivered in Node.js 15: AbortController, N-API Version 7, npm 7, Throw on unhandled rejections, QUIC (experimental), V8 8.6.
The Tyranny of Metrics
https://nemethgergely.com/blog/the-tyranny-of-metricsThere seems to be a growing trend in technology--and in all aspects of our lives, really--to measure everything: business outcomes, organizational success, and individual performance. I wrote about engineering productivity and how I disagree with measuring individual performance based on metrics before, so I was excited to start reading The Tyranny of Metrics by Jerry Z. Muller. In the book, Muller draws on both Campbell and Goodhart's expertise, then provides more insights on metrics fixation and the detrimental effects they have on our everyday life. Sometimes, the best metric is no metric.
Solid Relevance
http://blog.cleancoder.com/uncle-bob/2020/10/18/Solid-Relevance.htmlThe SOLID principles remain as relevant to day as they were in the 90s (and indeed before that). This is because software hasn’t changed all that much in all those years — and that is because software hasn’t change all that much since 1945 when Turing wrote the first lines of code for an electronic computer. Software is still if statements, while loops, and assignment statements — Sequence, Selection, and Iteration. Every new generation likes to think that their world is vastly different from the generation before. Every new generation is wrong about that; which is something that every new generation learns once the next new generation comes along to tell them how much everything has changed. So let’s walk through the principles, one by one.
深度閱讀
欄目主編：侑夕、紫益
🧐一周精讀🧐《設計模式 - Prototype 原型模式》
https://github.com/dt-fe/weekly/170.精讀《設計模式 - Prototype 原型模式》.md通過三個生動的例子與 JS 示例代碼，幫助前端的你了解設計模式，讓我們一起積累不過時的知識！
Prototype（原型模式）屬于建立型模式，既不是工廠也不是直接 New，而是以拷貝的方式建立對象。意圖：用原型執行個體指定建立對象的種類，并且通過拷貝這些原型建立新的對象。
2020 年你不應該錯過的 CSS 新特性
https://mp.weixin.qq.com/s/n8E9htw0xXMyxHALLae_Eg作者從 2020 第四屆倫敦 CSS 分享會what's new in 2020 PPT出發，加上自己了解的角度講了近 24 個新特性，很是值得大夥研究。
聊聊 ESM、Bundle 、Bundleless 、Vite 、Snowpack
https://segmentfault.com/a/1190000025137845之前潮流周刊第 5 期有介紹過用「其他語言來寫 JS 工具」，剛好看到一篇國内文章将這幾個都講了一遍如何使用，可全面學習下。
Meet Face ID and Touch ID for the Web
https://webkit.org/blog/11312/meet-face-id-and-touch-id-for-the-web/來做 webkit 官方一篇 Blog，将 Face ID 和 Touch ID 應用到 Web 中，一種很好的代替密碼登入的方式，很是期待早日落地。
阿裡拍賣全鍊路導購政策首次揭秘
https://mp.weixin.qq.com/s/pMrs8JiJGrzIOhtDHGlutA技術和業務的關系一般都是密不可分的，通過此文來深入了解下阿裡拍賣的全鍊路導購政策技術吧。
計算機網絡基礎知識總結
https://juejin.im/post/6885468617580904455很像大學計算機網絡考試前整理的書本知識筆記，講到發展曆程、協定、網絡核心概念、實體媒介等内容，對于已工作的前端同學可當做看教科書式複習一波~
開源資訊
主編：侑夕
Auto.js-安卓平台上的 JavaScript 自動化工具
https://github.com/hyb1996/Auto.js目前網絡上薅羊毛用的一個神器工具，借此來完成一些自動化的點選、領取，有 Android 的同學可去玩玩。
FingerprintJS-現代靈活的浏覽器指紋庫
https://github.com/fingerprintjs/fingerprintjs從浏覽器指紋生成使用者的唯一辨別符，Fingerprint 和 cookies 以及本地存儲不同，它在隐私模式下甚至在清除浏覽器資料下依然有效，值得一試。
SpaceVim 子產品化 Vim 配置環境
https://github.com/SpaceVim/SpaceVimSpaceVim 是一個子產品化的 Vim 內建配置環境，以子產品的方式組織插件，同時為不同的語言開發量身定制了相關的開發子產品，這些子產品通常包括自動補全， 文法檢查、格式化、調試、REPL 等相關功能，Vim 愛好者應該比較熟悉的一個工具。
Actionsflow-代替 IFTTT 的開源自動工具流
https://actionsflow.github.io/docs/使用 Actionsflow，可以連接配接你喜歡的應用、資料和 api，在操作發生時做一些接收通知，同步檔案，收集資料自動化的事情。
ChineseBQB-中國表情包大集合
https://github.com/zhaoolee/ChineseBQB原來真的有系列，有同學居然将表情包大部分給收集整理起來了，感覺可以拿着這個和輸入法、聊天工具做一些有趣結合事情。
CSS 前沿
主編：大漠
2020年CSS發展調查開始了
https://stateofcss.com/2020年CSS發展狀态的調查開啟了，為了能讓CSS發展的更好，請花一點點時間完成該調查。
CSS Background Patterns
https://www.magicpattern.design/tools/css-backgrounds純CSS繪制的紋理。沒有CSS做不到的，隻有你想不到的。
4 things you need to know about Atomic Design
https://uxdesign.cc/4-things-you-need-to-know-about-atomic-design-e0d3e8269420如果你不太喜歡BEM，更愛Atomic Design的話，那麼這篇文章會告訴你使用Atomic Design需要特别注意的四個點。
1個Div可以做什麼：1個div和CSS繪制的收音機
https://codepen.io/lynnandtonic/full/GRqoEqZ這一期給大家展示的Demo是，使用一個 div 和CSS繪制收音機！
BEM Visually Explained
https://medium.com/@JonUK/bem-visually-explained-6e869373bbfd如果你總是被類名的命名感到困惑和選擇器權重沖突帶來煩惱，那麼BEM是可選方式之一。而且BEM也是衆多CSS方法論中最被認可之一，這篇文章用圖解的方式向大家闡釋了BEM在實際項目中應該如何使用。
Why do [most] developers hate CSS?
https://uxdesign.cc/why-do-most-developers-hate-css-63c92bce36ed都說CSS很簡單，但又都說CSS不容易。估計也正是因為這個，才讓開發者讨厭CSS。文章中聊了聊為什麼開發者會讨厭CSS，如果你也是讨厭她，那麼可以看看文章中的觀點和你是不是同樣的。
Beautiful Custom List Styles Using Modern CSS
https://medium.com/front-end-weekly/custom-list-styles-using-marker-710ad80ce760美化清單标記符，以往更多使用的是
list-style
，但從現在開始，我們可以開始使用真正的清單标記符
::marker
來美化清單，還可以清單标記符加樣式。
标準化動态
主編：彼洋
Chrome 86 特性 Cache Partition (緩存分區) 解讀
https://www.yuque.com/docs/share/81e9e6f1-8371-4ee4-89d9-6a869c1081212020年10月份釋出的 Chrome 86 中， 還有一項重要特性。為了保護隐私，它改變了浏覽器核心緩存元件 HTTP Cache的工作方式，開始啟用“緩存分區 (cache partitioning)”機制。從此，不同站點将無法使用同一緩存資源。
墨者修齊
主編：十吾
全球空氣品質一覽
https://public.tableau.com/en-gb/gallery/air-we-breathe?tab=viz-of-the-day&type=viz-of-the-dayChristian Felix 制作的這幅資訊可視化作品研究了全球空氣污染的現狀，以PM2.5以及其他相關名額來評估每個城市的空氣污染程度。
U.S. Wind Map
http://hint.fm/wind/這是美國 15 年的一個動态風速可視化項目，模拟了全國各地的風速和方向。
創作例程
https://www.informationisbeautifulawards.com/showcase/483-creative-routines創作者（作曲家，畫家，作家，科學家，哲學家）如何找到時間創作作品？梅森·柯瑞（Mason Currey）調查了數百名創意者為了節省時間，每天工作而運用的嚴格的“每日儀式”。有些人遵循相同的紀律制度數十年，而另一些人則隻有在從事特定作品時才鎖定模式。“創意例程”将 Currey 研究的例程可視化。
檢視更多墨者修齊： https://www.yuque.com/mo-college/weekly/tnhea5#se0qr
它山之石
欄目主編：平俠、侑夕
State-Switch Controls: The Infamous Case of the "Mute" Button
https://www.nngroup.com/articles/state-switch-buttons/Summary: On–off controls that switch between two different system states need to clearly communicate to users both the current state and the state the system will move to, should the user press that control.
Atlassian - Moving to a cloud future, together
https://www.atlassian.com/migration/journey-to-cloudToday, the majority of you already benefit from the advantages of cloud, with more server and Data Center customers making the switch every day. To ensure we’re delivering the cloud experience you deserve, we’re sharpening our focus as a cloud-first company and making bold changes to our self-managed offerings.
王興：别輕視自己，别迷信他人
https://mp.weixin.qq.com/s/-8sC4WICGmSFhIbbfEa0_A本文為清華大學共青團團委舉辦“對話王興：20年，從心出發”主題活動，清華1997級電子系校友王興，在蒙民偉音樂廳向清華學子，分享人生經驗與創業曆程，并提出三點建議：第一，别太不把自己當回事；第二，也别太把自己當回事；第三，也别太把别人當回事，但要把客戶當頭等事。
隻有平庸的人，才總是處于最佳狀态
https://mp.weixin.qq.com/s/HAI71-EXSdNYlDGm3MGSzw如今，管理者面臨越來越複雜的問題，也面臨越來越不确定的變化，管理者要鍛煉哪幾種特質呢？最近，思考的時間比平時多了一些。借此機會，就把我最近的思考，看到的一些好句子，梳理成給管理者的8個建議，分享給你，希望對你有所啟發。我們一個一個說。
OnRL: 基于線上強化學習的移動視訊傳輸優化
https://mp.weixin.qq.com/s/YPgxinHa_mGQ82waLqNDqA從 2019 年開始，淘系技術部内容社互動動團隊和北京郵電大學周安福教授一起着手研究更好的基于機器學習的智能擁塞控制算法，在實驗室環境完成原型驗證後在淘寶直播的生産環境做實際效果對比，從實際資料來看效果明顯，後面梳理出這篇總結。
浏覽器是如何排程程序和線程的？
https://mp.weixin.qq.com/s/bkSmKYGHk0V5eZIfuSTNyQ作者以 Chrome 為例，給你淺顯介紹線程和程序這兩個概念，看完後再去學習 JavaScript 的執行機制會更便于了解。
iOS 性能優化：優化 App 啟動速度
https://mp.weixin.qq.com/s/h3vB_zEJBAHCfGmD5EkMcw從 iOS 啟動的名詞解釋、啟動介紹、測試 App 啟動時間最後到使用 Instruments 分析和優化 App 啟動過程以及如何監控時間來一一介紹，前端同學可當做科普文來看。
手機建築攝影：從了解建築之美開始
https://daily.zhihu.com/story/9729231本文主要從設計角度講手機建築攝影，看完後很有一種「建築是凝固的音樂」的完美诠釋，也不由播放起「重塑雕像的權利」的音樂。
作弊與反作弊的較量：分屏器真的安全嗎？
https://zhuanlan.zhihu.com/p/155819108不少高校由于疫情将考試從線下搬到了線上，但不同于線下，線上監考由于增加了更多不可控因素，作者用盡可能通俗易懂的方式，向大家分享一些作弊與反作弊的知識，很是潮流。
關注「Alibaba F2E」
把握阿裡巴巴前端新動向