当前位置: 首页 > news >正文

link 样式表是否会阻塞页面内容的展示?取决于浏览器,edge 和 chrome 会,但 firefox 不会。

经过实测:

在 head 中 link 一个 1M 大小的样式表。设置网络下载时间大概为 10 秒。

  • edge 和 chrome 只有在下载完样式表后,页面上才会出现内容。
  • 而 firefox 可以直接先显示内容,然后等待样式表下载完成后再应用样式。

DOMContentLoaded 事件永远在下载完样式表后才触发。

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

补充1

DOM 树中,明明元素已经有了,但 edge 和 chrome 就是不显示出来:
在这里插入图片描述

补充2

DOMContentLoaded 不会等待样式表的解析完成。但 load 会等待
在这里插入图片描述
在这里插入图片描述

补充3

firefox 的解析方式,应该是直接边解析边渲染的。因为当我将 html 文档变大后,它依旧能够在下载完 html 文档之前,将已有内容展示出来。

将元素放在样式之前(样式中添加了 500k 大小的注释信息),此时可以很快的渲染出结果:
在这里插入图片描述
将元素放在样式之后,则变慢了:
在这里插入图片描述

http://www.lryc.cn/news/328677.html

相关文章:

  • uniapp对接极光推送(国内版以及海外版)
  • 智慧城市数字孪生,综合治理一屏统览
  • 在Java中对SQL进行常规操作的通用方法
  • JavaSE day16笔记 - string
  • java将文件转成流文件返回给前端
  • 使用Node.js常用命令提高开发效率
  • 百度资源平台链接提交
  • 力扣爆刷第108天之CodeTop100五连刷26-30
  • Android裁剪图片为波浪形或者曲线形的ImageView
  • Linux课程____shell脚本应用
  • 设计模式12--组合模式
  • 【微服务】软件架构的演变之路
  • 安全算法 - 加密算法
  • 安全算法 - 国密算法
  • 蓝桥杯2014年第十三届省赛真题-武功秘籍
  • Could not initialize class java.awt.Font
  • Mysql or与in的区别
  • STM32——USART
  • WebCopilot:一款功能强大的子域名枚举和安全漏洞扫描工具
  • HarmonyOS实战开发-如何实现一个支持加减乘除混合运算的计算器。
  • 每日OJ题_子序列dp⑥_力扣873. 最长的斐波那契子序列的长度
  • 病毒循环Viral Loop是什么?为何能实现指数增长
  • 下载huggingface中数据集/模型(保存到本地指定路径)
  • HarmonyOS实战开发-使用List组件实现导航与内容联动的效果。
  • ArcGIS二次开发(一)——搭建开发环境以及第一个简单的ArcGIS Engine 程序
  • Oracle 19c 高可用部署实战系列之Data Guard理论与实战
  • ubuntu常用记录
  • 顺序表专题
  • 手写SpringBoot(三)之自动配置
  • vitepress builld报错