Resource Hints了解一下
主要内容
- 背景
- Resource Hints是什么
- Resource Hints能干什么
- 动态如何配置
- 与PWA如何配合
1.背景
周易八卦
中国人很早就开始研究推演八卦-算命。
现代互联网也有在搞？
我们这么搞？
1.简单粗暴的可以直接页签最下端引用加载。
3.在高级一点？
2.高级一点：我可以在执行的js代码来进行load加载
听说小道消息说谷歌这么干
当浏览器输入域名一部分时会根据记录提示补全
你知道吗？这个时候谷歌已经对你有意向访问的域名搞事情了。
学习中国古代的周易八卦，开始预测你的行为，并且针对此行为对你即将访问的网站进行定量的预加载。
Resource Hints
了解一下
2.Resource Hints是什么
Resource Hints提供了使用浏览器原始语言来进行的一些提前预测行为的能力。
dns-prefetch
preconnect
prefetch
prerender
preload
dns-prefetch
IE10+
Firefox 3.0+
Chrome All
Safari 5.0+
Opera 15.0+
preconnect
IE15+(http 时才支持)
Firefox 39.0+
Chrome 46.0+
Safari 11.1+
Opera 33.0+
prefetch
IE11+
Firefox 2.0+
Chrome 8.0+
Safari 全部不支持
Opera 15.0+
prerender
IE11，高版本也不支持
Firefox 全部不支持
Chrome 13.0+
Safari 全部不支持
Opera 15.0+
preload
IE17+（仅Http支持）
Firefox 全部不支持
Chrome 50.0+
Safari 11.1+
Opera 37.0+
3.Resource Hints能干什么
dns-prefetch
DNS是什么？
Domain Name System - 域名和IP地址相互映射的一个分部式数据库
dns-prefetch
dns-prefetch
<link rel="dns-prefetch" href="//img13.360buyimg.com">增加前
增加后
pre-fetch
特点
提前缓存需要文件
空闲时段加载
Resource Hints了解一下
By codesniper
