HTML5 API详解(7):link prefetch提升加载速度,优化体验
生活随笔
收集整理的這篇文章主要介紹了
HTML5 API详解(7):link prefetch提升加载速度,优化体验
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
鏈接預取:瀏覽器會自動在后臺把你需要加載的頁面下載下來,當用戶要點擊進入該頁面的時候,瀏覽器會從緩存把這個頁面取出來,頁面的加載速度就會加快。
標簽屬性:rel=‘next’
頁面預加載很簡單,只需要加上:<link rel='next' href='xxx.html'>
要預加載靜態資源的話也可以實現
<link rel="prefetch" href="/images/big.jpeg">
適用場景:
1.當你有一篇篇幅很長的文章,或在線教程,或圖冊等,需要分成多頁顯示時。
2.在你的網站首頁預加載那些用戶最可能訪問的下一頁。(可能是一個商品網站上“重點推薦”商品頁面,或博客網站上最近的一篇博客)
3.搜索查詢頁面預加載搜索出來的前幾條。
遺憾的是:目前只有火狐瀏覽器支持這個功能。但是因為火狐目前是世界上擁有第二大用戶群的瀏覽器,所以只要你在HTML頁面了加上這樣的一句代碼,仍有相當大的一部分訪問者能體驗到這十分明顯的頁面加載速度的提高。鏈接預取功能不久將會在Opera, Chrome 和 Safari 瀏覽器里實現,但對于Internet Explorer,你估計要等到2020年。
這個API操作起來比較簡單,趕緊一試!
總結
以上是生活随笔為你收集整理的HTML5 API详解(7):link prefetch提升加载速度,优化体验的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: [云炬创业基础笔记] 第四章测试9
- 下一篇: python class函数报错_如何掌