摘要:元素規(guī)定了外部資源與當(dāng)前文檔的關(guān)系。常用于鏈接樣式表,創(chuàng)建網(wǎng)站圖標(biāo),預(yù)加載資源等。那么我們就可以在標(biāo)簽設(shè)置字體的。注意當(dāng)界面加載時(shí),兩個(gè)樣式表都會(huì)下載到客戶端,只是會(huì)根據(jù)場(chǎng)景不同使用不同的樣式。標(biāo)簽的和屬性的區(qū)別和目的引用一步前端
link元素規(guī)定了外部資源與當(dāng)前文檔的關(guān)系。常用于鏈接樣式表,創(chuàng)建網(wǎng)站圖標(biāo),預(yù)加載資源等。
鏈接樣式表? 創(chuàng)建站點(diǎn)圖標(biāo) 預(yù)加載用于前端界面性能優(yōu)化,rel 的屬性值可以為preload、prefetch、dns-prefetch。
prefetch 預(yù)獲取
用戶在使用當(dāng)前界面時(shí),瀏覽器空閑時(shí)先把下個(gè)界面要使用的資源下載到本地緩存。瀏覽器下不下載不可知。
舉個(gè)例子: 網(wǎng)站有A,B 兩個(gè)界面。當(dāng)用戶訪問界面 A 時(shí)有很大的概率會(huì)訪問 B 界面(比如登錄跳轉(zhuǎn))那么我們可以在用戶訪問界面 A 的時(shí)候,提前將 B 界面需要的某些資源下載到本地,性能會(huì)得到很大的提升。那么我們只需要在界面 A.html 文件中設(shè)置如下代碼:
控制當(dāng)前界面的資源下載優(yōu)先級(jí),瀏覽器必須下載資源。
舉個(gè)例子: 網(wǎng)站的一個(gè)界面 A的 css 樣式文件中使用了外部字體文件,正常情況下該字體的下載是在 css 解析的時(shí)候完成的。想想字體文件好像在 css 樣式文件解析之前下載到本地比較好。那么我們就可以在head標(biāo)簽設(shè)置字體的 preload。
按照字面理解即可,先把要跳轉(zhuǎn)的域名解析,減少時(shí)間。
關(guān)注的頁面不同: prefetch 關(guān)注要使用的頁面,preload 關(guān)注當(dāng)前頁面
資源是否下載:prefetch 的資源下載情況未知(只在瀏覽器空閑時(shí)會(huì)下載),preload 肯定下載
media 屬性media 屬性規(guī)定被鏈接文檔將顯示在什么設(shè)備上。
注意: 當(dāng)界面加載時(shí),兩個(gè)樣式表都會(huì)下載到客戶端,只是會(huì)根據(jù)場(chǎng)景不同使用不同的樣式。
script 標(biāo)簽的 async 和 defer 屬性的區(qū)別和目的?
preload & prefetch
一步前端
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/54971.html
摘要:語義化是指僅僅從元素上就能看出頁面的大致結(jié)構(gòu)。表述類縮寫表示整段話的引用表示一行文字的引用表示引述作品名兩個(gè)標(biāo)簽結(jié)合使用,來定義圖文。黃浦江上的的盧浦大橋元素可定義預(yù)格式化的文本。在語義上表達(dá)是段代碼。 HTML語義化是指僅僅從 HTML 元素上就能看出頁面的大致結(jié)構(gòu)。我們比較習(xí)慣使用 div、span 來壘頁面,視覺上沒啥問題,文字既內(nèi)容,html 標(biāo)簽只被 css 樣式所用,單從 ...
摘要:標(biāo)簽的個(gè)屬性。緩存所有響應(yīng),但并非必須。只為單個(gè)用戶緩存,因此不允許任何中繼進(jìn)行緩存。比如說就不允許緩存的響應(yīng)表示當(dāng)前請(qǐng)求開始,該響應(yīng)在多久內(nèi)能被緩存和重用,而不去服務(wù)器重新請(qǐng)求。 meta簡(jiǎn)介 網(wǎng)頁元數(shù)據(jù),常用于定義網(wǎng)頁的編碼、說明、關(guān)鍵字、修改日期及其他信息。這些數(shù)據(jù)服務(wù)于瀏覽器、搜索引擎等。 meta 標(biāo)簽的2個(gè)屬性name, http-equiv。 。 name 屬性 ...
閱讀 1587·2021-10-18 13:35
閱讀 2370·2021-10-09 09:44
閱讀 824·2021-10-08 10:05
閱讀 2723·2021-09-26 09:47
閱讀 3577·2021-09-22 15:22
閱讀 441·2019-08-29 12:24
閱讀 2004·2019-08-29 11:06
閱讀 2862·2019-08-26 12:23