guoqkmiss的博客

在前端和 Node.js 项目的开发中，包管理器一直扮演着举足轻重的角色。它能帮助我们轻松管理依赖、安装并维护版本，为项目开发提供良好的生态支持。当前主流的包管理器主要有和。

让我们可以更优雅地中止异步操作，不再依赖过时的回调或繁琐的清理逻辑。避免占用资源或等待无效请求，提升性能和用户体验。

为了延长 Chromebook 的使用寿命，ChromeOS 135 引入了一项全新的电池充电限制策略 —— DevicePowerBatteryChargingOptimization，可提供更多充电优化选项，从而有效降低电池老化风险并提升长期可靠性。

nanoid 由开发者Ai发起，是一个小巧、快速且使用安全随机数来生成唯一 ID 的库初衷是替代体积更大、可读性较弱或性能不佳的其他 ID 生成方案uuid（Universally Unique Identifier）是遵循RFC4122标准的唯一标识符，常用作分布式系统、数据库主键、跨系统交互等场景如果你想要一款小而快的库，并且对传统 UUID 格式无强制要求，nanoid 是一个理想选择如果你需要标准化、高度兼容且广为人知的唯一标识，uuid 是更稳妥的方案。

在浏览器中定位 DOM 元素是前端开发、测试和调试过程的核心环节。常见的方式包括 XPath、CSS Selector 和 JavaScript Path（JS Path）。它们各有优缺点，适用于不同的业务需求。接下来，我们将分别介绍三种方式的特点、适用场景，并进行对比分析

Git 命令大全

Merge Rebase都是将分支的改动带到另一分支的方法，区别在于“迁移范围”、“历史显示方式”以及“对后续工作的影响”。选择策略主要看目标：若你只想复制几个提交且不干扰其他内容，是好帮手；若要合并完整分支并保留多人协作痕迹，Merge更简单可靠；若追求最简洁线性历史或需要交互式编辑提交，Rebase是首选，但需关注团队协作中的冲突与历史重写问题。团队协作开发要形成统一规范哪些分支只能使用 merge；哪些分支可以 rebase；何时可以 cherry-pick；

在多分支协作开发中，我们常常只想把某个分支上的单个或若干次提交，合并到另一个分支，而不需要合并整个分支。Git 提供的 cherry-pick 命令，正是为此而生的利器。掌握 cherry-pick 如同获得代码移植手术刀，合理使用能让你的版本控制更加优雅高效！

Zustand 以其“极简却不失灵活”的特性，成为了许多开发者在 React 项目中管理状态的首选。它的用法和原理都相当直观，并且拥有良好的性能表现。对于想快速开发、并希望在未来随时可扩展的项目而言，Zustand 不失为一种优秀的选择。

Performance 面板现在支持将鼠标悬停在 Call tree（调用树）或 Bottom-up > Heaviest stack（自底向上 > 最重调用栈）侧边栏中的项时，在 Main 轨道中高亮显示对应内容，并自动淡化其他内容。启用字段数据后，Performance > Insights > LCP by phase（按阶段划分的最大内容绘制）洞察项现在会在额外的表格中显示来自 Chrome 用户体验报告的第 75 百分位图像加载时间，可以直接在该洞察中对比各阶段的加载时间。

本项目对比并选用 Luxon 实现多时区转换，支持各时区时间互转。提供 NodeJS 与 Python 脚本、网页小工具及 PWA 应用，功能完整、结构清晰。适用于快速使用、系统集成或离线访问，具备良好扩展性。

Chrome 135 将账户注册的登录页面从营销网站迁移到动态网站，同时也将的隐式流程迁移到授权码流程。这样做的目的是进一步提升第三方托管账户的安全性和用户体验。iOS 版 Chrome 浏览器的用户现在可以选择按照预设时间自动删除下载内容。此功能有助于提升与存储容量相关的设备性能，并通过自动删除用户可能遗忘的下载文件来增强隐私保护。Chrome 135 引入了一个全新的客户端模型，以更好地解析网页上的密码表单，从而提高检测和自动填充的准确性。你可以通过策略来控制此功能。

客户端会自启动一个服务，Web/后端服务通过 IP + port 请求以操作客户端接口。

CVE-2025-30208 是 Vite（一个前端开发工具提供商）在特定版本中存在的安全漏洞。此漏洞允许攻击者通过特殊的 URL 参数绕过对文件系统的访问限制，从而获取任意文件内容（包括非 Vite 服务目录范围外的文件）。

Electron 项目开机自启动综合稳定性和易用性考虑，推荐使用 auto-launch，特别是：1. 如果你的应用需要支持Linux2. 如果你重视更好的错误处理和用户反馈3. 如果你的应用在Windows平台有较多用户（Windows更新可能影响原生API）app.setLoginItemSettings 更适合简单场景，或者你特别关注减少依赖项的情况。但整体而言，auto-launch 提供了更可靠和一致的开发体验。

Next.js 在内部通过一个名为 x-middleware-subrequest 的请求头，来防止自身中间件的递归调用或无限循环。但研究者发现，攻击者可以在外部请求中人为加上此请求头，并使用特定格式，使Next.js 中间件以为这是一个“子请求”，从而跳过原本应执行的认证或安全检查。Next.js 早在 2016 年就开始发布安全通告；随着使用者增多，官方也不断完善漏洞收集、补丁发布及社区通知流程。关键安全逻辑不要只依赖前置中间件，需多层校验；更要及时跟进框架升级和安全通报，避免类似漏洞造成严重影响。

Chrome 134 Devtools 更新

AI 助手面板会在本地持久化聊天记录，即使重新加载 DevTools 或 Chrome，也可以查看之前与 Gemini 的对话内容。此版本为 Performance 面板带来了多项改进。Performance > Insights 选项卡可以突出显示文件大小可进一步优化的图像。单击洞察中的图像，即可在 Network track 中查看它的高亮显示。要选择偏好风格，在面板右上角点击帮助按钮，然后选择或。该快捷键对话框还提供了一张可用快捷键的速查表。

ChromeOS 134 版本更新

Chrome OS 133 版本更新

Chrome 推出了。

的。

node-cron 是一个基于 Cron 表达式的任务调度库，允许你根据 cron 表达式设置任务的执行频率。它轻量、易用，适用于大多数简单的定时任务需求。Rxjs 是一个响应式编程库，主要用途是处理异步事件流。提供了强大的操作符，用于处理事件、异步任务、定时任务等场景。Rxjs 并非专门用于任务调度，但它可以非常高效地管理定时任务和流式数据bull 是一个基于 Redis 的任务队列库，适合处理大量异步任务。它不仅支持定时任务，还支持任务的重试、延迟执行、优先级队列等。

Cron 表达式0 0 L * *表示任务每个月的最后一天执行。Cron 表达式是一种强大的定时任务调度工具，适用于各种需要定时执行的场景。它灵活、高效，尤其适用于基于时间的任务调度。通过结合不同的特殊字符，您可以创建非常复杂的定时任务。它广泛用于 Linux 系统的 cron 命令中，并在许多 Node.js 库中得到了支持，如 node-cron。

Electron 进行间通信总结：单向通知：使用 ipcRenderer.send（主进程通过 ipcMain.on 监听）；适合简单指令，不需要立即反馈。同步调用：使用 sendSync（阻塞渲染进程，不推荐用于耗时任务）。RPC 请求：使用 invoke（返回 Promise），由主进程 handle 或 handleOnce 处理，适合需要异步返回结果的场景。特殊场景：postMessage 和 sendToHost 针对嵌入式内容与宿主的跨上下文通信设计。

CSS 小技巧 —— CSS 实现 Tooltip 功能-鼠标 hover 之后出现弹层

需求中想做出个这种效果，这个页面又是一个单独的 html 页面，没必要再单独引入其他模块了就想着用 CSS 动画来实现。

我们是 vue，选择第二个。选择第一个 ESM 规范。项目中建议使用 TS。我这边选择的是 JS。

vscode/extensions.json 文件。.vscode/settings.json 文件。.prettierrc.json 文件。.prettierignore 文件。.prettierrc.js 文件。我们是 React，选择第一个。把默认生成的替换为以下内容。选择第一个 ESM 规范。根据项目自己添加过滤文件。项目中建议使用 TS。我这边选择的是 JS。

企业定制化ChromeWebStore管理员现在可以使用新设置定制ChromeWebStore以适应他们管理的用户，包括以下功能：添加公司标志添加首页横幅和自定义公告策划扩展集合实施基于类别的控制这些设置可以通过管理员控制台进行配置，并且对所有已登录的管理用户（使用受管Google帐户登录到ChromeWebStore的用户）可用。

在iOS上使用GoogleLens搜索在Chrome132版本中，开始在所有平台上推出这一功能。

使用 Gemini 调试 Network、Source 和 PerformanceChrome 131 可以使用 Gemini 调试 CSS，现在可以调试更多模块了与元素面板中的右键菜单类似，要打开 AI 辅助面板并开始与 Gemini 的聊天，可以通过以下方式操作：在 Network 面板中，右键点击一个网络请求并选择“Ask AI”，或点击该请求旁边的“Ask AI”按钮。在 Sources > Page 选项卡中，右键点击一个文件并选择“Ask AI”，或点击该文件旁边的“Ask AI”按钮。

ChromeOS Flex 自动注册在 ChromeOS 131 中，ChromeOS Flex 的自动注册功能现已允许大规模部署 ChromeOS Flex 设备。与 ChromeOS 零接触注册类似，自动注册将通过组织管理员创建的注册令牌嵌入到 ChromeOS Flex 镜像中。这将决定设备在初次设置时将注册到哪个客户组织和组织单位。

使用 Gemini 调试 CSSChrome DevTools 现在推出了一个新的实验性 AI 辅助面板，可以与 Gemini 聊天并获得帮助来调试 CSS。在 Elements 面板中，右键点击一个元素并选择Ask AI，或者点击该元素旁边的对应按钮，DevTools 会打开新的 AI 辅助面板。

在 iOS 上使用 Google Lens 搜索自 Chrome 126 版本以来，用户可以通过 Google Lens 搜索屏幕上看到的任何图片或文字。要使用此功能，请访问网站，并点击聚焦时出现在地址栏的 Google Lens 搜索按钮，或者点击桌面右键菜单、桌面和移动端的三点菜单。用户可以在屏幕上任意点击、选中或拖动以搜索内容，并通过在搜索框中添加关键词或问题来优化搜索。管理员可以通过名为 LensOverlaySettings 的策略控制此功能。

网络面板获新增了一些过滤条件，这些过滤条件是根据反馈重新设计的，特定于类型的过滤条件保持不变，即在简洁的多选栏中显示一组标记。可以通过 Cmd/Ctrl 键 + 点击来多选类型过滤条件。为了简化界面，我们将与隐藏、屏蔽和第三方相关的复选框移到了下拉列表下方。该列表包含一个数字，表示下拉菜单下已选中的过滤条件数量。

此次报错是由于 chrome 浏览器升级之后，安全策略变更导致的；使用 CRX JS 打包 chrome 插件都会遇到这个报错，已经有老哥在 crxjs 的 github 上提交 issue 了；此次解决方案也是从这个 issue 上面找的；之前做过 chrome 浏览器版本发行说明，但是后面有事就耽搁了，现在觉得还是得提起来，这样能有效跟进版本迭代和一些坑，不至于出现问题手忙脚乱。

最近有个需求，是在浏览器插件中获取window对象下的某个数据，当时觉得很简单，和document一样，直接通过嵌入直接获取，然后使用发送数据到插件就行了，结果发现不是这样滴…在这里不推荐使用进行注入，很可能会报错：😗Chrome 浏览器插件获取网页 window 对象（方案一）Chrome 浏览器插件获取网页 window 对象（方案二）获取当前页面下的 window 对象和 document 对象不一样，需要另外的处理方式。

最近有个需求，是在浏览器插件中获取window对象下的某个数据，当时觉得很简单，和document一样，直接通过嵌入直接获取，然后使用发送数据到插件就行了，结果发现不是这样滴…在这里不推荐使用进行注入，很可能会报错：Chrome 浏览器插件获取网页 window 对象（方案一）

最近有个需求，是在浏览器插件中获取window对象下的某个数据，当时觉得很简单，和document一样，直接通过嵌入直接获取，然后使用发送数据到插件就行了，结果发现不是这样滴…