auth.uid() = owner_id 策略仅允许文件所有者访问文件。LocalStorage查看器 - 浏览器存储键值探查
实时查看当前域名下所有localStorage键值对,支持编辑、删除和导出,前端调试利器。
存储读写速度测试 - localStorage vs IndexedDB
对localStorage和IndexedDB的读写操作进行计时,比较两者性能差异。
Resource Timing 缓冲区管理 - 处理大量资源计时
设置资源计时缓冲区大小,监听 resourcetimingbufferfull 事件并处理。
RAML 在线预览器 - API设计文件可视化
编辑RAML定义,实时渲染资源结构、方法及响应示例,适合REST API设计初期。
记忆化(Memoization)函数演示 - 缓存结果对比
对一个耗时函数应用记忆化,展示相同输入下第二次调用速度的提升和缓存命中。
滚动捕捉沙盒 - CSS Scroll Snap实验
调整滚动容器和子项的对齐方式、停止点,观察CSS Scroll Snap平滑滑动效果。
CSS 容器查询实验室 - 基于卡片宽度的响应式布局
拖拽改变容器宽度,观察使用container-type和@container规则的元素如何自适应样式。
进程调度可视化 - FCFS/SJF/轮转对比
输入进程列表,同时对比先来先服务、短作业优先和轮转调度算法的甘特图和平均等待时间。
绘制时机检测 - FP/FCP性能指标展示
通过PerformanceObserver获取首次绘制(FP)和首次内容绘制(FCP)时间。
Open Graph 标签在线调试器 - 富媒体预览模拟
输入URL提取OG标签,模拟Facebook/Twitter/LinkedIn卡片显示效果,优化链接分享。
JWT手动解码器 - 无须库解析Header与Payload
粘贴JWT,自动Base64解码并显示明文Header和Payload。
文件系统访问演示 - File System Access API
使用现代浏览器文件系统访问API打开、编辑并保存本地文件,演示权限流程。
预加载扫描器模拟 - 查看浏览器如何提前发现资源
输入 HTML,模拟浏览器的预加载扫描器,列出将提前请求的资源。
CPU 调度算法模拟器 - FCFS/SJF/Round Robin
添加进程(到达时间、运行时间),并行动画演示先来先服务、短作业优先、轮转等调度算法的执行。
轻量级 API 集合运行器 - 导入 Postman Collection 运行
导入 Postman Collection JSON 文件,按顺序执行请求并显示响应,模拟简单的自动化测试。
Blob URL 创建与预览 - 内存中生成可下载链接
输入文本或拖入文件,生成 Blob URL 并在新标签页预览或触发下载,理解对象 URL 机制。
压缩流API演示 - 实时gzip/brotli压缩
使用CompressionStream和DecompressionStream对文本进行实时的gzip或brotli压缩与解压。
网络信息 API 演示 - 带宽类型与 RTT 查询
展示 navigator.connection 提供的有效连接类型(4g/3g/2g)、下行速度和往返时间。
栈式虚拟机演示 - 后置运算执行
输入后缀表达式或简单指令,逐步演示栈的压入弹出计算过程。
预加载/预获取指南 - 资源提示选择
根据资源类型和加载场景,推荐使用preload、prefetch还是preconnect标签。
Data URI 生成器 - 文件转内联base64
拖放小图片或文本文件,转换为可嵌入HTML/CSS的Data URI,设置MIME类型。
短链接生成器 - 调用第三方 API 缩短网址
输入长 URL,通过 TinyURL 或类似 API 生成短链接,并可复制或生成 QR 码。
Referrer策略检测 - 请求头分析
显示当前网页的Referrer-Policy设置,并模拟不同策略下的Referer发送情况。
图像隐写解码器 - 最低有效位LSB提取
上传疑似隐写图片,提取每个像素的最低位,尝试恢复隐藏的文本或数据。
REST 与 GraphQL 响应格式对比器 - 结构差异可视化
输入同一数据源的两种 API 响应,并排展示结构差异,理解两种风格的数据组织。
Data URI生成器 - 文件/文本转内联URI
将上传的小文件或文本转换为可直接嵌入HTML/CSS的data: URI格式。
资源提示标签生成器 - preconnect/prefetch
输入第三方域名,生成<link rel='preconnect'>或dns-prefetch等资源提示标签。
多样式骨架屏生成器 - 卡片/列表/表格
选择卡片、列表或表格布局,生成对应的灰色闪烁骨架屏HTML/CSS代码。
Data URL解析查看器 - 预览/下载/解构
粘贴以data:开头的链接,自动判断MIME类型并预览内容,或提供下载按钮。
API 密钥泄露检测器 - 扫描代码中的硬编码密钥
粘贴代码片段,通过模式匹配查找可能泄露的 AWS、Google 等 API 密钥和令牌。
UD5工具箱