最新 5 篇文章

这两天看了一本书《14/10轻断食法》，简单讲就是让你在10小时以内食物，之外的时间就不要再进食了。对应的底层原理就是人在这个进食时间内是用来吸收能量的，会将你碳水转换成糖原。在断食窗口内，开始消耗糖原，等到糖原消耗完后，开始消耗脂肪。 以下是我的笔记和理解：

• 你吃的碳水、蛋白、脂肪，一部分会供当下活动（上班，走路），多余的会变成糖原存进肝脏/肌肉，或直接变成脂肪囤起来
• 断食时，身体会先消耗肝脏里的糖原，等到糖原耗尽，就会开始分解脂肪，产生酮体，供大脑、身体使用，燃脂的核心
• 进食时，身体忙着消化、吸收营养，没功夫打扫卫生，断食后，身体就有空大扫除，开启自噬机制，清理衰老、受损的细胞，帮助修复细胞损伤，减少炎症、慢性病
• 如果断食时间太短，糖原没耗尽，脂肪无法开始分解，自噬也没有激活。断食太久，容易饥饿，暴饮暴食。还可能让代谢变慢
• 进食后，一部分碳水被快速消化，变成葡萄糖进入血液，直接供能，多余的碳水会快速合成糖原存到肝脏和肌肉里
• 身体需要能量时（比如运动、走路），糖原会马上分解成葡萄糖，直接被细胞利用，效率远超脂肪
• 脂肪分解慢，要先分解成脂肪酸，再运输到肝脏，最后专程酮体才能供能，耗时长
• 身体不会轻易动用脂肪，它还要保护内脏、维持体温、溶解维生素，除非糖原耗尽，否则不会主动分解脂肪
• 只有极端饥饿，糖原、脂肪都快耗尽，才能开始分解少量蛋白质，所以轻断食不会轻易伤到肌肉
• 如果在断食期间进食，会打断脂肪分解，因为要优先去消耗糖原。如果真要进食，可以吃一些低卡无碳的食物。
• 运动可以加速糖原消耗
• 碳水时糖原的主要材料，肉类、蔬菜几乎不直接生产糖原，也不会打断脂肪分解。
• 控制碳水（不补充新糖原），也要控制总热量（不增加脂肪）

… 查看更多

以下这篇文章是我利用flomo的AI洞察生成出来的，我觉得挺有意思，它跟我平常见到的利用AI做整理和汇总不一样，它好像能读懂你的心里在想什么和纠结什么。

你好，从你的笔记里，我看到了一个不断与完美主义抗争的创造者你在2018年那个未发布的应用故事里，提炼出了 一则深刻的教训：若它能够正常运行，便即刻发布 。这一领悟清晰明了，有趣的是，在后续笔记里，你仍不断告诫自己遵循同样的原则——“快速发布”、“聚焦核心内容”、“勿追求极致完美”。这种反复的自我提醒，实则揭示了一个更深层次的矛盾：你的认知已然到位，然而执行时却总被“尚未准备好”的心态所羁绊。

这种心态或许源自对技术完美的执着追求 ，又或许是因为你将创造的意义过度放大 ，害怕交出不够完美的作品。但早在2021年你就已察觉：产品的成败与投入的工作量并无必然联系 。真正值得交付的并非完美无瑕的代码，而是其为用户解决问题的能力。你甚至发现，那些能够快速验证想法的人往往更容易取得成功 ,。

更需警惕的是，这种延迟发布的习惯已在你生活的其他领域产生了连锁反应。你在工作的高压下逐渐麻木，担忧陪伴家人的时间过少，甚至开始质疑自己投入时间的价值 。而笔记中不断涌现的新想法 与对新技术的探索 ，反倒可能沦为一种逃避——以规划替代行动，用可能性取代交付成果。

不过，你并非无计可施。你早已总结出应对之策：采用熟悉的技术栈、积累可复用的模板、将次要工作交由AI处理 ,。你理想中的创作状态是“以思维的速度编辑软件”，而实现这一目标的关键恰恰在于接纳不完美。真正需要突破的并非技术能力，而是对“未完成”状态的容忍度。 … 查看更多

原先这个网站的代码高亮主题是默认暗色的，但是考虑到网站本身已经支持了跟随系统主题自动切换，所以为了保持统一，准备将代码高亮主题跟系统主题自动同步。

一开始我想的还是传统的方式，比如通过添加类，或是在css中添加media查询来实现。后来让AI去实现这个功能时，发现了一个更简单的方式，直接在<link />标签中添加media属性，利用prefers-color-scheme媒体查询在不同的系统主题下加载不同的样式。

<link rel="stylesheet" href="https://unpkg.com/prismjs@1.29.0/themes/prism.css" media="(prefers-color-scheme: light)">
<link rel="stylesheet" href="https://unpkg.com/prismjs@1.29.0/themes/prism-okaidia.css" media="(prefers-color-scheme: dark)">

分析了下这个方案，发现了一些有趣的细节。

• 当页面为亮色主题时，会同时下载prism.css和prism-okaidia.css，但是没有命中的media（暗色主题）不会参与渲染（也就不会阻塞渲染）。

• 虽然两个主题文件都会下载，但是它们的优先级不一样，比如当页面为亮色主题时，prism.css比prism-okaidia.css的优先级高。

• 如果此时切换为系统或浏览器的主题为暗色，则prism-okaidia.css会命中media，就直接渲染了。

• 如果是刷新页面（比如当前系统主题为暗色），两个主题文件会重新下载，但是由于浏览器的缓存机制，所以一般情况下不会重新请求。此时，prism-okaidia.css的优先级就比prism.css高了。

背景

最近在团队内落地统一规范时，需要保证“每个 SFC 模板至少包含一个 data-xxx 或 v-data-xxx”这类规范。研究了下，可选方案有三种：

• 文档宣导，依赖自觉
• Code Review 阶段全局扫描
• 在提交前通过自动化工具拦截

第三种方案接入成本低、反馈路径短，是目前工程化实践中的首选。实现手段通常有两种：编写构建插件（vite/webpack）或编写 ESLint 插件。后者配置统一、生态成熟，更利于长期维护，语义上也更符合 ESLint 场景。

实现思路

（ESLint 插件的完整规范可参考官方文档，本文仅聚焦关键步骤。）

ESLint 的核心流程可简化为三步：

1. 解析器把源码生成 AST
2. 插件基于 AST 做规则校验
3. 若命中规则，则上报错误或警告

因此，开发插件的关键在于理解 AST 结构，并针对目标节点编写访问逻辑。

Vue 文件解析

在 Vue 工程里，构建侧常用 @vue/compiler-sfc。编写规则时，应改用 vue-eslint-parser，它专门处理 .vue 单文件，仅解析 <template> 区块并提供 template visitor，可直接在插件中使用。

规则实现示例

需求：模板中至少有一个 DOM 元素或自定义组件带 data-xxx 属性或 v-data-xxx 指令。

module.exports = {
  meta: {
    type: 'problem',
    docs: {
      description: 'Enforce at least one data-xxx or v-data-xxx attribute in template',
      category: 'Best Practices',
      recommended: true
    },
    fixable: null,
    schema: []
  },
  create(context) {
    return {
      /*
       * 只能匹配“指令”属性（v-data-xxx），若要同时检测普通 DOM 属性（如 data-xxx），需再写一条非指令属性选择器：
       * 'VAttribute[directive=false][key.name^="data-"]'(node) { ... }
       * 'VAttribute[directive=true][key.name.name^="data-"]'(node) {...}
       * 改用 VElement 统一检查所有属性，无需区分指令与普通 DOM 属性
      */
      VElement(node) {
        const hasDataAttr = node.startTag.attributes.some(attr => {
          const name = attr.directive ? attr.key.name.name : attr.key.name
          return name.startsWith('data-')
        })
        if (!hasDataAttr) {
          context.report({
            node,
            message: 'Template must contain at least one data-xxx or v-data-xxx attribute'
          })
        }
      }
    }
  }
}

用例测试

ESLint 提供 RuleTester 工具，可在本地模拟完整校验流程： … 查看更多

hello~