202409

INFO

20240822

啥时候工作能让我省点心，多出来的时间陪伴爱人

算一笔账希望自己能减少焦虑多一点脚踏实地的安心

0903

1182
float-ui
代码实现主要思路：

function refresh(skip = false, threshold = 1) {
  // 清理操作，清理上一次定时器和监听
  cleanup()

  // 获取元素的位置和尺寸信息
  const { left, top, width, height } = element.getBoundingClientRect()

  if (!skip) {
    // 这里更新弹窗的位置
    onMove()
  }

  // 如果元素的宽度或高度不存在，则直接返回
  if (!width || !height) {
    return
  }

  // 计算元素相对于视口四个方向的偏移量
  const insetTop = Math.floor(top)
  const insetRight = Math.floor(root.clientWidth - (left + width))
  const insetBottom = Math.floor(root.clientHeight - (top + height))
  const insetLeft = Math.floor(left)
  // 这里就是元素的位置
  const rootMargin = `${-insetTop}px ${-insetRight}px ${-insetBottom}px ${-insetLeft}px`

  // 定义 IntersectionObserver 的选项
  const options = {
    rootMargin,
    threshold: Math.max(0, Math.min(1, threshold)) || 1,
  }

  let isFirstUpdate = true

  // 处理 IntersectionObserver 的观察结果
  function handleObserve(entries) {
    // 这里事件会把元素和视口交叉的比例返回
    const ratio = entries[0].intersectionRatio
    // 判断新的视口比例和老的是否一致，如果一致说明没有变化
    if (ratio !== threshold) {
      if (!isFirstUpdate) {
        return refresh()
      }

      if (!ratio) {
        // 即元素完全不可见时，也就是ratio = 0时，代码设置了一个定时器。
        // 这个定时器的作用是在短暂的延迟（100毫秒）后，再次调用 `refresh` 函数，
        // 这次传递一个非常小的阈值 `1e-7`。这样可以在元素完全不可见时，保证重新触发监听
        timeoutId = setTimeout(() => {
          refresh(false, 1e-7)
        }, 100)
      } else {
        refresh(false, ratio)
      }
    }

    isFirstUpdate = false
  }

  // 创建 IntersectionObserver 对象并开始观察元素
  io = new IntersectionObserver(handleObserve, options)
  // 监听元素
  io.observe(element)
}

refresh(true)

0909

1188
今天是产检中的最重要一项检查，如果过得了这关，基本上孩子就能健康出生，希望下午大排畸宝贝一切正常，顺利过关

0912

1191
业务前端说的技术指标 p90：90 百分位对应的加载耗时； pMean：平均加载耗时(全量数据)； pMeanRemoveMax：去除 p99 以外的极大值的平均加载耗时；

0913

1192
从来没有这么贫穷过，从来没有，我记得刚大学毕业那会，也没啥额外支出，除了房租和生活费，其他也没啥开销，都是自己攒着，现在倒好，比刚毕业那会更贫穷

0918

1197，还剩 3 天就满 1200 天了
中秋节送老妈回南京，下次老妈再来上海之时就是老婆要生了，希望这最近的 7 周能顺顺利利，我自己要忙碌一点，空闲时间多陪陪老婆，所以工作期间赶紧做完手上的活，流出时间

0924

1203

scrollIntoView 缺陷：会导致整个窗口滚动

scrollIntoView 方法导致整个页面产生偏移，也就是 scrollIntoView 会导致整个窗口滚动，参考文章,最优解：放弃使用 scrollIntoView 改用 scrollTop 来操作滚动条

var target = document.getElementById("target")
target.parentNode.scrollTop = target.offsetTop

如果能平替也阔以通过

document.getElementById("xxx").parentNode.scrollTo({
  top: 100,
  behavior: "smooth",
})

0927

1206
最近突然闲下来了，想学点东西或者做点什么东西，但是又不知道从何下手,完成个人记账剩下的图表相关

0929

1208
翻看了之前的历史聊天记录，50%的人已成为前同事，估计很难熬过今年，但怎么样都比之前好，因为续命了半年，内心还是充满感谢，接下来的 2 个月的时间，要不断开始学习了，很多年会获大奖的人也默默消失了，看来没有什么能一成不变，唯有拥抱变化才能立足于不败之地

0930

1209，国庆回来直接就是 1216
最近俩天心情贼烦躁，加上眼镜不舒服，耳机丢失，内心特别不平静，也不知道国庆要做什么事，也没有规划
还是有点失落，前端白屏这个事没有处理好，怎样才能进一步推进呢

202409 ​

0903 ​

0909 ​

0912 ​

0913 ​

0918 ​

0924 ​

scrollIntoView 缺陷：会导致整个窗口滚动 ​

0927 ​

0929 ​

0930 ​

202409

0903

0909

0912

0913

0918

0924

scrollIntoView 缺陷：会导致整个窗口滚动

0927

0929

0930