UD5工具箱
Web Worker 代码生成器 - 快速创建独立线程脚本
编写主线程和 Worker 内的逻辑模板，自动生成分离的 JS 文件代码，加速 Worker 开发。
暂无子应用
在左侧面板添加子应用，或使用预设模板快速开始。支持网格、分栏、堆叠和标签页四种布局模式。
常见问题与知识点
什么是微前端组合器？
微前端组合器是一个可视化工具，帮助开发者在单一页面中集成和预览多个独立子应用，支持网格、分栏、堆叠和标签页四种布局模式，是微前端架构原型验证的得力助手。
如何使用iframe嵌入子应用？
在左侧面板输入应用名称和URL后点击"添加"，子应用将以iframe形式嵌入预览区。注意：部分网站设置了X-Frame-Options头，可能拒绝iframe嵌入，建议使用允许跨域嵌入的URL。
支持哪些布局模式？
工具提供四种布局：网格布局自动排列、水平分栏左右并排、垂直堆叠上下排列、标签页选项卡切换，满足不同场景的集成需求。
微前端架构的优势是什么？
微前端允许团队独立开发、测试和部署各自的前端模块，支持技术栈无关、独立版本管理、增量升级，特别适合大型项目和多团队协作场景。
数据存储在哪里？
所有配置自动保存在浏览器的localStorage中，刷新页面不会丢失。您也可以导出为JSON文件进行备份，或在不同设备间迁移配置。
iframe有哪些安全限制？
iframe使用sandbox属性限制子应用权限，包括allow-scripts、allow-same-origin、allow-forms等。跨域iframe无法直接与父页面通信，确保隔离安全。
手风琴组件生成器 - 折叠面板HTML/CSS代码
在线生成可折叠的手风琴面板，自定义标题、内容与图标，支持纯CSS或简单JS切换。
HTML内联样式提取器 - 批量整理为独立CSS
提取HTML中内联style属性或嵌入式style标签，转变为独立CSS规则，辅助样式重构。
柯里化函数构造器 - 将多参数函数转为序列调用
输入一个多参数函数，自动生成柯里化版本并演示逐步传参调用的过程。
CSS缓动函数试玩场 - 所有预设一览
并列播放所有CSS内置缓动函数（ease, linear等）的动画效果，方便对比选择。
JSDoc 注释在线生成器 - 根据函数自动生成文档
输入 JavaScript 函数声明，自动生成符合规范的 JSDoc 注释模板。
Cypress 测试场景构建器 - 点选生成测试代码
可视化选择操作（访问、点击、断言等），自动生成 Cypress 测试代码。
悬停提示框生成器 - 纯CSS/JS气泡样式定制
选择触发位置、箭头方向与样式，生成轻量悬停提示框代码。
内存分页替换模拟 - FIFO/LRU/OPT动画
设定物理页框数，输入页引用串，动画展示不同页面置换算法的缺页率。
首屏大图模板生成器 - 文字叠加背景图
选择背景图片（或使用占位色），配置标题、副标题和按钮，生成Hero区域代码。
页面标题层级分析器 - h1~h6 结构检查
输入 HTML 或网址，提取所有标题标签，生成文档大纲树，检测跳跃和缺失。
HTML转JSX工具 - React组件代码转换
将普通HTML标记转换为符合JSX语法的代码，自动处理class→className、行内样式对象化等。
CSS Grid可视化调试器 - 叠加网格线
为页面上使用CSS Grid的元素显示网格线和名称，辅助布局开发和调试。
PHP数组转JSON - 粘贴print_r输出变JSON
粘贴PHP print_r或var_export输出，智能解析为有效的JSON。
Flexbox 高级演练场 - 所有属性可视化控制
通过滑块和开关调整 Flex 容器和子项的所有 CSS 属性，实时观察布局变化，理解弹性盒子。
JavaScript this 上下文测试器 - 不同调用方式下的指向
编写函数并选择调用方式（普通、方法、call、apply、箭头等），输出 this 的值。
Popover弹窗生成器 - 纯HTML声明式弹出层
配置内容和位置，生成使用最新HTML popover属性的轻量弹窗代码，无需JavaScript。
Web Share API 实践器 - 调用系统分享对话框
触发系统原生分享，支持分享文本、链接与文件，检查浏览器兼容性与支持级别。
内联样式提取合并工具 - 汇总 style 属性为类
提取 HTML 中所有内联 style，智能合并相同样式生成 class，并替换为类名以减小体积。
Bookmarklet构造器 - 将任意JS转为小书签
编写JavaScript代码，自动转换为可直接拖拽至书签栏的Bookmarklet链接。
Web Worker计算演示 - 后台斐波那契不卡顿
在主线程和Worker中分别计算大斐波那契数，对比界面的响应度。
多尺寸Favicon导出器 - 生成全平台图标包
上传一张原图，智能裁剪并输出从16x16到512x512的各尺寸ICO/PNG，适合网页与PWA。
JSON 结构树浏览器 - 交互展开与路径复制
粘贴JSON对象，生成可折叠的树形视图，点击节点复制其键值路径，方便调试。
CSS Grid 调试覆盖层 - 显示网格线与区域
在页面上叠加可拖拽的半透明网格线，辅助网格布局对齐。
结对编程随机搭档生成 - 排除近期组合
输入开发者名单，依规则随机组成搭档，尽量不重复近期配对。
视差层构建器 - 多层滚动的HTML模板
配置多个背景层或前景层，设定各层滚动速度因子，生成完整视差页面代码。
Cookie 同意条生成 - 纯代码无样式嵌入
勾选需要展示的选项（接受/拒绝/设置），生成纯净HTML/JS代码，自行套用样式。
顶级 await 演示 - 在模块顶层使用异步
在 ES 模块中直接使用顶层 await，观察执行顺序和依赖加载。
CSS Contain 属性演示 - 观察布局/样式/尺寸限制效果
应用 contain 的各种值（layout, paint, size），直观对比开启前后渲染和布局的变化。
SVG 精灵图合并工具 - 多个 SVG 图标合成一张
上传多个 SVG 文件，合并为一个 SVG sprite 并生成使用示例代码，减少 HTTP 请求。