#碎碎念 #里程碑
996 订阅纪念（欸嘿）

#优质博文 #AI
AI 不会杀死初级开发者——但你的招聘策略可能会 ｜ 英文原文

AI 摘要：本文深入探讨了 AI 时代下初级开发者的角色转变与重要性，强调虽然 AI 工具能够自动化许多基础编码任务，但初级开发者仍然是未来高级工程师的基石。文章指出，过度依赖 AI 或忽视初级岗位的招聘策略可能导致人才断层，而明智的公司应重新定义初级开发者的价值，注重培养其调试、系统设计、沟通等核心技能，并将 AI 作为学习工具而非替代品。通过调整招聘、培训和评估方式，初级开发者可以在 AI 助力下更快成长，同时避免技能退化。

• 初级开发者的角色转变：AI 自动化了重复性编码任务，初级开发者应聚焦于调试、代码审查、系统设计等高层次技能，而非仅写样板代码。文章引用行业领袖观点，强调无视初级岗位将导致未来人才短缺。
• AI 工具对日常工作的影响：AI 工具如 Copilot 让初级开发者从琐碎任务中解放，但也提高了对他们的期望，他们需扮演“AI 代码编辑者”，验证和优化 AI 输出，而非盲目接受。
• 学习方式的改变：现代初级开发者依赖 AI 工具和自学，学习速度加快，但可能缺乏深度理解。文章警示过度依赖 AI 可能导致基础薄弱，建议将 AI 作为学习工具而非“万能药”。
• 核心技能的重要性：调试、代码阅读、系统设计和沟通等技能在 AI 时代更为关键，初级开发者需培养独立思考和工程直觉，以应对 AI 无法解决的复杂问题。
• 过度依赖 AI 的风险：盲目依赖 AI 可能导致技能退化，形成“纸牌屋式代码”，缺乏调试和问题解决能力。文章强调需平衡 AI 使用与自主学习。
• AI 时代的新技能需求：包括提示工程、批判性评估 AI 输出、了解 AI 局限性等。初级开发者需掌握 AI 工具的使用，同时关注伦理和安全问题。
• 辅导与入职培训的更新：导师需教导初级开发者如何正确使用 AI，强调“信任但验证”原则，并通过结对编程和代码审查强化基础技能。
• 绩效评估的转变：从代码产量转向理解力和解决问题的能力，管理者更关注初级开发者是否能有效利用 AI 并从中学习。
• 职业晋升路径的加速：AI 帮助初级开发者更快接触复杂任务，但需避免知识漏洞。未来“初级”与“中级”的界限可能模糊，适应力成为关键。
• 未来趋势与角色演变：团队可能更精简，初级岗位数量减少，但对优秀工程师需求增加。未来初级开发者可能演变为“AI 协调人”，需持续更新技能。
• 对工程领导的建议：继续投资初级开发者，优化招聘与培训，营造“信任但验证”的文化，重新定义绩效标准，并保持以人为本的团队氛围。
• 总结与展望：AI 不会消灭初级开发者，而是重新定义其角色。组织应将 AI 作为放大潜力的工具，通过培养初级开发者保障团队创新力和竞争力。

author Addy Osmani

baoyu.io

AI 不会杀死初级开发者——但你的招聘策略可能会

今天没有初级开发者，就不会有明天的高级开发者：重新思考人才培养

Akasha Terminal: dev🍃

有人出钱让我尝了一下绿联的 nas，总之别买（好像也不是不能买，有些配置跟DIY一个价了，硬咽下去也不是不能吃）
所有可玩性全在 docker 和 vm 上，除此之外基本是个残废。
约等于自己装的系统带个送的内网穿透，但是只能穿透系统自带服务（docker/vm额外的端口都不行）。
听说旧版系统还要更逆天，那我都不敢想。

商单视频里看内容挺丰富的吧？但那就是全部了，除此之外什么都没有。

#碎碎念 #新设备
国补入了一个绿联 nas，然后现在绿联、极空间、Unraid（在妲喵家里）都有了，然后这么看下来感觉还得是极空间的系统体验好。
极空间做的太好了我来夸一个，尤其是极影视，刮削体验超级棒，而且一直更新没停过。

后续体验评测：https://t.me/AkashaTerminal/2709

Telegram

Akasha Terminal: dev

还有它这个 UI！
删除存储池必须手动删除所有 app，必须一个一个删除，没有批量删除的方法。
重量级的，它把内置不能删的，和可插拔的组件，列在一个表里，还得一个个点进去看能不能删……

#优质博文 #前端 #javascript #typescript #工程化 #新动态
⚡️ JavaScript Weekly Issue #737

AI 摘要：本期《JavaScript Weekly》涵盖了 JavaScript 发展的历史里程碑、TypeScript 的性能革新、框架简介以及多个工具和库的更新。文章详细介绍了 JavaScript 30 年的发展历程，TypeScript 编译器的原生预览版带来的性能提升，以及多个主流框架的核心理念。此外，还包括了 Node.js 等工具的最新版本发布、Electron 性能优化的经验分享，以及一系列实用工具和资源的推荐，适合对前端开发和技术动态感兴趣的开发者深入了解。

• JavaScript 历史回顾：由 Deno 团队撰写的文章，详细梳理了 JavaScript（最初名为 LiveScript）自诞生以来的 30 年发展历程，从 Netscape Navigator 的首次亮相，到 JScript 分支、标准化进程、Node.js 的引入，直至现代生态系统的形成，呈现了一个全面的时间线。
• TypeScript 原生预览版发布：微软宣布了 TypeScript 编译器的原生预览版，通过将编译器移植到 Go 语言实现原生编译和更高的并发性能，Anders Hejlsberg 早前预告的 10 倍速度提升现已可供开发者尝试。
• JavaScript 框架简介：SolidJS 的创作者 Ryan Carniato 制作了一段 11 分钟的视频，简明扼要地讲解了 React、Angular、Vue、Svelte 和 Solid 等框架的不同设计理念和应用场景，内容紧凑且适合快速了解框架全貌。
• 简讯与更新：
• 公布了下周 TC39 会议的议程及讨论提案。
• React Router 现已预览支持 React Server Components。
• 版本发布：
• Node.js 发布了 v24.1.0（当前版）和 v22.16.0（LTS 版）。
• Bun v1.2.14：快速 JavaScript 运行时和工具包。
• Slonik v48：Node.js 的 Postgres 客户端，支持运行时和构建时类型安全。
• 其他更新包括 Zod v4、Astro 5.8、ESLint v9.27.0。
• 文章与教程：
• Angular 新动态：Google I/O 活动中，Angular 团队分享了框架的最新更新，预告 Angular 20 的发布。
• ESLint v9.0 回顾：Nicholas C. Zakas 回顾了 ESLint v9.0 发布一年来的经验教训，重点讨论了新默认的 flat-config 系统带来的挑战。
• Electron 性能优化：分享了 Slack、Notion 和 VS Code 等应用如何提升 Electron 应用性能的六种方法。
• 其他短文：包括数组索引方法 at() 的用法、Node.js 控制台文本样式化、JavaScript WebSocket 认证等。
• 代码与工具：
• Defuddle：从网页提取主要内容的工具，类似于 Mozilla 的 Readability，有在线演示。
• snapDOM：快速准确地将 DOM 节点捕获为 SVG 图像，保留样式和背景。
• ForesightJS：预测鼠标意图的库，通过预加载数据减少延迟（对触摸设备效果有限）。
• Astra：新的 JavaScript 到 EXE 编译器，仅支持 Windows。
• Crosspost：支持跨多个社交网络（如 Bluesky、X、Mastodon）发布内容的 JS 工具。
• Rockpack 6.0：React 应用启动工具，支持 React 19，集成 SSR、打包、Linting 和测试。
• 其他工具更新包括 Calendar Link、octokit.js、image-type 和 Peggy。
• 其他动态：
• Google I/O 开发者主题演讲展示了 Chrome DevTools 的新功能。
• 微软发布 VS Code 的 Postgres 扩展，支持 SQL 智能补全和 GitHub Copilot 集成。
• Anthropic 推出 Claude 4 模型，广泛应用于编码工具。
• Glitch 平台将关闭应用托管功能，未来发展方向不明。

Deno

A brief history of JavaScript | Deno

In 30 years, JavaScript went from being a little scripting language to one of the world's most popular. Here are key moments to show how it has evolved and where it is headed.

#优质博文 #css #前端 #新特性 #course
Better CSS Shapes Using shape() — Part 1: Lines and Arcs

AI 摘要：本文详细介绍了 CSS 新增的 shape() 函数在创建复杂形状方面的应用，特别是在使用直线和弧线绘制 CSS 形状时的强大功能。作者通过具体示例和实践，展示了如何利用 shape() 函数结合 CSS 特性（如变量、单位和数学函数）创建各种形状，介绍了 shape() 的基本命令（如 from、line、hline、vline ），建议优先使用 line 命令以提高代码可读性，并对比了 shape() 与传统方法（如 clip-path 和 mask）的适用场景。此外，文章还提供了 SVG 到 CSS 的在线转换工具，方便开发者快速转换代码。

author Temani Afif

CSS-Tricks

Better CSS Shapes Using shape() — Part 1: Lines and Arcs | CSS-Tricks

This is the first part of a series that dives deep into the shape function, starting with shapes that use lines and arcs.

Akasha Terminal: dev🍃

最近有个想法，之前私下联系过几个开发者，似乎都没什么兴趣。 许多开源社区开发者自身经济状况并不好，一台mac可以在这些人手里发挥更大价值。之前在推特刷到一个换新mac闲鱼出旧品惨遭到手刀，怒而免费送的故事。 我也刚刚从一段比较黑暗的时期走出来，经济状况还不算太健康，但现金流已经稳定，也可以拙劣地模仿一下。 如果你是开发者，还是上学的阶段，或者暂时没有收入，那你可以联系我，任选一台MBP M1 Pro，14寸或者16寸。不需要任何支付手段，你可以用它做任何事，但是3/6/12/24个月需要跟我交流一次。如…

#碎碎念 是俺的旧 mac 喵，走过路过可以瞅一瞅
update: 已有开发者联系，感谢各位的关注和转发。
好快的🈚️

最近有个想法，之前私下联系过几个开发者，似乎都没什么兴趣。
许多开源社区开发者自身经济状况并不好，一台mac可以在这些人手里发挥更大价值。之前在推特刷到一个换新mac闲鱼出旧品惨遭到手刀，怒而免费送的故事。
我也刚刚从一段比较黑暗的时期走出来，经济状况还不算太健康，但现金流已经稳定，也可以拙劣地模仿一下。

如果你是开发者，还是上学的阶段，或者暂时没有收入，那你可以联系我，任选一台MBP M1 Pro，14寸或者16寸。不需要任何支付手段，你可以用它做任何事，但是3/6/12/24个月需要跟我交流一次。如果经济条件改善之后，你可以以低于市场价的价格折价购买它，或者用完之后还给我。
你必须已有长期的开源项目参与经验，或者是知名开源项目的maintainer。请发送给我github个人页链接，或者其他的等效证明方式。
联系 @Hy4c1ne

#javascript #前端 #趣站
一个 JavaScript 猜输出测验网站🤣
https://douiri.org/quizzes/javascript-guess-the-output/

#优质博文 #javascript #前端 #开源 #新动态
Awesome JavaScript Weekly - Issue 470, May 22, 2025 | LibHunt

AI 摘要：本期 Awesome JavaScript Weekly 汇总了 Deno 生态澄清、数据库架构语言争议、JavaScript 内存管理、Electron 性能优化等前沿技术文章，同时推荐了 GitHub 个人资料生成器、反检测爬虫工具等热门开源项目，涵盖开发实践与工具生态。

1. 技术文章精选
• Deno 生态现状
• Reports of Deno's Demise Have Been Greatly Exaggerated
驳斥 Deno 生态衰落的传言，分析其持续迭代的活跃社区和近期功能更新。
• 数据库架构设计争议
• Stop Inventing DB Schema Languages
批评过度设计数据库模式语言的现象，提倡复用现有 SQL 标准与工具链（如 Kysely）。
• JavaScript 知识挑战
• Javascript Guess the Output Quiz
通过交互式测验解析 JavaScript 隐式类型转换、作用域等易错特性。
• 安全实践指南
• JavaScript Security Best Practices
从依赖审计、CSP 策略到沙箱隔离，系统化阐述前端安全防护方案。
• 内存管理深度解析
• How Memory Works in JavaScript and Node.js
对比 V8 引擎堆栈内存分配、垃圾回收机制及 Node.js 进程内存限制的调优策略。
• Electron 性能优化
• 6 Ways Slack/Notion/VSCode Improved Electron Apps
总结懒加载、进程隔离、V8 快照等六大优化手段的落地案例。
• JavaScript 语言特性
• Symbol.unscopables
MDN 官方文档更新，详解 Symbol.unscopables 在 with 语句中的作用。

2. 工具与框架
• 新兴框架
• Moose: TypeScript 分析后端框架
专为数据分析场景设计的全栈框架，支持实时聚合与可视化管道。
• 开发工具
• Slides.html with Vanilla JS
纯原生 JavaScript 实现的轻量级幻灯片工具，无依赖、可嵌入式部署。

3. 热门开源项目
• github-profile-header-generator: 自动化生成个人主页横幅图像
• rebrowser-patches: 对抗 Cloudflare 检测的 Puppeteer/Playwright 补丁集
• wBlock: Safari 高性能广告拦截器
• Checkmate: 自托管服务器监控工具，支持实时可视化
• ai-digest: 代码库聚合工具，输出 Markdown 供 AI 分析

Deno

Reports of Deno's Demise Have Been Greatly Exaggerated | Deno

Addressing recent Deno criticisms and sharing our vision for the future

#优质博文 #git #工程化
How Core Git Developers Configure Git

AI 摘要：本文分享了 Git 核心开发者常用的配置设置，并探讨了这些设置为何应成为默认值。文章分为三部分：明显改进 Git 的配置（如分支排序、标签排序、默认分支、差异算法等）、无害且可能有用的配置（如自动纠正提示、提交时显示差异等），以及个人偏好的配置（如合并冲突样式、拉取默认行为等）。作者通过实际示例和配置代码，详细解释了每个设置的作用和优势。

TLDR
• 提供了一组 Git 配置代码，可直接复制到 ~/.gitconfig 文件中，涵盖分支、标签、差异、推送、拉取等优化设置。

How do Git core devs configure their Gits?
• 介绍了 Git 核心开发者通过邮件列表讨论的“春季大扫除”实验，参与者分享了他们认为应成为默认的 9 项配置和 3 个别名。
• 这些配置包括 merge.conflictstyle、rebase.autosquash、diff.algorithm 等。

Clearly Makes Git Better
1. Listing branches
• 使用 branch.sort = -committerdate 按提交日期排序分支，column.ui = auto 以列格式显示分支。
2. Listing tags
• 使用 tag.sort = version:refname 按版本号排序标签，避免字母顺序的问题。
3. Default branch
• 设置 init.defaultBranch = main 避免每次初始化仓库时的警告。
4. Better diff
• 使用 diff.algorithm = histogram 改进差异算法，diff.colorMoved = plain 高亮移动的代码。
5. Better pushing
• 设置 push.autoSetupRemote = true 自动设置上游分支，push.followTags = true 自动推送标签。
6. Better fetching
• 使用 fetch.prune = true 和 fetch.pruneTags = true 自动清理已删除的远程分支和标签。

Why the Hell Not?
1. Autocorrect prompting
• 设置 help.autocorrect = prompt 在输入错误命令时提供纠正建议。
2. Commit with diffs
• 使用 commit.verbose = true 在提交消息编辑器中显示完整差异。
3. Reuse recorded resolutions
• 启用 rerere.enabled = true 和 rerere.autoupdate = true 自动重用冲突解决方案。
4. Global ignore file
• 设置 core.excludesfile = ~/.gitignore 使用全局忽略文件。
5. Slightly nicer rebase
• 使用 rebase.autoSquash = true 和 rebase.autoStash = true 优化变基操作。

A Matter of Taste
1. Better merge conflicts
• 使用 merge.conflictstyle = zdiff3 在冲突标记中显示原始内容。
2. Better pulling
• 设置 pull.rebase = true 将拉取默认行为设为变基而非合并。
3. Run the fsmonitor processes
• 启用 core.fsmonitor = true 和 core.untrackedCache = true 加速大仓库的状态检查。

author Scott Chacon

GitButler

How Core Git Developers Configure Git

What `git config` settings should be defaults by now? Here are some settings that even the core developers change.

#优质博文 #前端 #css #tools
https://css-generators.com/svg-to-css/

此工具可将使用 <path d=“...”> 创建的 SVG 形状转换为 CSS 形状（使用 clip-path 的新 shape() 函数制作）
单元素实现，可用于图像并支持渐变色

SVG to CSS Shape Converter | CSS-Tricks

AI 摘要：本文介绍了由 CSS 形状专家 Temani Afif 开发的新工具，该工具可将 SVG 路径（ path() ）转换为新的 CSS shape() 函数命令。文章对比了两者的语法差异，并强调了该工具作为学习资源的实用性，尽管 path() 并未被弃用，但 shape() 提供了更直观的坐标描述方式。

#优质博文 #前端 #css #新特性
CSS snippets

AI 摘要：Jeremy Keith 分享了他在新项目中默认使用的 CSS 实践和代码片段，包括逻辑属性、用户偏好查询、视图过渡、自定义属性和流体排版等现代 CSS 特性，并提供了多个可复用的实用代码片段，强调可访问性和渐进增强的重要性。

1. CSS 习惯用法
• 默认使用逻辑属性（如 inline-start 替代 left），以支持多语言书写方向。
• 通过 prefers-reduced-motion 和 prefers-color-scheme 查询优化用户体验。
• 视图过渡（View Transitions）默认启用，但包裹在减少运动偏好查询中。

2. 颜色与自定义属性
• 使用 OKLCH 色彩空间，即使从十六进制值开始转换。
• 自定义属性的应用策略：避免过早优化，仅在值重复多次时提取为变量。

3. 排版技术
• 使用 clamp() 实现流体文字大小，结合 Utopia 工具调整类型比例。
• 新属性 text-wrap: pretty/balance 和 hanging-punctuation 优化文本换行与标点悬挂。

4. 可复用代码片段
• figcaption 样式：居中短文本，多行时左对齐（max-inline-size: max-content）。
• 焦点样式：a:focus-visible 使用 currentColor 和相对单位（0.25em）。
• 低特异性技巧：通过 :where() 选择器或层叠层（@layer core）确保样式可覆盖。

5. 未来改进方向
• 探索 :has() 选择器和容器查询的更多用例。
• 采用 lh 单位（行高）控制块间距。

6. 读者互动：
• Carlos Espada 补充了 :has() 的实用案例（如 body:has(dialog[open]) 禁用滚动）
• Marc Görtz 提到迁移至 oklch() 色彩和 lh 单位的实践

author Jeremy Keith

Adactio

CSS snippets

Some styles I re-use when I’m programming with CSS.

#优质博文 #css #前端 #AI #tools #新动态
Frontend Focus #693 — May 21, 2025

AI 摘要：本期 Frontend Focus 聚焦 2025 年 Google I/O 大会的前端技术动态，涵盖 Gemini AI 集成、CSS 新特性、开发者工具升级等内容，同时推荐了设计系统构建、Web 可访问性改进等实用工具与文章。

1. Google I/O 2025 重点更新
• 开发者主题演讲：展示 Gemini AI 如何辅助 Web 开发（1 小时 10 分钟）。
• Chrome 与 Web 新特性：包括 Baseline 标准、CSS 功能（如 CSS Carousels）、Core Web Vitals 优化等。
• AI 集成：Gemini AI 将嵌入 Chrome 和开发者工具，提供多模态 Prompt API。
• 工具支持：Visual Studio Code 新增 Baseline 兼容性支持。
• 来自 Google I/O 10 的 2025 项更新：CSS 轮播、AI 驱动的 DevTools、具有多模式功能的提示 API 等

2. AI 与开发工具
• 'MCP is the Coming of Web 2.0 2.0'：Anil Dash 探讨 LLM 与第三方工具交互的开放协议潜力。 #MCP
• Mozilla 观点：呼吁在谷歌反垄断案中平衡搜索与浏览器竞争。
• 开发人员浏览器 Polypane 24.1 新增 CSS 选择器测量工具。
• Safari Technology Preview 219 和 Chrome 137 DevTools 新功能。

4. 教程与文章精选
• CSS 技巧：
• Temani Afif 使用 clip-path: shape() 创建动态 Blob 形状。
• Jeremy Keith 分享实用 CSS 代码片段。
• Zoran Jambor 演示弹性网格布局（Flexible Wrapping CSS Grid）。
• 可访问性：
• HTML 邮件的可访问性仍待改进（基于 40 万封邮件分析）。
• Chris Coyier 探讨 RTL 语言布局翻转问题。
• 多篇文章讨论 WCAG 2 合规性和图片可访问性解决方案。

5. 工具与资源
• AI 相关：
• prompt-kit：基于 shadcn/ui 的 AI 应用组件库。
• Polarr 的 AI Color Match：图像色彩匹配工具。
• 开发工具：
• Datastar：结合 Alpine.js 与 htmx 的超媒体框架。
• jsPad：支持多技术栈的在线代码沙盒。
• Crosspost：跨社交网络一键发布工具。
• ColorPocket：用于组织和选择颜色的 Chrome 扩展程序

6. 其他亮点
• 趣味实验：Eric Parker 尝试用 Windows 95 浏览现代网页（体验极差）

io.google

Google I/O 2025: Developer keynote

Don’t miss Google I/O, featuring product launches, innovations, and insights. Tune in for the live keynotes and sessions.