99偷拍视频精品区一区二,口述久久久久久久久久久久,国产精品夫妇激情啪发布,成人永久免费网站在线观看,国产精品高清免费在线,青青草在线观看视频观看,久久久久久国产一区,天天婷婷久久18禁,日韩动漫av在线播放直播

JavaScript總結幾個提高性能知識點(推薦)-創新互聯

前段時間花時間看了大半的《High Performance JavaScript》這本書啊，然后就開始忙項目了，慶幸最忙的一周已經熬過去了。由于空不出時間，這個月寫的學習筆記也不多，忙完最苦X的一周，這兩天晚上也算是挑燈夜讀了...終于是在殘血之際將這本書shut down了...

我們提供的服務有：做網站、成都網站設計、微信公眾號開發、網站優化、網站認證、沙河口ssl等。為成百上千企事業單位解決了網站和推廣的問題。提供周到的售前咨詢和貼心的售后服務，是有科學管理、有技術的沙河口網站制作公司

既然讀完了，總歸是要學到些什么的。說說對這本書的看法先吧，整體的來說，內容還是不錯的，就是感覺有點老了（作為前端小白，也可能是自身水平有限，未能體會到其中真意）。看這本書的過程中也是寫了挺多代碼用以測試的，并且對本書提倡的寫法和原先大眾的寫法的執行分別進行了斷點跟蹤，對于能實際測出的問題進行理解，當然，下斷點跟著執行也看不出的那也沒辦法咯。對于書中的知識點，這里只是簡單的整理出個人所推崇的一部分，當然~ 不喜勿噴。

針對js文件的加載位置

在HTML文件中，<script>標簽是可以加在<head>區域和<body>區域的。這里鑒于JavaScript執行和UI渲染的單線程原因，如果js文件載入會阻塞后面對于頁面的解析過程，頁面會等到js文件完全加載并運行后才繼續執行該做的操作。那么問題就來了，這樣可能會出現頁面空白or卡頓現象。作為一名前端開發，重要的不僅僅止于實現了需求，應該還有優質的用戶體驗。那么我們就需要消除用戶枯燥的等待，針對這個問題，這里有本獸想到的兩種解決方案：

1.  如果js文件沒有特殊要求指明需要在頁面渲染之前載入及編譯完成的，那么選擇將js文件放到</body>標簽前(既所有的頁面所呈現內容的后面)，css文件還是放到<head>區域(誰也不愿意看一個布局雜亂無章的頁面)。這樣做就能先讓用戶看到有布局的頁面而不是空白頁了，那么也會有人指出：那數據得通過js請求加載進來啊，怎么辦呢？可以對數據的加載做排序，急需呈現的接口放前面執行，不是那么需要的可以延后執行，同時做個簡單的載入動畫or提示。

2.  如果這些js文件有指明需要先執行了，才能更好的展示頁面內容，那么就在第一個js或者頁面上先放個載入小動畫，可以一些有趣的或者萌萌的動畫場景。這樣也是能較好的避免用戶等待的無聊，說不定人家還對這個載入動畫更感興趣呢，這樣可提升項目的用戶體驗感。

最終推薦：將<script>標簽盡可能的放到</body>標簽前面加載，以提升用戶體驗。

針對js文件的合并

在很多團隊開發中，我們可能會將不同功能的代碼塊分別放置在不同的js文件中，以便于開發過程中眾人合作寫代碼會更加方便，畢竟只需要找對應文件夾或文件而不是在一個很長的文件中找一個方法。這確實是會提高團隊開發效率及新人加入后的更容易進行二次開發及維護。那么將這個問題放到頁面性能里呢？這正是問題所在，在這本書中指出：Each HTTP request brings with it additional performance overhead,so downloading one single 100 KB file will be faster than downloading four 25 KB files.

下載1個100KB的文件比下載4個25KB的文件要快，而開發過程中區分開各個文件又有很大的好處，那么合并這個問題也就放在開發完后再處理咯，相信這個操作大家都不會陌生吧，現在的前端工具這么豐富，各位習慣用什么壓縮就用什么壓縮吧~

這里簡單提出下，在載入文件方面還可以用到defer和async屬性，用于延遲加載和異步加載，在現代瀏覽器中，大多數是已經支持defer屬性了，還沒習慣用這個額，也不知道具體會不會存在什么問題。有興趣的朋友可自行google該知識點，這里件簡單提下吧。

現在的框架也大多配合懶加載和按需加載了。

更快速的數據訪問

對于瀏覽器來說，一個標識符所處的位置越深，去讀寫他的速度也就越慢(對于這點，原型鏈亦是如此)。這個應該不難理解，簡單比喻就是：雜貨店離你家越遠，你去打醬油所花的時間就越長... 熊孩子，打個醬油那么久，菜早燒焦了 -.-~

如果我們需要在當前函數內多次用到一個變量值，那么我們可以用一個局部變量先將其存儲起來，案例如下：

//修改前
 function showLi(){
   var i = 0;
   for(;i<document.getElementsByTagName("li").length;i++){  //一次訪問document
     console.log(i,document.getElementsByTagName("li")[i]); //三次訪問document
   };
 };
 //修改后
 function showLi(){
   var li_s = document.getElementsByTagName("li"); //一次訪問document
   var i = 0;
   for(;i<li_s.length;i++){
     console.log(i,li_s[i]); //三次訪問局部變量li_s
   };
 };

另外有需要云服務器可以了解下創新互聯建站www.yijiale78.com，海內外云服務器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業上云的綜合解決方案，具有“安全穩定、簡單易用、服務可用性高、性價比高”等特點與優勢，專為企業上云打造定制，能夠滿足用戶豐富、多元化的應用場景需求。

分享名稱：JavaScript總結幾個提高性能知識點(推薦)-創新互聯
文章鏈接：http://www.yijiale78.com/article12/disidc.html

成都網站建設公司_創新互聯，為您提供ChatGPT、網站內鏈、品牌網站制作、App設計、網站設計、關鍵詞優化

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯

外貿網站建設