html页面渲染,页面帧变化问题求解

开发了一个很简单的活动页面,在chrome 的开发者工具中通过network 选项卡下 capture screenshot (就是截图中那个绿色的摄像机按钮)记录下页面渲染过程中每一帧的变化情况。

观察到一个很奇怪的现象,就是从21ms 到 221ms的时候看着页面帧都已经出来了。从238ms的时候页面才开始渲染。

正常的页面渲染不应该是从238ms才开始么,那么238ms之前到底发生了什么页面帧可以观察到整个页面的样子呢?

求大佬指点。

clipboard.png

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    
</head>
<body>
    <div class="parent">
        <img src="./头像.jpg" style="width: 100px;height: 100px;">
    </div>

</body>
</html>
阅读 1.6k
1 个回答

之前的图片是网页还没unload的遗照吧,你可以换一个页面(不是网站首页),然后在这个页面f5,你会发现空白页面之前的图像是你之前停留的页面

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题