前端理论总结(html5)——URL输入到页面渲染过程//离线存储

URL输入到页面渲染过程

1、首先,在浏览器地址栏中输入url

2、浏览器先查看浏览器缓存-系统缓存-路由器缓存,如果缓存中有,会直接在屏幕中显示页面内容。若没有,则跳到第三步操作。

3、在发送http请求前,需要域名解析(DNS解析),解析获取相应的IP地址。

4、浏览器向服务器发起tcp连接,与浏览器建立tcp三次握手。

5、握手成功后,浏览器向服务器发送http请求,请求数据包。

6、服务器处理收到的请求,将数据返回至浏览器

7、浏览器收到HTTP响应

8、读取页面内容,浏览器渲染,解析html源码

9、生成Dom树、解析css样式、js交互

10、客户端和服务器交互

离线存储

1、页面添加一个:<html lang="en" manifest="a.manifest">

2、创建 cache.manifest

javascript 复制代码
CACHE MANFIEST     //声名为一个存储文件
#v1.0                         //版本号
CACHE:                     //需要缓存的文件
NETWORK:               //只有连网才能访问的资源 
FALLBACK:               //一但前面的文件无法缓存就会缓存后面的文件
(   /A.HTML  /B.HTML    )
相关推荐
lichenyang4537 分钟前
鸿蒙 MVVM 实战:从 Demo 到工程化,聊聊登录、状态管理与埋点系统设计
前端
IT_陈寒24 分钟前
Vite打包时遇到的坑,原来问题出在这里
前端·人工智能·后端
kyriewen30 分钟前
AI生成代码快如闪电,但我修了三个小时——它到底帮了谁?
前端·javascript·ai编程
ayqy贾杰1 小时前
基层管理的三板斧,在AI时代行不通了
前端·后端·团队管理
Apifox1 小时前
Apifox 5 月更新|Postman 导入优化、Runner 支持非 root 运行、请求代码自动带鉴权
前端·后端·安全
miaowmiaow2 小时前
PSD2Code 近期更新与深度解析:从设计稿到生产级代码的完整技术栈
前端·人工智能·ai编程
Hilaku2 小时前
多标签页并发请求导致 Token 刷新失败?只有 15行代码就能解决 !
前端·javascript·程序员
Nile2 小时前
解密Palantir系列一:4. Ontology 不是哲学
开发语言·前端·javascript
因_崔斯汀2 小时前
ECharts 区域地图可视化实战:以山东地图为例
前端
Bacon2 小时前
手摸手带你搞清楚 AI Agent 的六大核心概念
前端·人工智能