資訊專欄INFORMATION COLUMN
摘要：操作的代價非常昂貴，對元素節點的訪問和修改樣式布局的改變以及事件的綁定都影響著網頁的性能。所以，盡量減少對布局信息的查詢次數，并用局部變量參與計算。當動畫結束時，重新定位，從而只一次下移文檔其他元素的位置。這樣可以最小化事件句柄數量。
批量修改DOMDOM操作的代價非常昂貴，對元素節點的訪問和修改、樣式、布局的改變以及DOM事件的綁定都影響著網頁的性能。
如果要對元素節點進行多次讀寫，那么最好的方式是：把多次操作在DOM節點樹外統一處理好，然后再一次性更新DOM節點樹，具體的方法大致包含下面幾種。
先隱藏要操作的元素節點，然后對這些節點進行操作，最后再顯示出來。
先克隆要操作的元素節點，然后對克隆出來的節點進行操作，最后覆蓋原來的元素節點。
在文檔外創建并更新一個文檔片段（createDocumentFragment()），然后在附加在原始節點上。
緩存信息布局瀏覽器通過隊列化修改和批量運行的方法，盡量減少重排版的次數。當你查詢布局信息（如偏移量、滾動條位置、風格屬性）的時候，瀏覽器將會刷新隊列并執行所有修改操作，以返回最新的數值。所以，盡量減少對布局信息的查詢次數，并用局部變量參與計算。
將元素提出動畫流重排版有時只影響渲染樹的一小部分，但有時候也會是一大部分，下面這些步驟可以避免對大部分頁面進行重排版：
對動畫元素使用絕對定位，使他脫離頁面布局流。
啟動元素動畫。當它擴大時會覆蓋部分頁面。
當動畫結束時，重新定位，從而只一次下移文檔其他元素的位置。
事件托管當一個頁面存在大量的元素，并且很多元素都有一個或多個事件綁定的時候，會影響頁面的性能，這個時候才用事件托管機制可以提升頁面的運行性能：你只需要監聽事件，看看他們是不是你感興趣的元素發出的。這樣可以最小化事件句柄數量。
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/85249.html
摘要：此過程中，頁面的解析與用戶的交互都是阻塞的。非阻塞腳本延時腳本可以給標簽添加一個屬性，這個屬性表明元素中的腳本不打算修改，因此代碼可以稍后執行。此技術的重點在于無論在何處啟動下載，腳本的下載和運行都不會阻塞頁面的處理過程。 當瀏覽器遇到標簽時，頁面的加載、介些都會停下來，運行此javascript代碼，然后再繼續加載。這種事情同樣會發生在那些以src屬性調用的外部腳本，瀏覽器首先下載外...
摘要：內部屬性包含一個函數被創建的作用域中的對象的集合，此集合被稱為函數的作用域鏈。當作用域鏈銷毀時，激活對象一同被銷毀。下圖展示了函數運行期上下文的作用域和閉包由于閉包的屬性包含與運行期上下文作用域鏈相同的對象引用，會產生副作用。 javascript按照數據存儲位置的不同可分為以下四類： 直接量（字符串、數字、布爾型、Object、Array、Function、正則表達式、NULL以...
摘要：無主題，內容為感觸較深的一些答疑探討等，摘自多篇文章，侵刪為什么是單線程的單線程，與它的用途有關。作為瀏覽器腳本語言，的主要用途是與用戶互動，以及操作。這決定了它只能是單線程，否則會帶來很復雜的同步問題。摘自運行機制詳解再談作者阮一峰 無主題，內容為感觸較深的一些答疑、探討等，摘自多篇文章，侵刪 1、為什么JavaScript是單線程 JavaScript的單線程，與它的用途有關。作...
摘要：剛學了一些的基礎語法，試著用一下。相關文檔基本語法配合基本使用相同點和都是的基本數據類型擴展的種基本數據類型和都是值擴展的種值空字符串不同點可見代表變量有值，值為空且該值是通過變量賦值獲得的代表聲明了變量，但沒有為其賦值。 剛學了一些 Markdown 的基礎語法，試著用一下。 相關文檔：Markdown基本語法配合基本使用 相同點： null 和 undefined 都是js...
閱讀 2959·2023-04-25 17:46
閱讀 3588·2021-11-25 09:43
閱讀 1092·2021-11-18 10:02
閱讀 3051·2021-10-14 09:43
閱讀 2768·2021-10-13 09:40
閱讀 1524·2021-09-28 09:35
閱讀 2184·2019-08-30 15:52
閱讀 3154·2019-08-30 14:06
