跳转到内容
实用工具集
搜索
Ctrl
K
取消
GitHub
选择主题
深色
浅色
自动
业务与通用工具
简单货币格式化
通过 Dinero 和 Intl 处理货币数据
文件大小格式化 (简单版)
文件格式化库 filesize
根据数组构建树
树形数组过滤工具
计算博客阅读时长
根据背景色自适应文本颜色
输入错误提示 —— 模糊集
轻量级模糊搜索 fuzzysearch
阿拉伯数字与中文数字的相互转换
网页公式排版工具 KaTeX
内容感知图像缩放 JS Image Carver
颜色排序算法
交互式医学图像工具 Cornerstone
快速制作出响应式邮件的框架 Mjml
超长定时器 long-timeout
基于内存的全文搜索引擎 MiniSearch
机器人工具集合
微小的撤销功能
文件下载
JSON 的超集 serialize-javascript
JSON 超级序列化工具
数据扁平化工具 normalizr
微小的 bus 库 mitt
检测图像 (视频) 加载完成库
专业的深拷贝库
强大的业务缓存库 memoizee
请求限流
强大的异步库 async
启发式缓存库 proxy-memoizee
极简 WebComponent 库 el
过去(未来)时间格式化
函数响应式开发库 RxJS
js 手写生成 pdf
查找解析祖先文件工具 find-up
聊聊 Unicode 编码
打印
开发辅助库
开发助力 mermaid 绘制图表
文件类型检测
小数位计算的四舍五入
项目版本比对
url 构造
stub 函数
生成唯一 id
微任务延迟调度
根据对象路径安全获取对象值
确保从列表中获取可用值
根据复杂对象路径操作对象
不可变数据工具库
优秀的不可变状态库 immer
前端构建工具配置生成器
tsconfig.json 生成器
利用 XState(有限状态机) 编写易于变更的代码
使用 better-queue 管理复杂的任务
跳转页面时可靠的发送埋点信息
web 多线程开发工具 comlink
Service Worker 工具箱 workbox
JavaScript 依赖注入库 awilix
前端存储工具库 storage-tools
小型 js 压缩工具
自动注入关系的依赖注入
通用微型状态管理器 nanostores
更强大的超文本标记语言 htmx
驼峰命名转化工具 camelcase-keys
React 极简状态管理库 unstated-next
Web 平台与体验
自然语言日期解析器 Chrono
使用 escape 解决 HTML 空白折叠
组合键提升用户体验
提升交互体验的 web Observer
切换中文简繁字体
使用 gsap 操纵动画序列
妙用 localeCompare 获取汉字拼音首字母
禁止浏览器进行表单填充
手写一个同步服务端时间的小工具
使用凭证优化登录流程
提取关键路径 CSS 工具 critical
Pagefind 静态网站搜索方案
浏览器文件操作
浏览器内置压缩流 API
浏览器中的取色器 API EyeDropper
性能与安全
压缩传递对象的 JavaScript 工具库 u-node
使用 Bun 提升代码运行效率
高性能的 JavaScript 运行时 just-js
单例 Promise 缓存!
图片压缩服务 tiny-png
浏览器端图片转换库 use-squoosh
动态加载脚本与样式!
利用 gpu 加速数据运算
通过批处理避免布局抖动 fastDom
提高转化率的预请求库 instant.page
提高转化率的预渲染库 quicklink
跳过 v8 pre-Parse 优化代码性能库 optimize-js
通过重用减少垃圾回收
生成辅助分析的火焰图工具 0x
AVIF 图片格式
利用 'ts' 编译 WebAssembly
通过扁平字符串提升输出性能
网络性能监控库 Perfume
加快执行速度的编译缓存工具 v8-compile-cache
让 React 拥有更快的虚拟 DOM
复杂的主线程调度工具库
安全三要素
使用 HTTPS
css 键盘记录器
xss 过滤器 DOMPurify
CSP 内容安全策略
防御 ReDoS 攻击
使用 HttpOnly 解决 XSS Cookie 劫持
浏览器原生 xss 过滤器
文件名替换非法字符串
前端 CORS 工具 XDomain
使用一行代码发现前端 js 库漏洞
URL 验证
有趣的安全补丁
开发工作流
快速调试编辑器 RunJS
TypeScript 代码执行工具
自动切换故障 CDN 工具
LocalCDN 插件提升网站加载速度
静态代码分析工具 Understand
漂亮的专业排版软件 TeXMacs
跨平台的音乐播放器 Listen1
开发者的边车辅助工具 DevSidecar
字符串化对象结构库 qs
使用 Lighthouse 审查网络应用
sourcemap 可视化工具
多运行时版本管理器 mise
代码重构工具 Grit
AI 工作流自动化平台 n8n
AI 编码代理编排工具 Vibe Kanban
AI 编码助手输出过滤代理 RTK
前端 Code Review AI Skill
SQL 构建网页工具 SQLPage
搜索和更改代码结构的工具 comby
大文件版本控制工具 git lfs
计算项目代码行数工具 cloc
影刀 RPA
git 图形化工具 lazygit
使用 JS 编写脚本的工具 zx
通过灭霸脚本学 shell
使用 cron 实现定时任务
纠正控制台错误命令工具
修改 window 上的变量
使用代理查看对象调用
查找调试 JS 全局变量
交互式编码工具
工程化与测试
利用增量构建工具 Preset 打造自己的样板库
依赖库本地调试 yalc
依赖版本更新工具 npm-check-updates
使用 pnpm patch 修补依赖库
构建工具统一插件工具 unplugin
高性能 Web 渲染引擎 kraken
使用 Web 开发 Flutter 应用 WebF
助力 Web 构建跨平台应用 Lynx
服务端性能测试工具 JMeter
流量复制工具 GoReplay
使用 Pollyjs 进行 HTTP 请求测试
新的端到端测试框架 cypress
猴子测试工具 gremlins
后端与数据服务
Hono 深入使用指南
HonoX 全栈框架
Hono RegExpRouter 原理
Drizzle ORM 性能设计
Go 数据库访问层 sqlc
Hertz + pgxpool + sqlc 实用组合
Go Context 原理与实践
JavaScript 语言与文本处理
New Function 创建异步函数
函数拷贝
取得范围数据
通向地狱的 ES1995
对比 switch (true) 和 if else 判断
奇怪的 parseInt(0.0000005)
使用宏扩展 JavaScript 语言
玩转 AbortController 控制器
ponyfills
esm 动态引入
用编程的方式清晰的构建正则表达式
高度优化的 glob 匹配库 micromatch
基于数字范围生成高性能正则
基于字符串生成 DFA 正则表达式
数据结构
前缀树
并查集
哈希表
优先队列
跳表
参考 C++ STL 实现的的数据结构库 js-sdsl
图形、可视化与游戏
CSS 数据可视化框架 Charts.css
绝佳的 SVG 库 Snap.svg
手绘风格工具库 rough
功能强大的 canvas 库 fabric
最快的 2D WebGL 渲染器 Pixi
高性能图形系统 SpriteJS
声明式 JSON 图表库 vega
群侠传,启动!
网页端视觉小说引擎 WebGAL
视觉小说游戏引擎 Ren'Py
产品与部署服务
国外赛博菩萨罗列
国内赛博菩萨罗列
前端部署工具 PinMe
现代化 Web 服务器 Caddy
高性能 Web 服务器 H2O
Web 应用部署工具 Kamal
Docker Swarm 容器编排
轻量级 Kubernetes K3s
GitHub
选择主题
深色
浅色
自动
生成辅助分析的火焰图工具 0x
软件的性能分析,往往需要查看 CPU 耗时,了解瓶颈在哪里。火焰图(flame graph)是性能分析的利器。
这里我用 2 个案例来使用 0x。