高級前端知識架構

最近這段時間梳理了高級前端知識架構,發佈在GitHub上,歡迎star 

//github.com/liuyongliang/Advanced-Frontend

 

異步

異步編程

  • 《深入理解 JavaScript 異步系列》

    • JS 是單線程的語言。運行的js ,可能會有大量的網絡請求,而一個網絡資源啥時候返回,這個時間是不可預估的。這種情況會出現等待卡頓。JS 對於這種場景就設計了異步 ———— 即,發起一個網絡請求,就先不管這邊了,先干其他事兒,網絡請求啥時候返回結果,到時候再說。這樣就能保證一個網頁的流程運行
  • 《javascript 異步編程的5種方式》

async/await

Promise

服務器端渲染SSR

SSR指南

SSR框架

函數式編程

函數式編程

代碼質量

代碼規範

JavaScript

TypeScript

性能優化

調試工具

H5優化

緩存

壓縮

內存

渲染

資源加載

監控

異常捕獲

頁面性能監控

埋點

用戶行為

設計模式

概念

單體模式

  • 《JavaScript設計模式——單體模式》
    • 單體模式(Singleton Pattern)的思想在於保證一個特定類僅有一個實例,即不管使用這個類創建多少個新對象,都會得到與第一次創建的對象完全相同。

工廠模式

工程化

構建工具

webpack

腳手架

前端標準/實踐

前端標準

骨架屏

前端算法

遞歸

冒泡

動態規劃

二分查找

鏈表和數組

瀏覽器

自動化

網絡

OSI七層協議

DNS解析

協議

TCP

  • 《TCP詳解》
    • 概念
      • 面向連接、可靠的基於位元組流的傳輸協議。
      • 將應用層的的數據分割成報文段並發送給目標節點的 TCP 層
      • 每個數據包都有相對應的序號,對方收到後就發送 ACK 確認,未收到就重傳
      • 使用校驗和來檢測傳輸過程中是否出現錯誤
  • 《你管這破玩意兒叫TCP?》

UDP

測試

單元測試

自動化測試

  • 《前端自動化測試淺析》

  • 《前端自動化測試探索》

    • 測試是完善的研發體系中不可或缺的一環。前端同樣需要測試,你的css改動可能導致頁面錯位、js改動可能導致功能不正常。由於前端偏向GUI軟件的特殊性,儘管測試領域工具層出不窮,在前端的自動化測試上面卻實施並不廣泛,很多人依舊以手工測試為主

可視化

d3

  • 《D3 源代碼解構》
    • D3是一個數據可視化的javascript庫,相對於highchart和echarts專註圖表可視化的庫,D3更適合做大數據處理的可視化,它只提供基礎的可視化功能,靈活而豐富的接口讓我們能開發出各式各樣的圖表。

three.js

NodeJS

原理

V8引擎

移動web開發

Hybrid

Flutter

安全

抓包/代理

監控技術

機器學習

TensorFlow

客戶端開發

electron

nw.js

chrome插件

  • 《Chrome插件開發指南》
    • Chrome插件是一個用Web技術開發、用來增強瀏覽器功能的軟件。它其實就是一個由HTML、CSS、JS、圖片等資源組成的一個.crx後綴的壓縮包

源碼分析

vue源碼

react源碼

TypeScript

JavaScript

項目管理

項目管理

前端發展趨勢

前端發展趨勢

面試

面試

社區/會議

社區/會議