蒲公英 · JELLY技術周刊 Vol.20: Vue3 極致優化——分析 Vue3 Compiler 告訴你為什麼這麼快
蒲公英 · JELLY技術周刊 Vol.20
性能優化是一條無盡的路，我們總是可以找到各種途徑去提升體驗，不論是響應時間還是按需載入，亦或是根據框架或者組件有針對性的優化都會是不錯的方法。如果你在使用 Vue3，那麼本期內容會告訴你如何完成高性能的渲染函數；React 的開發者也可以在本期中找到 TS 和 React 的最佳實踐；同樣本期中你也會找到新一代 Web 性能體驗的指標，學無止境，術有乾坤，讓我們開啟本期的內容吧。
登高遠眺
天高地迥，覺宇宙之無窮
前端框架
TypeScript + React 的最佳實踐
使用 TypeScript 編寫 React 應用的類型 Cheatsheets，也可以看做是 TypeScript + React 最佳實踐。它介紹了我們在使用 React 各種特性時最佳的 TypeScript 類型寫法，幫助你解答各種類型上的問題。看完這篇，媽媽再也不用擔心我不會寫 tsx 了。
Vue3 Compiler 優化細節，如何手寫高性能渲染函數
Vue3 通過編譯時和運行時相配合，讓 diff 性能進一步得到提升。文章詳細介紹了 Compiler 會對模板分析出哪些關鍵資訊，運行時又是怎樣利用這些資訊對 diff 進行優化的。假如我們不編寫 template 而是直接編寫渲染函數，作者也在文末介紹了我們怎麼樣編寫渲染函數能夠讓 diff 進入優化模式。文章整體內容非常硬核，需要花費一定時間的進行閱讀，希望讀者能堅持到到最後。這裡姑且引用文章中的最後一句：”Don’t stop learning…”，共勉。
基礎技術
Core Web Vitals–聚焦新一代Web性能體驗指標
對於如何衡量用戶體驗，Google提供了多個工具（Lighthouse等等），在Chrome83中新增了Core Web Vitals指標。主要關注用戶體驗的3個方面：載入、交互性和視覺穩定性。對應的指標為：LCP、FID、CLS。降低使用者門檻。
美國人如果把根域名伺服器封了，中國將會從網路上消失？
自從美國宣布「清潔網路」行動後，很多懂點網路的人，第一反應是，美國人會下手根域名伺服器嗎？這裡先給出簡要回答：不排除這種可能性，但並不是沒有辦法。一句話原因：雖然根不在我們手裡，但我們有鏡像。
圖形編程
「親親抱抱舉高高」？這款遊戲滿足你對VR的所有期待
虛擬現實的概念在近幾年被提及的越來越頻繁，但對於大眾來說似乎還是一款「科幻」產品。由 Valve 公司出品的《半衰期》VR 遊戲，結合 VR 設備操作上更為多樣的操控設備，進行了不同於以往滑鼠鍵盤操控遊戲的交互嘗試，使得遊戲中的角色動作更為接近真實世界，也產生了更多的可能性。
人工智慧
3D特效師可以下班了
還記得「搶錢大樓」 SM 娛樂公司門口的電子屏海浪嗎？一看就很貴。但 DeepMind 和斯坦福等一眾科學家研究出了一款圖網路模擬器——GNS 框架，轉變思路，由當前市場上普遍使用的通過物理規律進行 CG 計算，轉向機器學習以實現物理模擬器的方案。這將大大降低 CG 特效的門檻，可能將深遠地影響到這一市場。
滄海拾遺
滄海拾遺，積跬步以至千里
京喜小程式跨端開發實戰
京喜小程式的在跨端開發上的開發與優化實戰文，詳細講述了 19 年雙十一期間，京喜改版中面臨的一系列問題，以及相關的思考。其中對於 Web、小程式、RN 三端詳細提出了很多思路和實踐集錦，很值得借鑒。
小程式體驗評分滿分優化
同樣是京喜小程式，歷經多次改版和優化後，在 Audits 評分中已經獲得了滿分。文中提到了多種優化的細節和方法，嘗試了很多優化的可能，相信這些思路能夠在其他的項目中，也能夠得到應用，並大幅提升性能和用戶的體驗。
「蒲公英」期刊，每周更新，我們專註於挖掘「基礎技術、工程化、跨端框架技術、圖形編程、服務端開發、桌面開發、人工智慧、設計哲學、前端框架」等多個大方向的業界熱點，並加以專業的解讀；不僅如此，我們還會推介精選凹凸技術文章，向大家呈現團隊內的研究技術方向。
抬頭仰望，蒲公英的種子會生根發芽，如夏花絢爛；格物致知，我們登高遠眺、滄海拾遺，以求積硅步而至千里。
歡迎關注凹凸實驗室部落格：aotu.io
或者關注凹凸實驗室公眾號（AOTULabs），不定時推送文章：
