20200910html的MediaRecorder应用场景+css的分离图层做动画+JS的RAIL性能评估模型+软技能的管理团队人重要还是事重要

MediaRecorder() 构造函数会创建一个对指定的 MediaStream 进行录制的 MediaRecorder 对象。

对指定的流创建一个音频比特率为128kbps,视频比特率为2.5Mbps的媒体录制器. 被录制的媒体数据会以MP4格式封装。

var optiOns= {
audioBitsPerSecond : 128000,
videoBitsPerSecond : 2500000,
mimeType : 'video/mp4'
}
var mediaRecorder = new MediaRecorder(stream,options);
m = mediaRecorder;


stream: 将要录制的流，可以是来自于使用 navigator.mediaDevices.getUserMedia() 创建的流或者来自于 ,  以及 DOM元素。

mimeType:为新构建的 MediaRecorder 指定录制容器的MIME类型. 在应用中通过调用 MediaRecorder.isTypeSupported() 来检查浏览器是否支持此种mimeType.

audioBitsPerSecond: 指定音频的比特率.

videoBitsPerSecond: 指定视频的比特率.

MDN地址 https://developer.mozilla.org/zh-CN/docs/Web/API/MediaRecorder/MediaRecorder

减轻图层间渲染的影响

RAIL是一种以用户为中心的性能模型，最终目的是让网站在任何特定的设备上都能快速运行，每个网络应用均具有与其生命周期有关的四个不同方向，它们会以不同的方式影响着性能。 主要包括：

1.立即响应用户，在100ms内确认用户输入

在用户注意到停滞后有100ms的时间来响应用户的输入。如果未响应，用户会注意到操作与反应之间的连接中断。

2.设置动画或滚动时，在10ms内完成帧

如果动画的帧率发生变化，用户会注意到，除非每秒生成60帧。 只有10ms来执行代码。

3.最大程度增加主线程的空闲时间

利用空闲时间完成推迟的工作，例如，尽可能减少预加载数据，以便应用快速加载，并利用空闲时间加载剩余数据。

4.持续吸引用户，在1000ms内呈现交互内容

在1s中之内加载你的网站，否则用户注意力会分散，他们处理任务的感觉会中断，侧重于优化关键渲染路径取消阻止渲染。

i am not a leader, i am just a poor programmer