HTML 基础篇
- HTML 语义化
这是老生常谈的问题了
- 可读性
- 可以让搜索引擎更加容易获取信息进行解析
- 没有CSS 也可以让页面更好的展示 好处优势
- 有利于SEO ,方便搜索引擎去解析
- 有利于开发者更好的维护
新增Html5 新标签如 dialog footer header video nav main progress
- script 标签中的 async defer 的区别 script : 会阻碍HTML解析,只有全部下载好并执行脚本才会继续解析HTML async script :解析HTML过程中进行脚本的异步下载,下载成功后,立即执行,有可能会阻断HTML解析 (注意这里是不可控的,因为async 执行时间不确定存在多个async ,执行顺序也不确定,依赖网络传输结果) defer script :完全不会阻碍HTML的解析,解析完之后再按照顺序执行脚本
图片来自其他作者 juejin.cn/post/706158…
总结:
图片来自https://juejin.cn/post/6894629999215640583
3 从浏览器地址栏中输入URL 到请求返回发生了什么?
1先解析URL 中的协议主机端口路径等信息,并构造一个HTTP请求
2dns域名解析
3 TCP 连接 (三次握手)
4 HTTP请求
5 服务器处理请求返回HTTP报文
6 浏览器渲染页面
7 断开TCP 连接
第一部分 输入网址并解析
URL 组成: 协议 主机 端口 路径 查询参数 锚点 6部分组成
输入URL 浏览器会及析出协议,主机,端口,路径等信息,并构造一个HTTP请求
1 是否命中强缓存
2 是否命中协商缓存
3 直接去服务器获取资源
强缓存:
向浏览器缓存查找该请求结果,根据该结果的缓存规则来决定是否使用该缓存结果的过程。
强缓存分两种:
Expires Cache-Control
Expires:
来源 存在服务器返回的响应头中
缺点 服务器的时间和浏览器的时间可能并不一致导致失效
Cache-Control :
来源 响应头 和请求头
语法 Cache-Control:max-age=3600
缺点 时间最后还是会失效
请求头
响应头:
DNS 域名解析 顾名思义 DNS 域名系统
对于浏览器来说 DNS 作用就是将主机名转换成IP地址 根 DNS 顶级域DNS 权威DNS