图形学音视频跨平台【免费下载链接】libpagThe official rendering library for PAG (Portable Animated Graphics) files that renders After Effects animations natively across multiple platforms.项目地址https://gitcode.com/gh_mirrors/li/libpag点击查看免费下载导读PAGX Preview 是 libpag 仓库中面向 PAGXPortable Animated Graphics XML动画文件的一站式本地预览工具它以单条命令启动、自动打开浏览器通过文件监听与 SSE 推送实现保存即刷新的热重载并以常驻后台守护进程的方式让多个文件共享同一服务器。更关键的是它本身就是一个 MCPModel Context Protocol服务器可直接接入 CodeBuddy、Claude Desktop、VS Code Copilot 等 AI 编码助手让 AI 在对话中直接渲染、预览和调试.pagx文件。阅读本文后你将掌握从快速上手、CLI 参数调优、AI 助手 MCP 集成配置到从源码构建、本地打包发布验证的完整实战链路。项目定位与整体架构PAGX Preview 位于仓库的 playground/pagx-preview 目录正式形态是libpag/pagxCLI 的pagx preview子命令同时它也可以作为独立命令pagx-preview单独运行用于本地开发与维护者测试下文 从源码开发 一节即针对这种独立形态。从 package.json 可以看到它的技术底座expressHTTP 服务器与 SSE 推送、chokidar文件监听、modelcontextprotocol/sdkMCP 协议实现运行时要求 Node.js ≥ 16.7。其核心设计是“一个进程内同时承载三件事”渲染 PAGX 所需的pagx-viewerWASM 与pagx-player播放器产物静态资源服务负责会话管理、文件监听、字体解析与 SSE 热更新的 Express 服务器提供preview_pagx/reload_file/get_document三个工具Tool的 MCP 服务器stdio 或 Streamable HTTP 两种传输方式。三个部分共享同一份会话Session状态MCP 工具调用可以直接访问进程内的PreviewSession对象无需网络回环。功能特性一览原文档列出的核心特性如下每一项都能在源码中找到对应实现一键启动浏览器自动打开默认在 TTY 环境下启动后自动调用系统浏览器打开预览页cli.js 中按平台分别使用open/cmd /c start/xdg-open并校验 URL 必须为 http/https 协议。文件变更自动检测与实时重渲染SSE 推送每个会话由PreviewSession用 chokidar 监听入口文件80ms 防抖后向所有订阅者广播reload事件session.js。常驻后台守护进程多文件共享一个服务器pagx preview首次调用会以 detach 方式拉起后台子进程并写入锁文件~/.pagx/preview.lock后续调用通过锁文件探测存活服务器并复用lock.js。浏览器窗口拖放.pagx文件即可预览POST /session/drop将拖入的文件字节保存在内存中不落盘、不监听上限 100 个会话超出后按最旧优先淘汰index.js。作为 MCP 服务器供 AI 编码助手使用见下文“MCP Server 模式”一节。自动下载字体首次运行自动下载 NotoSansSC NotoColorEmoji 到~/.pagx/fonts/详见“字体解析”一节。环境要求Requirements运行 PAGX Preview 需要满足两个前提Node.js ≥ 16.7这也是 package.json 中engines字段声明的硬性要求。一个已构建的pagx-viewer多线程 mt 或单线程 st 变体均可渲染能力来自上游pagx-viewer的 WASM 产物。发布版 npm 包会随包附带预编译产物终端用户无需自行编译只有从源码开发时才需要先执行构建见下文。快速开始Quick Start作为libpag/pagxCLI 的全局子命令使用# 全局安装主 CLI包含 preview 子命令 npm install -g libpag/pagx # 预览一个文件 pagx preview /path/to/animation.pagx # 预览另一个文件复用已运行的服务器 pagx preview /path/to/other.pagx # 停止后台服务器 pagx preview stop这里展示的是“复用服务器”的典型工作流第二次调用不会新起进程而是通过锁文件发现并复用正在运行的服务POST /sessions为文件创建或复用会话会话 ID 由文件绝对路径的 SHA-1 摘要前 10 位决定同一文件永远映射到同一会话见 index.js。当复用会话且该会话已有活跃标签页时CLI 会向现有标签页发送focus事件尝试置顶但浏览器通常会拒绝非用户手势的自动聚焦此时 CLI 只打印 URL 提示cli.js。CLI 选项详解原文档的参数表完整继承如下并补充了源码层面的细节选项说明--port n绑定指定端口默认由系统分配即 0。CLI 会校验取值必须为 0–65535 的整数cli.js。固定端口是 MCP 配置稳定性的关键——Copilot 的 HTTP 配置需要可预期的端口--host addr绑定主机默认127.0.0.1。只允许A-Za-z0-9.-:字符集防止 shell 元字符注入到后续打开的浏览器 URL 中绑定0.0.0.0时对外展示的 URL 会改写为localhost--fonts dir覆盖字体目录。优先级最高见“字体解析”--no-open不自动打开浏览器。默认仅在 stdout 是真实 TTY 时才自动打开管道输出、IDE Agent、CI 场景下 CLI 会自动改为只输出 URL--foreground前台运行不分离为守护进程适合调试CtrlC 直接控制服务器生命周期--mcp以 MCP stdio 服务器模式运行详见 MCP 一节。该模式下无需文件参数文件通过工具调用惰性打开--log打印服务器日志~/.pagx/preview.log后退出stop停止后台服务器。向锁文件记录的 PID 发送 SIGTERM并最多等待 3 秒确认锁文件被清除若 PID 已不存在则清理陈旧锁daemon.js另有源码中存在的两个内部/扩展参数--json单行 JSON 输出 URL、PID、日志路径等便于管道给jq或JSON.parse同时隐含--no-open与--__server仅供内部 re-exec 守护进程使用不对外暴露。CLI 解析逻辑位于 cli.js非法参数会打印用法并退出码 2。MCP Server 模式pagx preview --mcp让 AI 编码助手可以直接在对话中预览.pagx文件。工作原理启动--mcp后进程在stdin/stdout 上以 JSON-RPC 协议与 MCP 客户端通信同时在进程内自动拉起本地 HTTP 服务器承担 WASM 渲染。用户不需要手动启动任何服务——MCP 客户端负责进程生命周期客户端断开 stdin 时传输关闭进程随即整体拆除daemon.js。值得注意的实现细节stdout 被 MCP 帧独占因此该模式下所有console.log被重定向到 stderr避免日志污染协议流与守护进程模式不同MCP 模式不注册空闲关闭回调——即使没有浏览器标签页打开服务器也必须保持存活否则 widget/webview 会访问到已关闭的端口会话生命周期由客户端通过preview_pagx返回的 sessionId完全掌控不会因标签页关闭而被回收。暴露的工具Tools工具说明preview_pagx加载文件并返回会话 URL供在 IDE webview 面板或浏览器中打开。工具返回的结构化数据包含sessionId、file、fileName、url、width、height、duration与reused标志reload_file强制从磁盘重新加载文件文件变更会自动重载此工具是手动触发。向会话广播reload事件get_document返回文档信息尺寸、时长。数据来自客户端加载成功后上传的文档摘要缓存若连续 3 次查询不到摘要则判定宿主未渲染内联 widget返回fallbackToWebview: true并附上可在浏览器打开的 URLtools.js工具定义位于 tools.jsMCP 服务器的构建与挂载逻辑位于 mcp/server.js。所有预览统一走preview_pagx它返回http://127.0.0.1:port/session/id/形式的会话 URL。由于内联 MCP Apps widget 在桌面宿主上渲染不可靠见“已知兼容性问题”内联 widget 工具当前不对外暴露代码中仍保留ui://pagx-preview/main这一 widget 资源readResource实现完整存在于 tools.js待宿主支持成熟后可重新启用。平台部署配置注意MCP 配置在开发/测试形态与发布形态之间存在差异——开发形态使用独立pagx-preview命令发布形态使用libpag/pagx的pagx preview子命令详见下文“本地打包测试”第 4 步。CodeBuddy IDE写入~/.codebuddy/mcp.json{ mcpServers: { pagx-preview: { command: pagx, args: [preview, --mcp] } } }Claude DesktopmacOS 写入~/Library/Application Support/Claude/claude_desktop_config.jsonWindows 写入%APPDATA%\Claude\claude_desktop_config.json{ mcpServers: { pagx-preview: { command: pagx, args: [preview, --mcp] } } }VS Code GitHub Copilot在项目根目录创建.vscode/mcp.json{ servers: { pagx-preview: { type: http, url: http://127.0.0.1:port/mcp } } }注意Copilot 使用 HTTP 传输需要先手动启动服务器并固定端口pagx preview --port port file。HTTP 形态的端点实现是POST /mcpStreamable HTTP 传输源码位于 mcp/server.js每次请求创建独立的 Server Transport 实例MCP SDK 的Server.connect()绑定单个传输无法跨请求复用GET/DELETE /mcp返回 JSON-RPC “Method not allowed” 以让探测旧版 GET-SSE 通道的客户端优雅退出。已知兼容性问题内联 widget 已在官方 ext-apps basic-host 参考宿主中验证通过但桌面宿主对内联 MCP Apps 的支持参差不齐宿主内联 widget 状态Claude Desktopwidget iframe 可能不被宿主挂载已知宿主侧缺陷CodeBuddy IDE尚不支持 MCP Apps 内联 widgetVS Code Copilot在 Simple Browser编辑器标签页中打开而非内联 widget由于主流宿主上内联渲染不可靠内联 widget 工具暂不暴露预览统一走preview_pagx在 IDE webview 面板/浏览器打开。所有场景下会话 URLhttp://127.0.0.1:port/session/id/都能提供带热重载的完整预览能力。Development从源码开发本节命令针对独立pagx-preview命令通过npm link或node src/cli.js运行即该包在隔离环境下的开发与测试方式。终端用户通过libpag/pagxCLI 以pagx preview形式使用同一工具。首次搭建cd playground/pagx-preview npm install npm run build # 构建 pagx-viewer单线程 pagx-player 并暂存产物npm run build会串联全部步骤先构建上游pagx-viewer单线程st变体与pagx-player再把产物复制进static/。构建脚本为 scripts/prebuild.js其执行逻辑是检测../pagx-viewer/lib下可用的 WASM 变体优先多线程、复制 viewer 产物到wasm/viewer/并写入info.json服务器据此决定是否下发 COOP/COEP 头客户端据此决定动态导入路径同时复制 pagx-player 的 ESM bundle 到wasm/player/。所有生成产物统一放在被 gitignore 的wasm/目录保持static/源码目录干净。构建命令矩阵命令Viewer 变体适用场景npm run build单线程st默认。处处可用——MCP widget和浏览器预览均支持npm run build:release单线程strelease同上优化构建npm run build:mt多线程mt仅浏览器预览渲染更快npm run build:release:mt多线程mtrelease同上优化构建为什么默认选单线程st变体MCP widget 运行在沙箱 iframe 中没有跨源隔离cross-origin isolation而多线程构建依赖的SharedArrayBuffer只有在跨源隔离上下文中才可用。mt变体渲染更快但仅适用于普通浏览器预览pagx-preview file.pagx模式下服务器会下发所需的 COOP/COEP 头在 MCP 宿主内 widget 会回退到打开浏览器 URL。多线程模式下服务器通过 index.js 中的中间件下发Cross-Origin-Opener-Policy: same-origin与Cross-Origin-Embedder-Policy: require-corp。如果上游产物已构建好或克隆的仓库自带产物可只运行npm run prebuild跳过重建仅做复制。prebuild自动完成四件事检测 viewer 构建变体MT/ST并复制 wasm glue 到static/viewer/复制 pagx-player ESM bundle 到static/player/复制 ext-apps SDK bundle 到static/ext/用 esbuild 将 MCP widget 打包到static/mcp-widget.bundle.js。注当前仓库源码中prebuild.js的输出目录为 gitignored 的wasm/而非static/服务器分别以/static与/wasm两个路由提供服务这是源码较新版本与 README 描述的历史差异功能定位一致。从源码运行node src/cli.js /path/to/file.pagx # 后台运行 node src/cli.js --foreground /path/to/file.pagx # 前台运行 node src/cli.js --mcp # MCP 模式CLI 入口 src/cli.js 的完整启动决策链是解析参数 → 若是--mcp直接进入 stdio MCP 服务 → 若是stop/--log执行对应命令 → 校验文件存在 → 探测并尝试复用存活服务器probeLiveServer依次检查锁文件、PID 存活、/health端点见 lock.js→ 否则前台运行或 spawn 分离守护进程。守护进程通过--__server标志 re-exec 自身父进程以 50ms 间隔轮询锁文件最长 3 秒子进程成功绑定端口并写入锁后父进程立即交还 shell 提示符daemon.js。用全局链接测试npm link pagx-preview /path/to/file.pagx npm unlink -g libpag/pagx-preview终端用户如何获取该包终端用户无需构建或打包任何东西。发布后编译产物static/viewer/*.wasm、static/player/*.js等随 npm tarball 一起发布普通安装即可获得开箱即用的命令与libpag/pagxCLI 完全一致npm install -g libpag/pagx-preview # 下载预构建产物无需编译构建npm run build是维护者在发布前重新生成产物的步骤。下面的本地 tarball 测试仅用于模拟真实安装流程。本地打包与安装验证完整复现用户在npm install中获得的体验使用本地 tarball# 1. 构建产物release并打包 tarball cd playground/pagx-preview npm run build:release npm pack --dry-run # 检查将要发布的文件列表 npm pack # 生成 libpag-pagx-preview-version.tgz # 2. 全局安装 tarball 模拟已发布状态 npm unlink -g libpag/pagx-preview # 先移除已有开发链接 npm install -g ./libpag-pagx-preview-version.tgz # 3. 验证 CLI pagx-preview --help pagx-preview /path/to/file.pagx # 打开浏览器预览 # 4. 验证 MCP 服务器 # 注意本节针对**独立** pagx-preview 命令其 MCP json 与终端用户已发布形态不同 # - 独立开发/测试{ command: pagx-preview, args: [--mcp] } # - 终端用户libpag/pagx{ command: pagx, args: [preview, --mcp] }见上文平台部署配置 # 将 MCP 客户端CodeBuddy / Claude Desktop指向已安装的独立命令 # { mcpServers: { pagx-preview: { command: pagx-preview, args: [--mcp] } } } # 然后让助手预览 .pagx 文件。或用以下命令对 stdio 启动做冒烟测试 pagx-preview --mcp /dev/null # 应正常启动、stdout 无输出并保持等待 # 5. 清理 npm uninstall -g libpag/pagx-preview rm libpag-pagx-preview-version.tgz rm -rf ~/.pagx # 清除缓存字体、日志与进程锁回到全新用户状态npm pack --dry-run对应发布前检查脚本 scripts/check-artifacts.jspackage.json中的prepack钩子会在打包前自动执行prebuild --build --release check-artifactsprepublishOnly再次执行产物校验。tarball 中files字段包含src/、static/、wasm/、scripts/check-artifacts.js与README.md。发布到 npm分发说明该工具作为pagx preview子命令随libpag/pagx一起分发终端用户无需单独安装本包。目录结构解读playground/pagx-preview/ ├── src/ │ ├── cli.js # CLI 入口参数解析也负责浏览器打开、会话复用、JSON 输出 │ ├── daemon.js # 后台进程管理detach 子进程、锁轮询、SIGTERM 停止、stdio MCP 启动 │ ├── server/ │ │ ├── index.js # Express HTTP 服务器SSE、静态资源、MCP 挂载、会话/拖放/字体/文档接口 │ │ ├── session.js # 文件监听会话chokidar含资源引用防目录穿越与 80ms 防抖 │ │ ├── fonts.js # 字体目录解析四级优先级与字体清单 │ │ ├── font-cache.js # 惰性字体下载并行、去重、重定向跟随、最小有效体积校验 │ │ └── lock.js # 进程锁锁文件读写、PID 存活探测、/health 健康检查 │ └── mcp/ │ ├── server.js # MCP 服务器构建stdio Streamable HTTP 双传输 │ └── tools.js # MCP 工具与资源定义preview_pagx / reload_file / get_document ├── static/ │ ├── index.js / index.html / index.css # 浏览器端预览客户端 │ ├── viewer/ # pagx-viewer WASM glue由 prebuild 生成 │ ├── player/ # pagx-player ESM bundle由 prebuild 生成 │ ├── ext/ # ext-apps SDK bundle由 prebuild 生成 │ ├── icons/ # 播放控制图标play / pause / next / previous │ ├── mcp-widget.js # MCP Apps widget 源码 │ ├── mcp-widget.html # MCP Apps widget HTML 壳 │ └── mcp-widget.bundle.js # 打包后的 widget由 prebuild 生成 ├── scripts/ │ ├── prebuild.js # 产物复制 bundle 构建 info.json 变体探测 │ └── check-artifacts.js # 发布前产物检查 └── package.json当前仓库的static/目录实际仅包含index.js / index.html / index.css / mcp-widget.html / mcp-widget.js与icons/viewer/、player/、ext/等目录由构建步骤生成到 gitignored 的wasm/目录服务器以/wasm路由提供与 README 中“复制到 static/”的描述存在版本差异但目录职责划分一致。字体解析与自动下载首次运行时NotoSansSC-Regular.otf 与 NotoColorEmoji.ttf 会自动下载到~/.pagx/fonts/。字体来源的完整优先级与源码 fonts.js 一致--fonts dir参数最高优先级PAGX_FONTS_DIR环境变量~/.pagx/fonts/下载缓存仅当其中已存在任一预期字体时采用libpag 仓库的resources/font/从源码树运行时自动向上探测最多 6 层目录设置PAGX_FONTS_NO_AUTO_DOWNLOAD1可禁用自动下载适用于离线/CI 环境。源码层面的关键细节字体分两个角色primaryNotoSansSC-Regular.otf与emojiNotoColorEmoji.ttf按角色依次匹配磁盘上第一个存在的候选文件下载源为https://pag.qq.com/wx_pagx_demo/fonts/下的两个文件font-cache.js支持最多跟随 3 次重定向、30 秒超时、并发去重同一字体同时只发起一次下载任何小于 100KB 的文件视为下载失败真实字体约 8–10MB下次启动会重试惰性下载是“发射后不管”的服务器响应性不等待下载下载完成后通过 SSE 向所有会话广播fonts-ready事件客户端收到后重新拉取/fonts/list注册字体/fonts/list还会返回downloading标志让客户端礼貌重试。若没有任何字体来源且下载被禁用文本字形会渲染为空白服务器会提示使用--fonts或PAGX_FONTS_DIR。安全性设计源码补充虽然 README 未单列但服务器内置了多层本地安全防护值得了解DNS 重绑定防护Host 头白名单仅允许127.0.0.1、localhost、[::1]、::1其他主机名直接 403阻止恶意网页将自身域名重绑定到 127.0.0.1 后访问本服务index.js跨站写入防护所有会修改磁盘或会话状态的端点检查Sec-Fetch-Site与Origin头仅接受 same-origin浏览器预览页与 noneNode CLI请求扩展名白名单POST /sessions只接受.pagx文件压缩任意文件读取面资源路径防穿越PreviewSession.resolveResource()拒绝任何逃逸出入口文件目录的相对路径session.js保存端点受限PUT /session/:id/pagx固定写入会话的入口文件路径绝不从 URL/请求体取路径拖放会话无磁盘文件返回 400CORS 策略对本地预览场景采用宽松的Access-Control-Allow-Origin: *跨源沙箱 iframe 中的 MCP widget 需要这是本地服务可接受的权衡。会话生命周期与空闲回收服务器对会话生命周期做了精细管理与 README 中“持久后台守护、多文件共享”的设计呼应每个文件会话独立计时某文件最后一个标签页关闭后经过 30 秒宽限期回收该会话仅作废该文件的 URL不影响其他仍打开的文件宽限期内重连可保活会话与 URL整个服务器在所有会话的 SSE 订阅数归零后进入空闲计时30 秒后调用onIdle回调——守护进程模式下触发优雅关闭所有标签页关闭即退出服务器优雅关闭带 3 秒强制退出兜底SIGINT/SIGTERM/空闲触发共用并主动终结 SSE 流、销毁残留 socket避免 keep-alive 连接导致server.close()永远挂起index.js、daemon.js。LicenseApache-2.0。整个 libpag 仓库含playground/pagx-preview均在该许可证下开源代码头部均带 Tencent 版权声明。赞分享图形学音视频跨平台【免费下载链接】libpagThe official rendering library for PAG (Portable Animated Graphics) files that renders After Effects animations natively across multiple platforms.项目地址https://gitcode.com/gh_mirrors/li/libpag点击查看免费下载相关推荐libpag PAGX Preview本地实时预览服务器与 MCP 调试工具完全指南libpag PAGX Preview本地实时预览服务器与 MCP 调试工具完全指南 PAGX Preview 是 libpag 仓库 playground/图形学音视频跨平台Aptos Core 基准测试工作负载Benchmark Workload添加指南从 Move 包到交易生成器入口Aptos Core 基准测试工作负载Benchmark Workload添加指南从 Move 包到交易生成器入口 导读 本文基于 Aptos 仓库中的图形学音视频跨平台Hugo Section Pagesection 页面完全指南从概念、模板查找到源码级实现原理Hugo Section Pagesection 页面完全指南从概念、模板查找到源码级实现原理 导读 Section Pagesection 页面是图形学音视频跨平台上一篇Claude Security scan-verifier 代理详解三透镜对抗验证如何以证伪标准裁定漏洞发现下一篇AMCT 量化模型 Deploy 交付文档撰写指南基于 Deploy Quantization Specification 模板的 deploy_quantization.md 编写规范创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考