本期技術週刊一起看看如何做好性能優化？，歡迎大家閲讀 ～
文章推薦
《近期對前端性能優化的總結》 作者：南城大前端
前端性能優化不管是在面試中還是在實際開發過程中，都是每一個前端開發工程師都必不可少的能力。本文總結本人多年開發經驗中對前端性能優化的理解，希望對大家有所幫助，因涉及的優化方向較多，針對某些細節不再詳細説明，大家有興趣的可深入瞭解，話不多説，正文開始。
《性能優化必備——火焰圖》作者：咕咕雞
本文主要介紹火焰圖及使用技巧，學習如何使用火焰圖快速定位軟件的性能卡點。
結合最佳實踐實戰案例，幫助讀者加深刻的理解火焰圖構造及原理，理解 CPU 耗時，定位性能瓶頸。當前現狀
假設沒有火焰圖，你是怎麼調優程序代碼的呢？讓我們來捋一下。
《性能優化進階：讓你的移動端網頁 1s 呈現》作者：wxp686
現在的消費者越來越依賴移動設備來訪問內容和服務，這比以往任何時候都要求更高。當他們權衡您網站上的體驗時，他們不僅將您與您的競爭對手進行比較，還會在使用完後對您的應用進行評級。
但是很多網站給用户帶來的體驗並不太好，以致造成潛在客户流失，所以，性能是留住用户的關鍵。
《前端晉升答辯-性能優化篇範式》作者：胡哥有話説
本文力爭為你參加晉升答辯時，提供一個論述性能優化相關工作的範式。簡單點兒來説，就是按照這個範式文來準備、闡述，就可以博得晉升評委的認可與喜愛。
痴迷寫頁面UI的前端千篇一律，懂得量化收益的前端萬里挑一。
現在已經不是刀耕火種的前端原始時代了，能夠高保真實現頁面UI是每一個前端的基本技能，“沒有功勞還有苦勞”這句話也不再適用於前端晉升了。你辛苦的工作可能會看在直屬 leader 的眼裏，知道你為了業務天天熬夜加班，會讓你年終績效更好一些，但是在晉升答辯中，尤其是高職級同學的晉升，基本都是跨部門、或通道評委評審的，他們是不會認為這些重複性勞動、像流水線一樣的工作有什麼重要價值。
如何讓他們在短短時間內認識到你的工作價值呢，這是你在晉升之前要思考的問題！
《使用 normalizr 進行復雜數據轉換》作者：jump__jump
筆者曾經開發過一個數據分享類的小程序，分享邏輯上類似於百度網盤。當前數據可以由被分享者加工然後繼續分享（可以控制數據的過期時間、是否可以加工數據以及繼續分享）。
分享的數據是一個深度嵌套的 json 對象。在用户讀取分享數據時存入小程序雲數據庫中（分享的數據和業務數據有差異，沒使用業務服務器進行維護）。如果拿到數據就直接存儲的話，很快雲數據庫就會變得很大，其次我們也沒辦法分析各項和檢索各項子數據給予分享者。
《我是如何做到百萬數據跑批半小時結束》作者：Issues
跑批任務是要通過定時的去處理這些數據，不能因為其中一條數據出現異常從而導致整批數據無法繼續進行操作，所以它必須是健壯的；並且針對於異常數據我們後續可進行補償處理，所以它必須是可靠的；並且通常跑批任務要處理的數據量較大，我們不能讓它處理的時間過於久，所以我們必須考慮其性能處理；總結一下，我們跑批處理的應用程序需要做到的要求如下
健壯性：針對於異常數據，不可導致程序崩潰
可靠性：針對於異常數據，我們後續可跟蹤
大數據量：針對於大數據量，可在規定的時間內進行處理完畢
性能方面：必須執行在規定的時間內處理完從而避免干擾任何其他應用程序的正常運行
《「性能優化」為虛擬列表增加離屏渲染和緩存，提升渲染速度》作者：皮小蛋
在虛擬列表中的圖片縮略圖增加離屏渲染和壓縮並緩存的能力， 作為功能增強。
優化的目的：
支持 2000 sku+ 可以同時正常操作；
進入頁面加載時間在 2 - 3s 以內，滾動展示不卡頓，操作反饋正常；
更快的頁面加載速度；主要的處理：
增加一個用離屏渲染壓縮圖片的 Avatar 組件， 並替換原有的 Avatar 組建；
增加了 LRU Cache 來緩存壓縮過後的圖片；
實驗性的加入 Web worker 防止壓縮圖片時主線程卡頓；
使用更強大的 react-virtualized 代替原本的 react-virtual-list
下文主要分享方案設計以及核心代碼的實現， 希望對大家有所幫助。
《一頓騷操作版本號比較性能提升 300%》作者：Gopher指北
CompareVersion 的邏輯清晰且簡單，而根據火焰圖知性能主要消耗在 strings.Split 函數上，所以老許的第一目標是嘗試優化 strings.Split 函數。
每當此時老許首先想到的方法就是百度大法和谷歌大法，最後在某篇文章中發現 strings.FieldsFunc 函數，根據該文章描述，strings.FieldsFunc 函數分割字符串的速度遠快於 strings.Split 函數。那麼我們到底能不能使用 strings.FieldsFunc 函數替換 strings.Split 函數請看下面測試結果。
問答推薦
Unanswered：
- arcgis/core 依賴文件太大導致首屏渲染時間很長，有優化的辦法嗎
- treemap 顯示有很多 unused 的代碼，但 js 是打包後的 chunk 不知道具體情況，有優化的辦法嗎
Most frequent：
- react 組件較多時，拖拽遇到性能問題，造成頁面卡頓
- 請問 vue 從別人的網站加載圖標 這樣寫，會造成頁面卡頓，影響性能嗎？
- 請問一個數據大小為何引起巨大性能問題？
- 循環內定義變量和循環外定義變量有性能區別嗎？
- 如何實現一個高性能的以時間為條件的查詢器？
# SegmentFault 技術週刊 #
「技術週刊」是社區特別推出的技術內容系列，一週一主題。
每週二更新，歡迎「關注」。大家也可以在評論處留言自己感興趣的主題，推薦主題相關的優秀文章。
如有問題可以添加小姐姐微信~
