Javascript 如何根据互联网速度播放gif或视频？

我目前正在建立这个网站，使用视频背景作为登录页，但如果互联网速度较慢，他们希望播放gif。他们告诉我，有一个网站叫做这是99%他们想要的，所以我用那个网页作为参考，但不知道他们会如何改变这一点。我的意思是，我认为这是一个媒体查询，但后来我的笔记本电脑开始向我显示Gif，是一个4k屏幕。我知道他们有可湿性粉剂，但我不知道是一个插件或什么

处理这样的函数性的最好方法是什么

这是我迄今为止的代码（非常简单）：

最后的布道

布道题目
查看更多布道

加入我们，参加2017年的表扬派对
了解更多

首先，为了获得Javascript中的互联网速度，我将引用（您可能可以使用

navigator.connection.downlink

，）

然后，根据获得的速度，我将在HTML中插入正确的元素

  const speed = getSpeed();
  const playable = document.getElementById("my-playable");
  /* Play gif */
  if (speed < minSpeed)
      playable.innerHTML = "<img src='...'>"; /* Insert an image (the gif) */
  else
      playable.innerHTML = "<video src='...-'></video>" /* Insert the video */

const speed=getSpeed（）；
const playable=document.getElementById（“我的可玩”）；
/*播放gif*/
如果（速度<分钟速度）
playable.innerHTML=“”；/*插入图像（gif）*/
其他的
playable.innerHTML=”“/*插入视频*/

媒体查询不会告诉你你的互联网速度。从访问该网站开始，他们似乎立即开始播放低分辨率gif，然后，如果/当完整视频加载时，他们会用它替换背景。这有一定道理，但我觉得有些东西它只是保留gif，而从不更改视频。那我就得看看怎么做了。谢谢，我会试一试，看看它是否能满足我的需要。这有点道理，但我是一个很好的傻瓜

  const speed = getSpeed();
  const playable = document.getElementById("my-playable");
  /* Play gif */
  if (speed < minSpeed)
      playable.innerHTML = "<img src='...'>"; /* Insert an image (the gif) */
  else
      playable.innerHTML = "<video src='...-'></video>" /* Insert the video */