Skip to content

Commit

Permalink
修改Preload和Prefetch的说明
Browse files Browse the repository at this point in the history
原文中对于Preload和Prefetch的说明存在错误
  • Loading branch information
jiangxiaoxin authored Jun 5, 2018
1 parent 999f869 commit 973a3a8
Showing 1 changed file with 2 additions and 2 deletions.
4 changes: 2 additions & 2 deletions source/_posts/浏览器页面资源加载过程与优化.md
Original file line number Diff line number Diff line change
Expand Up @@ -130,9 +130,9 @@ XHR请求可以分为同步请求和异步请求,浏览器会把同步请求
页面预渲染:<link rel="prerender" href="//m.kaola.com"> 将会预先加载链接文档的所有资源
```
那么**Prefetch**和**Preload**有什么区别呢?
具体来讲,**Preload**来告诉浏览器预先请求当前页需要的资源,从而提高这些资源的请求优先级。比如,对于那些本来请求优先级较低的关键请求,我们可以通过设置**Prefetch**来提升这些请求的优先级。
具体来讲,**Preload**来告诉浏览器预先请求当前页需要的资源,从而提高这些资源的请求优先级。比如,对于那些本来请求优先级较低的关键请求,我们可以通过设置**Preload**来提升这些请求的优先级。
**Prefetch**来告诉浏览器用户将来可能在其他页面(非本页面)可能使用到的资源,那么浏览器会在空闲时,就去预先加载这些资源放在http缓存内,最常见的dns-prefetch。比如,当我们在浏览A页面,如果会通过A页面中的链接跳转到B页面,而B页面中我们有些资源希望尽早提前加载,那么我们就可以在A页面里添加这些资源**Prefetch**,那么当浏览器空闲时,就会去加载这些资源。
所以,对于那些可能在当前页面使用到的资源可以利用**Prefetch**,而对一些可能在将来的某些页面中被使用的资源可以利用**Preload**。如果从加载优先级上看,**Prefetch**会提升请求优先级;而**Preload**会把资源的优先级放在最低,当浏览器空闲时才去预加载。
所以,对于那些可能在当前页面使用到的资源可以利用**Preload**,而对一些可能在将来的某些页面中被使用的资源可以利用**Prefetch**。如果从加载优先级上看,**Preload**会提升请求优先级;而**Prefetch**会把资源的优先级放在最低,当浏览器空闲时才去预加载。
- 泼盆冷水:
既然**Prefetch**和**Preload**作用如此强大,我们是否可以放心使用呢?但实际上,除了dns-prefetch,其他的兼容性都十分堪忧。特别是在Safari上,由于苹果公司对安全性的苛刻要求,基本上对这些预加载技术都未实现支持。
**Preload**的支持性如下图所示,发现新版chrome支持较好,但Safari全军覆没。
Expand Down

0 comments on commit 973a3a8

Please sign in to comment.