好文章
动态 SVG 以及动画
SVG 大家应该都不陌生了，这里有两篇 SVG 相关的文章 使用 CSS、JS 改变 SVG 的颜色、使用 framer motion 制作 svg 动画 ，用于理解动态 SVG 以及SVG 动画的实现。
CSS Grid 布局交互式指南
JoshWComeau 大佬的一篇 Grid 指南，通过交互式的方式学习 Grid 布局。Grid 布局还是比较复杂的，上手难度较高，这是一个比较好的基础入门文章。
无头组件（Headless Component）：一种构建React UI 组件的模式
Headless Component 是一种 React 的设计模式，React hooks 负责逻辑和状态管理、底层采用通用的数据模型，UI 外观交给使用这个组件的开发人员。
使用原生 JS 操作 DOM 的一系列技巧
这是一系列的 DOM 操作的技巧文档，没有任何外部库，只使用浏览器 API。比如网页阅读时长、检测是否在指定元素的外部点击、进入全屏模式、检测大写锁定是否打开、Tab 缩进和 Shift+Tab 取消缩进等等等等。内容非常多。
虽然我们使用框架、三方库做了很多事情，还是难免会遇到要自己实现 DOM 操作的。适合没事浏览看看，或者需要时在其中查找方案。
git rebase 会出什么问题
我个人是非常推崇 git rebase 的，它可以让你的 commit 保持线性的提交历史，非常干净。但是也很难向同学们推广，因为 rebase 操作复杂，有很多概念要理解，"容易出错"。需要看你能够接受这个成本。
这篇文章总结 git rebase 会出现的，已经对应的解决方案，非常值得阅读一遍。
比如：
- 撤销 rebase，使用
git reflog找到操作记录撤销。 - 共享分支使用了 rebase 导致需要
push --force- 绝大数情况下都不要
push --force到共享分支 - 一般情况下使用 pull rebase 是不会有问题的
- 使用
git fetch+git push --force-with-lease二连
- 绝大数情况下都不要
等等等。
但也仍然存在一些问题很难解决：长寿命的分支 rebase 会很麻烦（定期 rebase ？）、会破坏中间的提交状态、需要定制 rebase 规范等等。但是仍旧推荐大家使用 rebase 替代 merge 。
修改桶文件导入，提升了 3 倍的构建速度
上一期有分享过 桶文件（barrel files）的崩溃 ，将 n 多个文件放在一个文件里面导出，会影响性能。
这又是一个优化桶文件的案例，将 26s 的构建速度优化到了 8s。
改造前：
vite v4.5.0 building for production...
transforming...
✓ 11798 modules transformed.
改造后：
vite v4.5.0 building for production...
transforming...
✓ 390 modules transformed.
最佳实践
node 应用配置的最佳实践
我们一般都知道使用 .env 配置文件以及 dotenv 库读取配置，这篇文章在这基础上给出了一些环境配置的反模式用例。
以及作者认为的健壮的 nodejs 配置应该具有一下特点：
- 异步加载配置
- 定义配置的 Schema，在运行时验证，避免配置值丢失或无效时运行失败
- 具备配置管理器，可以在应用任何位置访问
- 具备配置工厂，针对不同环境、不同部分的程序创建多个配置实例
node CLI 应用的最佳实践
一个关于如何构建成功的、富有同情心的、用户友好的 Node.js 命令行界面（CLI）应用程序的精选最佳实践的集合。
包含了命令行体验、打包分发、与其他命令行工具无缝集成、版本兼容、错误提示、开发维护等等方面，36 个最佳实践。
awesome
awesome nodejs security
如果你正在开发 node 服务，并需要安全增强，这个 awesome 库可以看看。同时也可以通过这个这个库学习哪些安全问题需要注意。涵盖了 web 框架强化、静态代码分析、动态应用安全测试、输入校验、输出 encode、安全合成、CSRF、漏洞和安全建议等等。