【开源自荐】A Box of Tools：35 个纯前端的文件工具，源码即浏览器运行的代码

[Josanshuo]

项目地址：https://github.com/A-Box-of-Tools/website
在线体验：https://abox.tools/zh/

35 个浏览器端的小工具，一个工具只干一件事：图片压到指定大小、合并/压缩/涂黑
PDF、裁剪视频、剪辑音频、读二维码、格式化 JSON、文本对比、生成多尺寸 ico。

这个周刊讲的是前端精读，所以说几个实现上的取舍，可能比工具清单本身有意思：

• JavaScript 没有构建步骤。整站没有依赖、没有 lockfile，tools/<slug>/src/
  里的 ES module 就是浏览器逐字节加载的文件。代价是不能用任何需要编译的东西，
  好处是 View Source 和仓库里的代码永远一致，python build.py --check 可以
  把线上文件和仓库逐字节比对。
• 共享模块不能被单测覆盖的叶子模块 import。构建时把 shared/js/x.js 拷进
  各个工具的 src/shared/x.js，这个路径在源码树里并不存在，所以 ./shared/
  的 import 只能写在 main.js 里，构建会检查这条规则。
• 用户能读到的句子一律不写在 JS 里。src/ 会被逐字节拷进每种语言，字符串
  写在 JS 里就等于只有英文是对的；文案放在 body.html 的 #phrases 里，用
  phrase() 读回来。深到摸不到 DOM 的模块返回 key，由调用方去解析。
• 每个工具是独立的 service worker 注册，缓存名必须带自己的 scope 前缀——
  同源共用一个 cache storage，activate 里删掉非自己前缀的缓存就会把邻居的
  干掉，这个坑真踩过。

MIT 开源，15 种语言，简繁中文都是完整翻译。