1. 首页
  2. css

CSS每周平台新闻:布局变化,高比特率视频停滞,Firefox中的屏幕截图

在本周的综述中:与狡猾的布局作斗争,一些视频可能有点停顿了,这是一种在Firefox中截图的新方法!确定页面加载过程中版式变化的原因
您现在可以使用WebPageTest捕获页面加载过程中网站上发生的任何版式变化,并确定导致这些变化的原因。步骤1:粘贴片段
将以下片段粘贴到网页测试.org在现场单击\”自定义\”选项卡(在\”高级设置\”下),并确保选择了Chrome浏览器。
[LayoutShifts]return new =>>Step 2: Inspect entries
After completing the test, inspect the captured LayoutShifts自定义度量页面上的条目,该页面从\”详细信息\”部分链接而来。步骤3:检查电影带在数据中的\”startTime\”和\”value\”数字上,使用WebPageTest的filmstrip视图确定各个布局的变化并找出其原因。
(通过Rick Viscomi)高比特率可能导致视频暂停
如果您从自己的web服务器为网站提供视频,请密切关注视频比特率(作者建议使用FFmpeg和streamclarity.com网站). 如果您的视频比特率超过1.5 Mbps,则3G连接用户的播放可能会暂停一次或多次,根据视频长度的不同,这项研究中50%的视频比特率高于3G连接的下行速度,这意味着视频播放将被延迟,并且会出现停顿。
(通过Doug Sillars)Firefox:screenshot命令
Firefox的DevTools控制台包含一个强大的命令,用于捕获当前网页的屏幕截图。与Chrome开发工具一样,您可以捕获单个元素、当前视口或整个页面的屏幕截图,但Firefox的:screenshot命令还提供了调整设备像素比和设置延迟的高级选项。
// capture a full-page screenshot at a device pixel ratio of 2:screenshot –fullpage –dpr 2// capture a screenshot of the viewport with a 5-second delay:screenshot –delay 5
(通过Reddit)
在我的每周周日阅读更多新闻问题,每周一上午可通过电子邮件发送给您。
网络平台新闻:周日问题→

CSS每周平台新闻:布局变化,高比特率视频停滞,Firefox中的屏幕截图 为WP2原创文章,链接:https://www.wp2.cn/css/css%e6%af%8f%e5%91%a8%e5%b9%b3%e5%8f%b0%e6%96%b0%e9%97%bb%ef%bc%9a%e5%b8%83%e5%b1%80%e5%8f%98%e5%8c%96%ef%bc%8c%e9%ab%98%e6%af%94%e7%89%b9%e7%8e%87%e8%a7%86%e9%a2%91%e5%81%9c%e6%bb%9e%ef%bc%8cfirefox/