前端理论总结(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    )
相关推荐
VaJoy10 小时前
全面革新⚡️ Vue 3.6 项目工程的基础实现
前端·vue.js
苍何11 小时前
耗时 7 天,我们开源了腾讯 WorkBuddy 实战蓝皮书(建议收藏)
前端·后端
大家的林语冰11 小时前
😭 Electron 麻了,Deno 直接支持二进制应用,无需第三方桌面应用框架!
前端·javascript·node.js
Damai12 小时前
DOMPurify 完整介绍
前端·面试
随风一样自由12 小时前
【前端+跨域】跨域问题全面解析与解决方案指南
前端·跨域
小帅不太帅12 小时前
我随手发了几张截图,白拿了一个月 AI 顶配会员
前端·github
36岁的我开始学习打篮球12 小时前
外规内化技术架构
前端
iCOD3R12 小时前
【趣站精选】2026-07-13
开源·html
雪隐12 小时前
用Flutter做背单词APP-03为了给单词库塞满数据,我让AI给我打了上万份工
前端·人工智能·后端
hunterandroid12 小时前
Android 安全最佳实践:从数据存储到网络通信的防护思路
前端