2025-12-07 17:55:47
欢迎来到第 128 期的【视野修炼 - 技术周刊】,下面是本期的精选内容简介
下面开始本期内容的介绍ღ( ´・ᴗ・` )比心。
Anthropic 是 Claude 大模型背后的公司。
Bun 作者发布的阐述博客内容中翻:Bun 被 Anthropic 收购
一个终端工具,功能很丰富!
分析:
清理:
系统状态:
所有指令
React Server Components(RSC)出现了一个最高级别(CVSS 10) 的安全漏洞。
攻击者可以直接在目标服务器上执行恶意代码。
笔者没有跑 Next.js 应用,没有受到影响。
更多信息↓:
Cloudflare 本周又挂掉:因防御 React Server Components 漏洞,Cloudflare 遭遇 25 分钟服务故障
bug 如何产生和修复看这里: React Server Components RCE 漏洞分析
钻了原型链漏洞,修复只需加上 hasOwnProperty 就行!
鱼皮阐述受到攻击:Next.js高危漏洞致服务器被黑,我已中招!
如何发现和利用漏洞插件:Next.js无条件RCE漏洞 - 浏览器插件
https://github.com/mrknow001/RSC_Detector
code996 是一个分析工具,它可以统计 Git 项目的 commit 时间分布,进而推导出项目的编码工作强度。
npx code996
由 Rolldown 驱动。
支持多种样式定制。
周刊部分内容来源如下渠道,推荐大家关注。
2025-11-16 17:40:58
欢迎来到第 127 期的【视野修炼 - 技术周刊】,下面是本期的精选内容简介
下面开始本期内容的介绍ღ( ´・ᴗ・` )比心。
import task from 'tasuku'
task('Task 1', async () => {
await someAsyncTask()
})
task('Task 2', async () => {
await someAsyncTask()
})
task('Task 3', async () => {
await someAsyncTask()
})
在做 CLI 的时候可以用上,尤其需要处理多个异步任务时。
还支持嵌套,多状态展示等。
感觉和 @clack/prompts 和非常搭配。
收藏 ⭐️!
进程大杀器,支持多种终止进程的方式👍🏻,跨平台可用。
import fkill from 'fkill'
await fkill(1337)
console.log('Killed process')
fkill('Safari')
fkill(':8080')
fkill([1337, 'Safari', ':8080'])
也支持 CLI 调用。
npm install --global fkill-cli
fkill 1337
fkill Safari
fkill :8080
还支持 交互式 CLI。
赶紧装上。
免费的测试文件生成器,支持视频/图片/音乐/文档等多种格式。
收藏⭐️,基本覆盖了常见的文件格式!
使用 TypeScript&TSX 编写 UI,可以直接编译成 iOS、Android 和 macOS 上 由 Native 渲染的视图应用,无 JS 中间层。
笔者拉仓库试了一下 Demo,效果如下。
感觉还行,就是才刚开源,文档还不是特别友好,项目初始化流程不是特别标准。
包含上百种 JS 引擎的基本信息 ES 支持程度,性能等对比信息。
使用 Error.cause 处理错误,保留更清晰的堆栈跟踪信息。
function fetchUserData() {
try {
JSON.parse('{ broken: true }') // ← This will fail
}
catch (parseError) {
throw new Error('Failed to fetch user data', { cause: parseError })
}
}
try {
fetchUserData()
}
catch (err) {
console.error(err.message) // "Failed to fetch user data"
console.error(err.cause) // [SyntaxError: Unexpected token b in JSON]
console.error(err.cause instanceof SyntaxError) // true
}
这个免费的工具可以对你的仓库进行分析,提供主题标签建议和其他推荐的行动项,帮助开发者更容易地找到你的项目。
提升你在 GitHub 搜索、Google 和大型语言模型(LLMs)中的仓库可见性。
周刊部分内容来源如下渠道,推荐大家关注。
2025-11-08 19:48:20
欢迎来到第 126 期的【视野修炼 - 技术周刊】,下面是本期的精选内容简介
养了一段时间身体,又断更了 2 月 😄。
一个框架无关的 Web 组件,用于创建带有粒子动画效果的隐藏文字内容。
<h1>
Beautiful
<spoiler-span>
spoiler effects
</spoiler-span>|
</h1>
⭐️!
2025 年 8 月,TypeScript 超越了 Python 和 JavaScript,TypeScript 现在是 GitHub 上最常用的语言 。
做复杂日历组件必备!收藏+1。
my-script --name John --age 20
import { typeFlag } from 'type-flag'
const parsed = typeFlag({
name: String,
age: {
type: Number,
alias: 'a'
}
})
console.log(parsed.flags.name) // 'John'
console.log(parsed.flags.age) // 20
生成由 SVG 驱动的打字动画。
先收藏,uni-app 开发小程序可以考虑考虑。
开源的 macOS 桌面应用,可以生成电脑屏幕一天的时间占用。它每秒截一次屏,然后交给 AI 分析,生成你一天活动的时间线。
本地使用阿里开源的 qwen 模型。
支持以视频的形式回顾屏幕历史。
windows 上印象也也有类似的工具(待我翻翻吃灰的收藏夹 再贴上来)。
获取图片的尺寸信息,支持现代的js运行环境(浏览器、Node.js、Bun、Deno等)
import { imageDimensionsFromStream } from 'image-dimensions'
// example1
const url = 'https://sindresorhus.com/unicorn'
const { body } = await fetch(url)
console.log(await imageDimensionsFromStream(body))
// example2
const data = getImage()
console.log(imageDimensionsFromData(data))
// => {width: 1920, height: 1080, type: 'png'}
Biome 是一个适用于 JavaScript、TypeScript、JSX等快速格式化工具,与 Prettier 有高达 97% 的兼容覆盖率,同时也是一个高性能的 linter。
现在支持 Vue、Svelte 和 Astro lint和格式化了!
提供匹配表情符号的正则
const emojiRegex = require('emoji-regex')
const regex = emojiRegex()
for (const match of text.matchAll(regex)) {
const emoji = match[0]
}
⭐️!
周刊部分内容来源如下渠道,推荐大家关注。
2025-09-30 19:10:28
9-25日出院啦!第一时间就买了夕发朝至的卧票回成都了。
术后身体还没恢复,不方便四处走动,不然就在上海逛逛啦😄
正好趁这段时间 + 上国庆中秋小长假养养身体 🥳。
本次待的时间比上次短,比上次术后状态好不少。
上海这边天气很好呀,待了小半个月,只遇到过几次雨。
↑ 病房窗外一直都这样 ↑
回家就连着下了几天雨 🌧,就连着家里躺了好几天。
飘窗外的树 🌳,都挂满了皂荚。
在飘窗上靠着 “冲浪” 活动活动脑子(紧邻 🛏 方便随时躺下休息休息 😋)
2025-09-16 16:51:45
又要待一段时间咯。
09-13 来上海复查病情又有点“新进展”,医生建议尽早入院治疗。
早治疗早康复,回家拖着也提心吊胆的,这次如果处理完,以后又是健康人了。
不过这次带了电脑💻,多个消遣方式。美中不足就是没有流畅的 WiFi(流量又要起飞了)。
没手术前,空闲时间多,能多产出一点哈哈😄(在医院里还是比较安心)
希望一切顺利吧。
大家都健健康康的!
2025-08-31 11:34:06
欢迎来到第 125 期的【视野修炼 - 技术周刊】,下面是本期的精选内容简介
近期因为身体原因,上机时间较少,码内容断断续续😋,断更了一段时间。
这周超火的图片编辑模型,谷歌出品的 Gemini Flash,"直接替代 PS"。
可直接上 Google Gemini Web 段体验。
下面给2个案例和提示词(来源于 X 上大佬 @ZHO_ZHO_ZHO 分享)
Use the nano-banana model to create a 1/7 scale commercialized figure of thecharacter in the illustration, in a realistic style and environment. Place the figure on a computer desk, using a circular transparent acrylic base without any text.On the computer screen, display the ZBrush modeling process of the figure. Next to the computer screen, place a BANDAI-style toy packaging box printed with the original artwork.
Generate a highly detailed photo of a girl cosplaying this illustration, at Comiket. Exactly replicate the same pose, body posture, hand gestures, facial expression, and camera framing as in the original illustration. Keep the same angle, perspective, and composition, without any deviation
大家也可以参考文章 实测谷歌Nano Banana,探索更多玩法!
挑一些实用的点:
使用 ESM 替代CJS
导入内置模块使用 node: 前缀以区分第三方模块 ,如 node:fs
import { readFile } from 'node:fs/promises';
await
import { readFile } from 'node:fs/promises';
const config = JSON.parse(await readFile('config.json', 'utf8'));
const response = await fetch('https://api.example.com/data');
const data = await response.json();
AbortController 终止请求const controller = new AbortController();
setTimeout(() => controller.abort(), 10000);
try {
const data = await fetch('https://slow-api.com/data', {
signal: controller.signal
});
console.log('Data received:', data);
} catch (error) {
if (error.name === 'AbortError') {
console.log('Request was cancelled');
} else {
console.error('Unexpected error:', error);
}
}
node:test
// test/math.test.js
import { test, describe } from 'node:test';
import assert from 'node:assert';
import { add, multiply } from '../math.js';
describe('Math functions', () => {
test('adds numbers correctly', () => {
assert.strictEqual(add(2, 3), 5);
});
});
# Run all tests with built-in runner
node --test
# Watch mode for development
node --test --watch
# Coverage reporting (Node.js 20+)
node --test --experimental-test-coverage
{
"name": "modern-node-app",
"type": "module",
"engines": {
"node": ">=20.0.0"
},
"scripts": {
"dev": "node --watch --env-file=.env app.js",
"test": "node --test --watch",
"start": "node app.js"
}
}
这个吊,之前都没了解到👍🏻,完美替代 alias
package.json 中添加 imports 字段
{
"imports": {
"#config": "./src/config/index.js",
"#utils/*": "./src/utils/*.js",
"#db": "./src/database/connection.js"
}
}
import config from '#config';
import { logger, validator } from '#utils/common';
import db from '#db';
基于 GitHub Action 基础能力,自动部署GitHub Pages和定时数据更新。
下面是笔者部署的自己的!
一个简单的工具,可帮助检查目标 URL 页面,哪部分内容是服务端渲染哪部分是CSR渲染。
GitHub风格本地 Diff 工具
npx difit
支持在 Node.js 和浏览器中运行,用于调整大小、裁剪、过滤、颜色调整以及许多其他高级操作的库。
👍🏻比较高级
收藏!
收藏!迟早有一天会用上。
周刊部分内容来源如下渠道,推荐大家关注。