最簡 Radio 最簡的自定義Radio，只是封裝了label：封裝前： 封裝后： Radio 實現(xiàn)： 定義自定義元素：通過繼承HTMLElement創(chuàng)建自定義元素，通過cu...
發(fā)簡信
IP屬地：上海
-
Web Components
-
靜態(tài)服務(wù)
要使用 Node.js 創(chuàng)建一個簡單的靜態(tài)文件服務(wù)器，你可以使用 Node.js 的內(nèi)置 http 模塊，配合 fs（文件系統(tǒng)）模塊來讀取并返回靜態(tài)文件內(nèi)容。這里有一個簡單的...
-
發(fā)布/訂閱模式的EventEmitter的實現(xiàn)
EventEmitter 是 Node.js 中實現(xiàn)事件發(fā)布/訂閱模式的核心類，用于處理異步事件。在瀏覽器環(huán)境中，我們也可以簡單實現(xiàn)一個類似的 EventEmitter，來理...
-
戰(zhàn)勝惰性，培養(yǎng)自律，迎接重大挑戰(zhàn)
在人生的道路上，我們時常會面臨一些既可行又有挑戰(zhàn)性的任務(wù)。雖然我們可能具備完成這些任務(wù)的能力，但有時需要克服一點點的自身惰性。如果過于縱容自己的懶惰，一旦遇到重大挑戰(zhàn)，常常會...
-
Ant Design
Layout 頁面級整體布局。 主題 Ant design 將影響主題的最小元素稱之為Design Token，如colorText, fontSize等。 組件中使用當前主...
-
CSS 關(guān)鍵幀動畫
關(guān)鍵幀動畫是在時間軸上定義關(guān)鍵幀并指定其屬性值的動畫技術(shù)。百分比用于表示動畫的時間進度，從而確定在特定時間節(jié)點上動畫元素應(yīng)該具有的屬性值。 關(guān)鍵幀動畫應(yīng)用 以下是一個簡單的C...
-
nginx 實戰(zhàn)
nginx 指令 location location指令用于配置請求的匹配規(guī)則，并指定對應(yīng)的處理方式。nginx 按照以下順序匹配location塊： 精準匹配，如果請求的u...
-
微前端之 qiankun 實戰(zhàn)
微前端概述 微前端就是將應(yīng)用拆分成多個子應(yīng)用，主應(yīng)用再加載這些子應(yīng)用。核心就是先拆后合。 微前端解決的問題 技術(shù)棧不同 獨立開發(fā)，獨立部署 微前端方案 iframe：通過if...
-
31. React源碼之更新優(yōu)先級--高優(yōu)更新打斷低優(yōu)更新
在構(gòu)建Fiber樹過程中如果出現(xiàn)高優(yōu)更新，則高優(yōu)更新會先執(zhí)行。 代碼詳情 useEffect中的更新優(yōu)先級低于onClick中的更新優(yōu)先級，當useEffect中的更新在渲染...
-
30. React源碼之更新優(yōu)先級--并發(fā)渲染React render階段是并發(fā)的，首先創(chuàng)建一個宏任務(wù)用于構(gòu)建Fiber樹，待瀏覽器執(zhí)行渲染等高優(yōu)操作后，取出宏任務(wù)執(zhí)行，如果5ms 未執(zhí)行完任務(wù)，再次創(chuàng)建一個宏任務(wù)，等待...
-
29. React源碼之更新優(yōu)先級--lane更新可以設(shè)置優(yōu)先級，在處理更新的時候可以指定渲染優(yōu)先級，高于指定渲染優(yōu)先級的更新才能渲染。React中使用lane(車道)表示任務(wù)優(yōu)先級，共有31個lane，數(shù)字越小優(yōu)先級越...
-
28. React源碼之scheduler--調(diào)度
瀏覽器事件循環(huán)機制： 瀏覽器執(zhí)行調(diào)用棧上的代碼； 清空微任務(wù)以及新加入的微任務(wù)； 檢查是否需要渲染，如果需要渲染執(zhí)行渲染操作（resize回調(diào)，scroll回調(diào)，reques...
-
27. React源碼之scheduler--最小堆
最小堆特點是一棵完全二叉樹，父節(jié)點小于子節(jié)點；采用數(shù)組存儲。 代碼詳情 知識點 插入節(jié)點：將待插入節(jié)點放到數(shù)組末尾向上調(diào)整； 刪除節(jié)點：數(shù)組第一個元素是最小節(jié)點，將最后一個元...
-
26. React源碼之useLayoutEffectuseLayoutEffect會在所有DOM變更之后同步調(diào)用effect。 執(zhí)行DOM變更時調(diào)用effect destroy()方法，DOM變更后同步調(diào)用effect cre...
-
25. React源碼之useEffect賦值給 useEffect 的函數(shù)會在組件渲染到屏幕之后執(zhí)行。 掛載階段：beginWork創(chuàng)建hooks及對應(yīng)的effects，effect.tag = HasEffect...