HTML 標記在 Javascript 中使用 for 循環是否比正常的 HTML 標記慢？

Question

我即將標記很長的頁面，並開始對 javascript 的 HTML 標記提出問題。

由於我使用的是 Vue.js，我通常使用 for 循環進行標記，但我的高級人員在沒有任何循環的情況下進行標記（用於循環行），因此代碼長度超長，而且看起來不干凈和緊湊。 但是，他告訴了我一些我不明白的奇怪（從我的角度來看）的事情。

他所說的是在沒有 javascript 循環的情況下進行標記在加載方面要快得多。 此外，對於每個組件，在沒有 js for 循環的情況下編寫標記可以更容易讓他們一次顯示所有功能，因為使用 js 進行標記可能會加載 html 較慢，因此它根本不會同步頁面。

目前，我根本不相信這個理論。 所以我想知道用於循環行（例如表行）的循環標記與沒有任何 javascript 代碼的 html 標記之間的區別，以使其更簡單。 請讓我知道，以便我可以了解有關編碼的更多信息。

Answer 1

使用 JavaScript 將內容呈現到頁面給瀏覽器處理引擎增加了一層復雜性。

簡而言之，當瀏覽器從服務器獲取 HTML 時，它開始自上而下將數據解析為 HTML。 （即使腳本標簽也需要解析為 HTML 才能運行腳本。瀏覽器怎么會知道它是腳本標簽？）按照文檔的順序，HTML 內容被渲染到頁面，腳本按原樣執行遭遇。

當瀏覽器到達 JavaScript 更改 DOM 的代碼時，瀏覽器必須首先執行您的代碼，觀察 DOM 是否被修改，然后重新繪制被修改的屏幕區域。

記住 JavaScript 代碼是同步執行的，如果瀏覽器沒有遇到更改 DOM 的代碼，它會顯着降低需要將內容繪制到屏幕的次數。