動態

詳情 返回 返回

SegmentFault 思否技術週刊 Vol.56 -- 掌握這個概念,你就理解了 React - 動態 詳情

小編整理了思否社區關於 React 的優質技術文章,歡迎大家閲讀 ~

文章推薦

React 組件應用於 Spring MVC 工程

公司前端工程還處於 React+Mobx 與 Spring MVC(freemarker+jQuery)技術棧共存的階段,兩種技術棧頁面難免會存在一些相同的業務功能點,如果分別開發和維護,就需要雙倍的人力成本,因此,我們嘗試將 React 業務組件在 webpack、babel 等利器的幫助下應用於 Spring MVC 項目。

React Fiber 架構原理剖析

在 React 16 之前,VirtualDOM 的更新採用的是Stack架構實現的,也就是循環遞歸方式。不過,這種對比方式有明顯的缺陷,就是一旦任務開始進行就無法中斷,如果遇到應用中組件數量比較龐大,那麼VirtualDOM 的層級就會比較深,帶來的結果就是主線程被長期佔用,進而阻塞渲染、造成卡頓現象。

從原生 JavaScript 到 React

React 是一個用於構建用户界面的 JavaScript 框架。它可用於通過動態操作頁面內容來創建 JavaScript 應用程序。瀏覽器已經提供了在頁面中創建元素的 API,即 DOM,所以新手可能想知道 React 帶來了什麼以及它與 DOM 的關係。

使用 React 手寫一個手風琴組件

知識點
emotion語法
react語法
css語法
typescript類型語法

動手擼組件系列 —— 1. 使用 React 實現一個 Collapse 組件

寫組件的能力是衡量前端工程師水平的重要指標,不管是基礎組件還是業務組件。
筆者在空閒時間也喜歡寫組件,為了幫助初學者上手寫React組件,同時為了分享我在寫組件中的經驗和想法,決定開設一個系列,即:動手擼組件系列,和大家分享一些公共組件和業務組件的實現方式和實現技巧。
作為這個系列的第一篇文章,分享下如何從零到一實現一個摺疊面板(Collapse)組件

實現 React 過程中一次有趣的問題排查經歷

趁着對 React 內部運行流程還記得住,業餘時間嘗試復刻一個 React —— big-react。
即然是復刻一個 React,那肯定得跑通部分官方的測試用例。
在跑一個用例時遇到個很有意思的問題,以下是排查過程。

React:不要動,否則你會被炒魷魚

不知道大家在用React開發時,有沒有注意到react與react-dom這兩個包中有個很奇葩的屬性__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:
直譯過來就是內部神秘屬性,不要亂用!否則你會被炒魷魚。
為什麼會有個這麼唬人的屬性?今天我們來聊聊。

問答推薦

  • 關於 React-redux 與後台交互的問題?
  • reactnative 文件怎麼上傳?
  • React 的 import 動態引入組件生命週期紊亂?
  • 新手問個 mobx-react 問題?
  • React.StrictMode 在開發環境下,useEffect 會自動執行 return?
  • 怎麼理解 React 的 state 狀態不可變?
  • 在 React 中 使用 useEffect 報錯,怎麼解決?
  • React.Context 和 redux 緩存的數據無法跨瀏覽器 Tab 共享,怎麼解決?
  • React hook 多次 setstate 被合併怎麼處理?

課程推薦

《自頂向下學 React 源碼》

課程特色:

  • 基於最新源碼,本課程基於最新 React17.0.0-alpha 設計,全網稀缺。React17 發佈的 Concurrent Mode 是React 前幾年的努力方向,也是未來幾年的發展方向。市面上目前還沒有 React17 源碼級別的課程。
  • 輔助資料完備,課程配備了配套電子書《React技術揭秘》、豐富的在線Demo、實戰練習。
  • “自頂向下”的授課方式,符合人類認知的過程。如果説別的源碼分析課程是“高級”難度,那麼本課程只有“中級”難度。原因在於課程使用“自頂向下”的授課方式,更符合人類認知的過程。

PS:大家想看哪些方面的技術內容,可以在評論區留言喔 ~
如有問題可以添加小姐姐微信~
image.png

user avatar alienzhou 頭像 awbeci 頭像 shendaowu 頭像 huobaodechahu 頭像 linzai_6904290569daa 頭像
點贊 5 用戶, 點贊了這篇動態!
點贊

Add a new 評論

Some HTML is okay.