懶加載

什么是懶加載氓涣?

懶加載其實(shí)就是延遲加載鹃操,按需加載,只有在需要時(shí)才加載春哨,他是網(wǎng)站的一種優(yōu)化方案。

我們?yōu)槭裁匆褂脩屑虞d恩伺?

減少http請(qǐng)求赴背,減少服務(wù)器的負(fù)擔(dān),提高用戶體驗(yàn)晶渠。一些大型的電商網(wǎng)站凰荚,比如淘寶,天貓褒脯,京東便瑟,一般它們的頁面商品圖片繁多,而每加載一張圖片就會(huì)發(fā)送一次http請(qǐng)求番川,如果讓瀏覽器一次性渲染全部圖片到涂,這樣用戶的等待時(shí)間就長(zhǎng),用戶體驗(yàn)相當(dāng)不好颁督,也給服務(wù)器帶來一定的負(fù)擔(dān)践啄,這個(gè)時(shí)候就可以使用懶加載,先讓瀏覽器加載一部分呈現(xiàn)在視窗的圖片沉御,當(dāng)用戶下拉時(shí)按需將呈現(xiàn)在視窗的圖片加載給用戶屿讽,這樣的用戶體驗(yàn)就會(huì)好很多。

怎么使用懶加載吠裆?

首先給每一張要懶加載的圖片添加一個(gè)自定義屬性伐谈,比如data-src,在該屬性里面存放真實(shí)的圖片路徑试疙,設(shè)置觸發(fā)事件诵棵,當(dāng)事件觸發(fā)時(shí),將data-src的路徑獲取出來效斑,添加到src屬性里面非春。

這只是其中的一種思路,寫得有不對(duì)不好的地方望指點(diǎn)缓屠,一個(gè)剛起步的web前端小白的一點(diǎn)簡(jiǎn)書奇昙。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市敌完,隨后出現(xiàn)的幾起案子储耐,更是在濱河造成了極大的恐慌,老刑警劉巖滨溉,帶你破解...
    沈念sama閱讀 210,914評(píng)論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件什湘,死亡現(xiàn)場(chǎng)離奇詭異长赞,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)闽撤,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,935評(píng)論 2 383
  • 文/潘曉璐 我一進(jìn)店門得哆,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人哟旗,你說我怎么就攤上這事贩据。” “怎么了闸餐?”我有些...
    開封第一講書人閱讀 156,531評(píng)論 0 345
  • 文/不壞的土叔 我叫張陵饱亮,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我舍沙,道長(zhǎng)近上,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,309評(píng)論 1 282
  • 正文 為了忘掉前任拂铡,我火速辦了婚禮壹无,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘感帅。我一直安慰自己格遭,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,381評(píng)論 5 384
  • 文/花漫 我一把揭開白布留瞳。 她就那樣靜靜地躺著拒迅,像睡著了一般。 火紅的嫁衣襯著肌膚如雪她倘。 梳的紋絲不亂的頭發(fā)上璧微,一...
    開封第一講書人閱讀 49,730評(píng)論 1 289
  • 那天,我揣著相機(jī)與錄音硬梁,去河邊找鬼前硫。 笑死,一個(gè)胖子當(dāng)著我的面吹牛荧止,可吹牛的內(nèi)容都是我干的屹电。 我是一名探鬼主播,決...
    沈念sama閱讀 38,882評(píng)論 3 404
  • 文/蒼蘭香墨 我猛地睜開眼跃巡,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼危号!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起素邪,我...
    開封第一講書人閱讀 37,643評(píng)論 0 266
  • 序言:老撾萬榮一對(duì)情侶失蹤外莲,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體偷线,經(jīng)...
    沈念sama閱讀 44,095評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡磨确,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,448評(píng)論 2 325
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了声邦。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片乏奥。...
    茶點(diǎn)故事閱讀 38,566評(píng)論 1 339
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖亥曹,靈堂內(nèi)的尸體忽然破棺而出英融,到底是詐尸還是另有隱情,我是刑警寧澤歇式,帶...
    沈念sama閱讀 34,253評(píng)論 4 328
  • 正文 年R本政府宣布,位于F島的核電站胡野,受9級(jí)特大地震影響材失,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜硫豆,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,829評(píng)論 3 312
  • 文/蒙蒙 一龙巨、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧熊响,春花似錦旨别、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,715評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至洪碳,卻和暖如春递览,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背瞳腌。 一陣腳步聲響...
    開封第一講書人閱讀 31,945評(píng)論 1 264
  • 我被黑心中介騙來泰國打工绞铃, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人嫂侍。 一個(gè)月前我還...
    沈念sama閱讀 46,248評(píng)論 2 360
  • 正文 我出身青樓儿捧,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國和親挑宠。 傳聞我的和親對(duì)象是個(gè)殘疾皇子菲盾,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,440評(píng)論 2 348

推薦閱讀更多精彩內(nèi)容

  • 1、懶加載 1.什么是懶加載各淀? 懶加載也就是延遲加載亿汞。當(dāng)訪問一個(gè)頁面的時(shí)候,先把img元素或是其他元素的背景圖片路...
    xiaolizhenzhen閱讀 70,456評(píng)論 18 160
  • 1揪阿、懶加載1.什么是懶加載疗我?懶加載也就是延遲加載咆畏。當(dāng)訪問一個(gè)頁面的時(shí)候,先把img元素或是其他元素的背景圖片路徑替...
    Gaochengxin閱讀 374評(píng)論 1 2
  • 懶加載和預(yù)加載 1. 懶加載 1. 什么是懶加載吴裤? 懶加載也就是延遲加載 當(dāng)訪問一個(gè)頁面的時(shí)候旧找,先把img元素或是...
    琦琦出去玩了閱讀 749評(píng)論 0 8
  • 什么是懶加載 對(duì)于用戶暫時(shí)不需要的數(shù)據(jù),不在頁面打開的時(shí)候就去發(fā)送請(qǐng)求麦牺,設(shè)置一個(gè)條件钮蛛,當(dāng)用戶觸發(fā)條件的時(shí)候再去加載...
    劉圣凱閱讀 231評(píng)論 0 0
  • 昨天何老師玩小螃蟹,跟阿嫲說:這個(gè)是小螃蟹剖膳,那個(gè)是他的阿公阿嫲魏颓,他的爸爸媽媽去上班了不在家。跟我一樣吱晒,我的爸爸媽媽...
    云在波心閱讀 402評(píng)論 0 1