2025 第 36 周

route 和 menu/highlight 是两套不同的机制 - vue: active-class + 自定义逻辑
tailwindcss - size-4 = w-4 h-4 = w-4 aspect-square - Ref
CSS#align-items#flex 有 baseline/first baseline/last baseline 值 - caniuse - Ref
CSS#sharp-margin 需要配合 sharp-outside 和 float 属性一起使用. ps: percentage 是相对于元素 width 计算的 - Ref
CSS#Building Smart layout
CSS#sibling-index() 基于 1 计数的; 而 sibling-count() 返回包括自己在内的兄弟节点个数
CSS#scrollbar-gutter 导致在计算 position 时会有 4px 偏移，就是这样设计的?
JavaScript#registerProtocolHandler(scheme, url)
JavaScript#innerText/textContent区别 Ref
JavaScript#Beacon_API - Ref
JavaScript#URL Pattern API
JavaScript#navigator.credentials
App#Keka - the macOS file archiver
form#formdata_event This happens when the form is submitted, but can also be triggered by the invocation of a FormData() constructor. ps: 需要在是实例化时, 传 HTMLFormElement 参数
form#submitter - 不太适用
svg#resvg-js
utils#gitignore
The Difference Between a Post Flush Watcher and nextTick in Vue | Michael Thiessen
animated console.log message - DEMO [ps: 打开开发者工具查看效果]
An easy way to make your dropdowns feel better is to make them origin-aware. Ref
days pass, leaves fall, winter comes, yet still our request waits, yearning for a response that will never come. Ref
Designing better target sizes
已关闭所有免密支付
盈亏同源
沉没成本不参与重大决策
A8.5 - ps: 记得郑莹说 40 岁可以达到 A8
三年清知府，十万雪花银
yearprogress.org
大模型在逆向还原代码上简直不要太爽了。将某不开源的 npm 库的 dist 中所压缩的 js 和 d.ts 喂给大模型，语义化该代码并输出成 ts 文件，这样你就基本还原出了这个库的源码。同理，如果你看重了某个网站的功能， F12 打开控制台定位到 js 代码并喂给大模型，那么就得到了一份该功能的“源码” - Ref
吃#娃娃菜豆腐汤
弱势群体往往存在仇富心理，又缺乏挑战体制的勇气，结果只能在小圈子中相互消耗。ps: 诉苦并不能带来积极的改变 - Ref
马化腾三问自己: 1) 如果你不做，用户会损失什么？2) 这个新的领域你是不是擅长？3) 如果做了，这个新的项目能保持多大的竞争优势？
mistreass

// code ...
const controller = new AbortController();
const timer = setTimeout(() => controller.abort(), timeout);
try {
  const res = await fetch(`/api/user/${id}`, { signal: controller.signal });
  return await res.json();
} finally {
  // 不管 success/fail 都需要 clearTimeout
  clearTimeout(timer);
}

// chatgpt
class CancelScope {
  constructor(timeoutMs) {
    this.controller = new AbortController();
    this.signal = this.controller.signal;
    this.timeoutId = null;

    if (timeoutMs != null) {
      this.timeoutId = setTimeout(() => this.cancel(), timeoutMs);
    }
  }

  cancel() {
    this.controller.abort();
  }

  close() {
    if (this.timeoutId != null) {
      clearTimeout(this.timeoutId);
    }
  }
}

async function withCancelScope(timeoutMs, fn) {
  const scope = new CancelScope(timeoutMs);
  try {
    return await fn(scope);
  } finally {
    scope.close();
  }
}

// case.
async function fetchUser(id, signal) {
  const res = await fetch(`/api/user/${id}`, { signal });
  return res.json();
}

async function main() {
  await withCancelScope(5000, async (scope) => {
    // 在这个作用域里，所有异步操作共享同一个 cancel 信号
    const user = await fetchUser(42, scope.signal);

    // 并行多个操作也 OK
    const [profile, posts] = await Promise.all([
      fetch(`/api/profile/42`, { signal: scope.signal }).then(r => r.json()),
      fetch(`/api/posts/42`, { signal: scope.signal }).then(r => r.json())
    ]);

    console.log(user, profile, posts);
  });
}