為了讓開發 react 專案的過程更加輕鬆
可以安裝 react developer tool 這個專屬react的開發小工具
react developer tool 點此安裝
安裝完畢後,在瀏覽器的擴充工具欄裡面會出現 react developer tool 的圖示
可以辨認當下開啟的頁面是否使用 react 建構而成
以及產生提示,如果要部屬到線上時要先經過 use the production build
建構專案
按 f12 ,打開開發者工具,選擇 Components 頁籤,
就可以看到 components 彼此間的層級關係
以及該 component 的 props 跟 states 的資訊
另外 Profiler 頁籤可以查看 react專案 進行渲染時的過程及耗費的資源
進而對效能進一步的修正