亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

內存中的 ReactJS 虛擬 DOM 和應用增量更改

內存中的 ReactJS 虛擬 DOM 和應用增量更改

肥皂起泡泡 2021-11-12 18:33:13
在谷歌上以一種或其他形式遇到以下聲明每次 React 應用程序中的底層數據發生變化時,都會創建用戶界面的新虛擬 DOM 表示。這就是事情變得有趣的地方。在 React 中更新瀏覽器的 DOM 是一個三步過程。每當任何事情發生變化時,整個 UI 都將在虛擬 DOM 表示中重新呈現。將計算先前虛擬 DOM 表示與新表示之間的差異。真正的 DOM 將使用實際更改的內容進行更新。這很像應用補丁。我是 React 的新手,想了解以上三點在 jQuery(或原生 JS)中是如何在 React 之前的時代工作的。jQueryHTML 在服務器端構建,發送回瀏覽器。瀏覽器將解析、渲染、布局和繪制它。假設在某個用戶事件或加載時創建或隱藏任何新的 DOM 元素。jQuery 會重新創建完整的 DOM 嗎?從上面提到的第三點來看,React 只更新已更改部分的 DOM,但其他系統(主要是 jQuery 或原生 JS)將重新創建完整的 DOM。那是對的嗎?第三點是否僅適用于 DOM 更改,或者甚至當任何 UI 組件的狀態更改(例如填充文本框/下拉菜單等)時?
查看完整描述

1 回答

?
Helenr

TA貢獻1780條經驗 獲得超4個贊

jquery 會重新創建完整的 DOM 嗎?從上面提到的第三點來看,React 只更新已更改部分的 DOM,但其他系統(主要是 jquery 或原生 js)將重新創建完整的 DOM。那是對的嗎?

jQuery


不,jQuery 不會重新創建 DOM。相反,它使用提供的選擇器導航 DOM 樹以進行適當的更改。這使得 jQuery 與 React 非常相似,但它的性能問題伴隨著代碼的設計方式和外觀設計模式的大量使用。這對于任何需要支持多種瀏覽器(如 Chrome、Firefox、Opera 等)的大型庫來說都是正常的。

角 1


用于重繪整個 DOM 的框架是 Angular 1??蛻舳藭M行一些更改,并在調用$scope.apply或 時$scope.digest重新渲染。這一點,再加上大頁面上大量的雙向數據綁定偵聽器,是 Angular 必須進行重大更改以保持競爭力的重要原因之一。Angular 8 可能等同于 React,但其中一個的采用率高于另一個。

反應


React 只更新被改變的 DOM。這是其“秘方”的一部分。隨著其以組件為中心的架構和早期采用一種數據綁定方式,它已經取得了很大的成功??梢哉f React 開始變得更加臃腫,因為它被廣泛采用。對于任何獲得主流使用的項目來說,這都是正常的。人們將 React 視為一大堆性能問題只是時間問題,我們將創建一個新框架。

備擇方案


還有比 React 更快的框架,比如Elm lang。沒有什么能打敗純 Javascript(例如document.querySelector()),因為在其核心,所有框架都使用它。那時,您開始進行其他權衡,例如缺乏您可以依賴的外部庫,或者難以維護大型前端代碼庫。


第三點是否僅適用于 dom 更改或什至當任何 UI 組件的狀態更改(例如填充文本框/下拉菜單等)時?

對于 jQuery 或純 JS,第三點是不正確的。有一個自定義on-click處理程序,它會運行一個進行小改動的函數。

對于像 Angular 這樣的東西,如果有改變scope觸發重繪,那可能是真的。這同樣適用于 React。如果你的submit按鈕應該將你重定向到一個完全不同的頁面,它基本上會重新繪制 DOM。


查看完整回答
反對 回復 2021-11-12
  • 1 回答
  • 0 關注
  • 341 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號