前端一些技巧

检查网络速度

访问下行网络速度（单位：Mbps）

if (navigator.connection) {
    const downlink = navigator.connection.downlink;
    console.log(`Current download speed: ${downlink} Mbps`);
} else {
    console.log("Network Information API not supported");
}

移动应用添加振动

// Vibrate for 500ms
if (navigator.vibrate) {
    navigator.vibrate(500);
} else {
    console.log("Vibration API not supported");
}

// Create a pattern of vibration and pauses 
if (navigator.vibrate) {
    navigator.vibrate([200, 100, 200, 100, 200]);
}

防止文本粘贴

  const input = document.querySelector('input');

  input.addEventListener("paste", function(e){
    e.preventDefault()
  })

使用CSS快速定位

/* Verbose way */ 
div {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

/* With inset */ 
div {
  position: absolute;
  inset: 0; 
}

在移动设备上禁用下拉刷新

body {
 overscroll-behavior-y: contain;
}

整个网页可编辑

document.body.contentEditable = 'true';

网站平滑滚动

html {    
    scroll-behavior: smooth;  
}

CSS:empty隐藏空元素

p:empty {   
  display: none;  
}