图片处理

Squoosh — 压缩图片、调整尺寸，对比处理前后的画质。图片在本机处理。

SVGOMG — 精简 SVG 图标和插图。打开文件或粘贴代码，查看优化结果后下载。

Photopea — 在浏览器里编辑图片和 PSD 文件。需要改图层、裁剪或导出图片时可以用。

文本与数据

IT-Tools — JSON、YAML、Base64、时间戳等格式处理工具集合，支持中文。

JSON Crack — 把 JSON 等结构化数据画成交互图，查看对象、数组和字段的嵌套关系。

草图与流程

Excalidraw — 手绘风格的白板，用来画流程、页面草图和简单架构图。

发图片之前，先压缩一份

打开 Squoosh，拖入图片。照片可以试试 WebP；尺寸明显大于实际需要时，先缩小宽高，再调压缩质量。用分隔线对比前后效果，重点看文字边缘和渐变。满意后下载，保留原图。

如果处理的是 SVG 图标，用 SVGOMG 看优化前后的大小和预览。它处理矢量文件，不是照片压缩工具。

JSON 太长，看不清层级

在 IT-Tools 里找 JSON 格式化工具，先把缩进整理好。想看字段之间的嵌套关系，再用 JSON Crack 转成树状图。

排查时先缩小到相关字段。分享样例时，用测试数据替换原始值。

提交代码前，确认改了什么

在 Git 仓库目录运行：

git diff --stat
git diff
git diff --staged

第一条看未暂存改动的文件统计；第二条看具体内容；第三条看已经暂存、准备进入下一次提交的改动。新建但未跟踪的文件不会出现在这些 diff 里，可以用 git status --short 查看。

参数含义见 git diff 官方手册。

Git：Pro Git 中文版

在线阅读。Git 官网提供的完整书籍。从“Git 基础”查暂存、提交和撤销；分支操作看第三章。不必从头读完再开始用。

CSS：MDN 弹性盒子

中文教程。按行或列排列元素、对齐、换行和分配剩余空间时，可以直接参考这里的示例。

命令行：Missing Semester

课程原站 · 社区中文翻译。内容包括 Shell、编辑器、Git 和调试，适合补齐日常开发工具的使用方法。

忘了语法：CheatSheets.zip

打开速查表。按语言和工具分类的语法示例。适合查一个写法；需要完整解释时，再看对应的官方文档。