Web 關於 Script 同步非同步執行

2021-10-11 09:11:00 字數 853 閱讀 9984

擔心自己以後遺忘位置,於是加上一些自己的改動,給放過來了

先來試個一句話解釋仨,當瀏覽器碰到script指令碼的時候:

沒有deferasync,瀏覽器會立即載入並執行指定的指令碼,「立即」指的是在渲染該script標籤之下的文件元素之前,也就是說不等待後續載入的文件元素,讀到就載入並執行。

async,載入和渲染後續文件元素的過程將和script.js的載入與執行並行進行(非同步)。

defer,載入後續文件元素的過程將和script.js的載入並行進行(非同步),但是script.js的執行要在所有元素解析完成之後,domcontentloaded事件觸發之前完成。

然後從實用角度來說呢,首先把所有指令碼都丟到之前是最佳實踐,因為對於舊瀏覽器來說這是唯一的優化選擇,此法可保證非指令碼的其他一切元素能夠以最快的速度得到載入和解析。

接著,我們來看一張圖咯:

藍色線代表網路讀取,紅色線代表執行時間,這倆都是針對指令碼的;綠色線代表 html 解析。

此圖告訴我們以下幾個要點:

script標籤的同步和非同步

2 script標籤不帶defer和async屬性 同步模式,指令碼獲取和執行都是同步,頁面會被阻塞,瀏覽器都會按照元素在頁面 現的先後順序對他們依次進行解析 通過createelement建立的script標籤其屬性async預設為true 補充 載入 es6模組的時候設定 type module...

web同步非同步請求

普通的b s模式就是同步,而ajax技術就是非同步,當然xmlhttpreques有同步的選項。同步 提交請求 等待伺服器處理 處理完畢返回。這個期間客戶端瀏覽器不能幹任何事。非同步 請求通過事件觸發 伺服器處理 這是瀏覽器仍然可以作其他事情 處理完畢。舉個生動的例子吧 同步就是你叫我去吃飯,我聽到...

問題 關於同步和非同步

同步非同步在程式設計的時候經常會用到,比如處理資源競爭的時候會用到 同步機制 來保證資源的有效性,在乙個程序中執行多個請求的時候用 非同步機制 來保證效率。今天在學習同步非同步的時候突然想到乙個問題,發個問題記錄貼等以後看。也許未來的自己會嘲笑現在的自己居然這麼sb 假設程序有程序a和程序b,他們各...