[{"data":1,"prerenderedAt":1591},["ShallowReactive",2],{"navigation":3,"\u002Fguides\u002F4k-rendering":686,"\u002Fguides\u002F4k-rendering-surround":1586},[4,31,57,147,168,198,652],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":30},"快速入门","i-lucide-rocket","\u002Fgetting-started","01.getting-started",[10,14,18,22,26],{"title":11,"path":12,"stem":13},"简介","\u002Fgetting-started\u002Fintroduction","01.getting-started\u002F01.introduction",{"title":15,"path":16,"stem":17},"快速开始","\u002Fgetting-started\u002Fquickstart","01.getting-started\u002F02.quickstart",{"title":19,"path":20,"stem":21},"展示作品","\u002Fgetting-started\u002Fshowcase","01.getting-started\u002F03.showcase",{"title":23,"path":24,"stem":25},"示例","\u002Fgetting-started\u002Fexamples","01.getting-started\u002F04.examples",{"title":27,"path":28,"stem":29},"发布视频","\u002Fgetting-started\u002Flaunch-videos","01.getting-started\u002F05.launch-videos",false,{"title":32,"icon":33,"path":34,"stem":35,"children":36,"page":30},"核心概念","i-lucide-lightbulb","\u002Fconcepts","02.concepts",[37,41,45,49,53],{"title":38,"path":39,"stem":40},"合成","\u002Fconcepts\u002Fcompositions","02.concepts\u002F01.compositions",{"title":42,"path":43,"stem":44},"数据属性","\u002Fconcepts\u002Fdata-attributes","02.concepts\u002F02.data-attributes",{"title":46,"path":47,"stem":48},"变量","\u002Fconcepts\u002Fvariables","02.concepts\u002F03.variables",{"title":50,"path":51,"stem":52},"帧适配器","\u002Fconcepts\u002Fframe-adapters","02.concepts\u002F04.frame-adapters",{"title":54,"path":55,"stem":56},"确定性渲染","\u002Fconcepts\u002Fdeterminism","02.concepts\u002F05.determinism",{"title":58,"icon":59,"path":60,"stem":61,"children":62,"page":30},"使用指南","i-lucide-compass","\u002Fguides","03.guides",[63,67,71,75,79,83,87,91,95,99,103,107,111,115,119,123,127,131,135,139,143],{"title":64,"path":65,"stem":66},"工作流水线","\u002Fguides\u002Fpipeline","03.guides\u002F01.pipeline",{"title":68,"path":69,"stem":70},"HTML-in-Canvas","\u002Fguides\u002Fhtml-in-canvas","03.guides\u002F02.html-in-canvas",{"title":72,"path":73,"stem":74},"网站转视频","\u002Fguides\u002Fwebsite-to-video","03.guides\u002F03.website-to-video",{"title":76,"path":77,"stem":78},"Google Antigravity","\u002Fguides\u002Fantigravity","03.guides\u002F04.antigravity",{"title":80,"path":81,"stem":82},"GitHub Copilot CLI","\u002Fguides\u002Fcopilot-cli","03.guides\u002F05.copilot-cli",{"title":84,"path":85,"stem":86},"Claude Design","\u002Fguides\u002Fclaude-design","03.guides\u002F06.claude-design",{"title":88,"path":89,"stem":90},"Open Design","\u002Fguides\u002Fopen-design","03.guides\u002F07.open-design",{"title":92,"path":93,"stem":94},"提示词指南","\u002Fguides\u002Fprompting","03.guides\u002F08.prompting",{"title":96,"path":97,"stem":98},"Hyperframes vs Remotion","\u002Fguides\u002Fhyperframes-vs-remotion","03.guides\u002F09.hyperframes-vs-remotion",{"title":100,"path":101,"stem":102},"GSAP 动画","\u002Fguides\u002Fgsap-animation","03.guides\u002F10.gsap-animation",{"title":104,"path":105,"stem":106},"渲染","\u002Fguides\u002Frendering","03.guides\u002F11.rendering",{"title":108,"path":109,"stem":110},"去除背景（透明视频）","\u002Fguides\u002Fremove-background","03.guides\u002F12.remove-background",{"title":112,"path":113,"stem":114},"HDR 渲染","\u002Fguides\u002Fhdr","03.guides\u002F13.hdr",{"title":116,"path":117,"stem":118},"4K 渲染","\u002Fguides\u002F4k-rendering","03.guides\u002F14.4k-rendering",{"title":120,"path":121,"stem":122},"性能","\u002Fguides\u002Fperformance","03.guides\u002F15.performance",{"title":124,"path":125,"stem":126},"时间轴编辑","\u002Fguides\u002Ftimeline-editing","03.guides\u002F16.timeline-editing",{"title":128,"path":129,"stem":130},"视频编辑者速查表","\u002Fguides\u002Fvideo-editor-cheatsheet","03.guides\u002F17.video-editor-cheatsheet",{"title":132,"path":133,"stem":134},"常见错误","\u002Fguides\u002Fcommon-mistakes","03.guides\u002F18.common-mistakes",{"title":136,"path":137,"stem":138},"故障排除","\u002Fguides\u002Ftroubleshooting","03.guides\u002F19.troubleshooting",{"title":140,"path":141,"stem":142},"反馈收集","\u002Fguides\u002Ffeedback","03.guides\u002F20.feedback",{"title":144,"path":145,"stem":146},"HyperFrames MCP","\u002Fguides\u002Fmcp","03.guides\u002F21.mcp",{"title":148,"icon":149,"path":150,"stem":151,"children":152,"page":30},"部署","i-lucide-cloud","\u002Fdeploy","04.deploy",[153,156,160,164],{"title":148,"path":154,"stem":155},"\u002Fdeploy\u002Fdeploy","04.deploy\u002F01.deploy",{"title":157,"path":158,"stem":159},"AWS Lambda","\u002Fdeploy\u002Faws-lambda","04.deploy\u002F02.aws-lambda",{"title":161,"path":162,"stem":163},"Lambda 上的模板","\u002Fdeploy\u002Ftemplates-on-lambda","04.deploy\u002F03.templates-on-lambda",{"title":165,"path":166,"stem":167},"迁移到 HyperFrames Lambda","\u002Fdeploy\u002Fmigrating-to-hyperframes-lambda","04.deploy\u002F04.migrating-to-hyperframes-lambda",{"title":169,"icon":170,"path":171,"stem":172,"children":173,"page":30},"包","i-lucide-package","\u002Fpackages","05.packages",[174,178,182,186,190,194],{"title":175,"path":176,"stem":177},"@hyperframes\u002Fcore","\u002Fpackages\u002Fcore","05.packages\u002F01.core",{"title":179,"path":180,"stem":181},"@hyperframes\u002Fengine","\u002Fpackages\u002Fengine","05.packages\u002F02.engine",{"title":183,"path":184,"stem":185},"@hyperframes\u002Fplayer","\u002Fpackages\u002Fplayer","05.packages\u002F03.player",{"title":187,"path":188,"stem":189},"@hyperframes\u002Fproducer","\u002Fpackages\u002Fproducer","05.packages\u002F04.producer",{"title":191,"path":192,"stem":193},"@hyperframes\u002Fstudio","\u002Fpackages\u002Fstudio","05.packages\u002F05.studio",{"title":195,"path":196,"stem":197},"CLI","\u002Fpackages\u002Fcli","05.packages\u002F06.cli",{"title":199,"icon":200,"path":201,"stem":202,"children":203,"page":30},"组件目录","i-lucide-layout-grid","\u002Fcatalog","06.catalog",[204,270,324,358,420,478,512,546,584,598],{"title":205,"icon":206,"path":207,"stem":208,"children":209,"page":30},"字幕","i-lucide-captions","\u002Fcatalog\u002Fcaption","06.catalog\u002F01.caption",[210,214,218,222,226,230,234,238,242,246,250,254,258,262,266],{"title":211,"path":212,"stem":213},"裁剪擦除","\u002Fcatalog\u002Fcaption\u002Fcaption-clip-wipe","06.catalog\u002F01.caption\u002F01.caption-clip-wipe",{"title":215,"path":216,"stem":217},"编辑强调","\u002Fcatalog\u002Fcaption\u002Fcaption-editorial-emphasis","06.catalog\u002F01.caption\u002F02.caption-editorial-emphasis",{"title":219,"path":220,"stem":221},"Emoji 弹出","\u002Fcatalog\u002Fcaption\u002Fcaption-emoji-pop","06.catalog\u002F01.caption\u002F03.caption-emoji-pop",{"title":223,"path":224,"stem":225},"故障 RGB","\u002Fcatalog\u002Fcaption\u002Fcaption-glitch-rgb","06.catalog\u002F01.caption\u002F04.caption-glitch-rgb",{"title":227,"path":228,"stem":229},"渐变填充","\u002Fcatalog\u002Fcaption\u002Fcaption-gradient-fill","06.catalog\u002F01.caption\u002F05.caption-gradient-fill",{"title":231,"path":232,"stem":233},"高亮","\u002Fcatalog\u002Fcaption\u002Fcaption-highlight","06.catalog\u002F01.caption\u002F06.caption-highlight",{"title":235,"path":236,"stem":237},"动感冲击","\u002Fcatalog\u002Fcaption\u002Fcaption-kinetic-slam","06.catalog\u002F01.caption\u002F07.caption-kinetic-slam",{"title":239,"path":240,"stem":241},"矩阵解码","\u002Fcatalog\u002Fcaption\u002Fcaption-matrix-decode","06.catalog\u002F01.caption\u002F08.caption-matrix-decode",{"title":243,"path":244,"stem":245},"霓虹强调","\u002Fcatalog\u002Fcaption\u002Fcaption-neon-accent","06.catalog\u002F01.caption\u002F09.caption-neon-accent",{"title":247,"path":248,"stem":249},"霓虹发光","\u002Fcatalog\u002Fcaption\u002Fcaption-neon-glow","06.catalog\u002F01.caption\u002F10.caption-neon-glow",{"title":251,"path":252,"stem":253},"视差图层","\u002Fcatalog\u002Fcaption\u002Fcaption-parallax-layers","06.catalog\u002F01.caption\u002F11.caption-parallax-layers",{"title":255,"path":256,"stem":257},"粒子爆发","\u002Fcatalog\u002Fcaption\u002Fcaption-particle-burst","06.catalog\u002F01.caption\u002F12.caption-particle-burst",{"title":259,"path":260,"stem":261},"胶囊卡拉OK","\u002Fcatalog\u002Fcaption\u002Fcaption-pill-karaoke","06.catalog\u002F01.caption\u002F13.caption-pill-karaoke",{"title":263,"path":264,"stem":265},"纹理","\u002Fcatalog\u002Fcaption\u002Fcaption-texture","06.catalog\u002F01.caption\u002F14.caption-texture",{"title":267,"path":268,"stem":269},"字重切换","\u002Fcatalog\u002Fcaption\u002Fcaption-weight-shift","06.catalog\u002F01.caption\u002F15.caption-weight-shift",{"title":271,"icon":272,"path":273,"stem":274,"children":275,"page":30},"HTML 画布","i-lucide-layout-dashboard","\u002Fcatalog\u002Fhtml-canvas","06.catalog\u002F02.html-canvas",[276,280,284,288,292,296,300,304,308,312,316,320],{"title":277,"path":278,"stem":279},"iOS 26 Liquid Glass 主屏幕","\u002Fcatalog\u002Fhtml-canvas\u002Fios26-liquid-glass","06.catalog\u002F02.html-canvas\u002F01.ios26-liquid-glass",{"title":281,"path":282,"stem":283},"Liquid Glass 右键菜单","\u002Fcatalog\u002Fhtml-canvas\u002Fliquid-glass-context-menu","06.catalog\u002F02.html-canvas\u002F02.liquid-glass-context-menu",{"title":285,"path":286,"stem":287},"Liquid Glass 媒体控制","\u002Fcatalog\u002Fhtml-canvas\u002Fliquid-glass-media-controls","06.catalog\u002F02.html-canvas\u002F03.liquid-glass-media-controls",{"title":289,"path":290,"stem":291},"Liquid Glass 通知","\u002Fcatalog\u002Fhtml-canvas\u002Fliquid-glass-notification","06.catalog\u002F02.html-canvas\u002F04.liquid-glass-notification",{"title":293,"path":294,"stem":295},"Liquid Glass 小组件","\u002Fcatalog\u002Fhtml-canvas\u002Fliquid-glass-widgets","06.catalog\u002F02.html-canvas\u002F05.liquid-glass-widgets",{"title":297,"path":298,"stem":299},"macOS Tahoe Liquid Glass 桌面","\u002Fcatalog\u002Fhtml-canvas\u002Fmacos-tahoe-liquid-glass","06.catalog\u002F02.html-canvas\u002F06.macos-tahoe-liquid-glass",{"title":301,"path":302,"stem":303},"iPhone & MacBook 3D 展示","\u002Fcatalog\u002Fhtml-canvas\u002Fvfx-iphone-device","06.catalog\u002F02.html-canvas\u002F07.vfx-iphone-device",{"title":305,"path":306,"stem":307},"液态背景","\u002Fcatalog\u002Fhtml-canvas\u002Fvfx-liquid-background","06.catalog\u002F02.html-canvas\u002F08.vfx-liquid-background",{"title":309,"path":310,"stem":311},"磁力效果","\u002Fcatalog\u002Fhtml-canvas\u002Fvfx-magnetic","06.catalog\u002F02.html-canvas\u002F09.vfx-magnetic",{"title":313,"path":314,"stem":315},"传送门","\u002Fcatalog\u002Fhtml-canvas\u002Fvfx-portal","06.catalog\u002F02.html-canvas\u002F10.vfx-portal",{"title":317,"path":318,"stem":319},"碎裂效果","\u002Fcatalog\u002Fhtml-canvas\u002Fvfx-shatter","06.catalog\u002F02.html-canvas\u002F11.vfx-shatter",{"title":321,"path":322,"stem":323},"VFX 文字光标","\u002Fcatalog\u002Fhtml-canvas\u002Fvfx-text-cursor","06.catalog\u002F02.html-canvas\u002F12.vfx-text-cursor",{"title":325,"icon":326,"path":327,"stem":328,"children":329,"page":30},"社交叠加层","i-lucide-share-2","\u002Fcatalog\u002Fsocial-overlays","06.catalog\u002F03.social-overlays",[330,334,338,342,346,350,354],{"title":331,"path":332,"stem":333},"Instagram 关注","\u002Fcatalog\u002Fsocial-overlays\u002Finstagram-follow","06.catalog\u002F03.social-overlays\u002F01.instagram-follow",{"title":335,"path":336,"stem":337},"macOS 通知","\u002Fcatalog\u002Fsocial-overlays\u002Fmacos-notification","06.catalog\u002F03.social-overlays\u002F02.macos-notification",{"title":339,"path":340,"stem":341},"Reddit 帖子卡片","\u002Fcatalog\u002Fsocial-overlays\u002Freddit-post","06.catalog\u002F03.social-overlays\u002F03.reddit-post",{"title":343,"path":344,"stem":345},"Spotify 正在播放","\u002Fcatalog\u002Fsocial-overlays\u002Fspotify-card","06.catalog\u002F03.social-overlays\u002F04.spotify-card",{"title":347,"path":348,"stem":349},"TikTok 关注","\u002Fcatalog\u002Fsocial-overlays\u002Ftiktok-follow","06.catalog\u002F03.social-overlays\u002F05.tiktok-follow",{"title":351,"path":352,"stem":353},"X 帖子卡片","\u002Fcatalog\u002Fsocial-overlays\u002Fx-post","06.catalog\u002F03.social-overlays\u002F06.x-post",{"title":355,"path":356,"stem":357},"YouTube 下方三分之一","\u002Fcatalog\u002Fsocial-overlays\u002Fyt-lower-third","06.catalog\u002F03.social-overlays\u002F07.yt-lower-third",{"title":359,"icon":360,"path":361,"stem":362,"children":363,"page":30},"着色器过渡","i-lucide-wand-2","\u002Fcatalog\u002Fshader-transitions","06.catalog\u002F04.shader-transitions",[364,368,372,376,380,384,388,392,396,400,404,408,412,416],{"title":365,"path":366,"stem":367},"色散径向分裂","\u002Fcatalog\u002Fshader-transitions\u002Fchromatic-radial-split","06.catalog\u002F04.shader-transitions\u002F01.chromatic-radial-split",{"title":369,"path":370,"stem":371},"电影感变焦","\u002Fcatalog\u002Fshader-transitions\u002Fcinematic-zoom","06.catalog\u002F04.shader-transitions\u002F02.cinematic-zoom",{"title":373,"path":374,"stem":375},"交叉扭曲变形","\u002Fcatalog\u002Fshader-transitions\u002Fcross-warp-morph","06.catalog\u002F04.shader-transitions\u002F03.cross-warp-morph",{"title":377,"path":378,"stem":379},"域扭曲溶解","\u002Fcatalog\u002Fshader-transitions\u002Fdomain-warp-dissolve","06.catalog\u002F04.shader-transitions\u002F04.domain-warp-dissolve",{"title":381,"path":382,"stem":383},"白色闪光过渡","\u002Fcatalog\u002Fshader-transitions\u002Fflash-through-white","06.catalog\u002F04.shader-transitions\u002F05.flash-through-white",{"title":385,"path":386,"stem":387},"故障效果","\u002Fcatalog\u002Fshader-transitions\u002Fglitch","06.catalog\u002F04.shader-transitions\u002F06.glitch",{"title":389,"path":390,"stem":391},"引力透镜","\u002Fcatalog\u002Fshader-transitions\u002Fgravitational-lens","06.catalog\u002F04.shader-transitions\u002F07.gravitational-lens",{"title":393,"path":394,"stem":395},"光线泄漏","\u002Fcatalog\u002Fshader-transitions\u002Flight-leak","06.catalog\u002F04.shader-transitions\u002F08.light-leak",{"title":397,"path":398,"stem":399},"褶皱燃烧","\u002Fcatalog\u002Fshader-transitions\u002Fridged-burn","06.catalog\u002F04.shader-transitions\u002F09.ridged-burn",{"title":401,"path":402,"stem":403},"涟漪波纹","\u002Fcatalog\u002Fshader-transitions\u002Fripple-waves","06.catalog\u002F04.shader-transitions\u002F10.ripple-waves",{"title":405,"path":406,"stem":407},"SDF 光圈","\u002Fcatalog\u002Fshader-transitions\u002Fsdf-iris","06.catalog\u002F04.shader-transitions\u002F11.sdf-iris",{"title":409,"path":410,"stem":411},"漩涡涡流","\u002Fcatalog\u002Fshader-transitions\u002Fswirl-vortex","06.catalog\u002F04.shader-transitions\u002F12.swirl-vortex",{"title":413,"path":414,"stem":415},"热浪扭曲","\u002Fcatalog\u002Fshader-transitions\u002Fthermal-distortion","06.catalog\u002F04.shader-transitions\u002F13.thermal-distortion",{"title":417,"path":418,"stem":419},"快速摇摄","\u002Fcatalog\u002Fshader-transitions\u002Fwhip-pan","06.catalog\u002F04.shader-transitions\u002F14.whip-pan",{"title":421,"icon":422,"path":423,"stem":424,"children":425,"page":30},"CSS 过渡","i-lucide-repeat","\u002Fcatalog\u002Fcss-transitions","06.catalog\u002F05.css-transitions",[426,430,434,438,442,446,450,454,458,462,466,470,474],{"title":427,"path":428,"stem":429},"3D 过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-3d","06.catalog\u002F05.css-transitions\u002F01.transitions-3d",{"title":431,"path":432,"stem":433},"模糊过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-blur","06.catalog\u002F05.css-transitions\u002F02.transitions-blur",{"title":435,"path":436,"stem":437},"覆盖过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-cover","06.catalog\u002F05.css-transitions\u002F03.transitions-cover",{"title":439,"path":440,"stem":441},"破碎过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-destruction","06.catalog\u002F05.css-transitions\u002F04.transitions-destruction",{"title":443,"path":444,"stem":445},"溶解过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-dissolve","06.catalog\u002F05.css-transitions\u002F05.transitions-dissolve",{"title":447,"path":448,"stem":449},"扭曲过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-distortion","06.catalog\u002F05.css-transitions\u002F06.transitions-distortion",{"title":451,"path":452,"stem":453},"网格过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-grid","06.catalog\u002F05.css-transitions\u002F07.transitions-grid",{"title":455,"path":456,"stem":457},"光效过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-light","06.catalog\u002F05.css-transitions\u002F08.transitions-light",{"title":459,"path":460,"stem":461},"机械过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-mechanical","06.catalog\u002F05.css-transitions\u002F09.transitions-mechanical",{"title":463,"path":464,"stem":465},"其他过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-other","06.catalog\u002F05.css-transitions\u002F10.transitions-other",{"title":467,"path":468,"stem":469},"推移过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-push","06.catalog\u002F05.css-transitions\u002F11.transitions-push",{"title":471,"path":472,"stem":473},"径向过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-radial","06.catalog\u002F05.css-transitions\u002F12.transitions-radial",{"title":475,"path":476,"stem":477},"缩放过渡","\u002Fcatalog\u002Fcss-transitions\u002Ftransitions-scale","06.catalog\u002F05.css-transitions\u002F13.transitions-scale",{"title":479,"icon":480,"path":481,"stem":482,"children":483,"page":30},"展示","i-lucide-monitor-play","\u002Fcatalog\u002Fshowcase","06.catalog\u002F06.showcase",[484,488,492,496,500,504,508],{"title":485,"path":486,"stem":487},"应用展示","\u002Fcatalog\u002Fshowcase\u002Fapp-showcase","06.catalog\u002F06.showcase\u002F01.app-showcase",{"title":489,"path":490,"stem":491},"Apple 金额计数器","\u002Fcatalog\u002Fshowcase\u002Fapple-money-count","06.catalog\u002F06.showcase\u002F02.apple-money-count",{"title":493,"path":494,"stem":495},"蓝色毛衣开场视频","\u002Fcatalog\u002Fshowcase\u002Fblue-sweater-intro-video","06.catalog\u002F06.showcase\u002F03.blue-sweater-intro-video",{"title":497,"path":498,"stem":499},"朝鲜封锁","\u002Fcatalog\u002Fshowcase\u002Fnorth-korea-locked-down","06.catalog\u002F06.showcase\u002F04.north-korea-locked-down",{"title":501,"path":502,"stem":503},"纽约巴黎航班","\u002Fcatalog\u002Fshowcase\u002Fnyc-paris-flight","06.catalog\u002F06.showcase\u002F05.nyc-paris-flight",{"title":505,"path":506,"stem":507},"3D UI 展示","\u002Fcatalog\u002Fshowcase\u002Fui-3d-reveal","06.catalog\u002F06.showcase\u002F06.ui-3d-reveal",{"title":509,"path":510,"stem":511},"VPN YouTube 广告片段","\u002Fcatalog\u002Fshowcase\u002Fvpn-youtube-spot","06.catalog\u002F06.showcase\u002F07.vpn-youtube-spot",{"title":513,"icon":514,"path":515,"stem":516,"children":517,"page":30},"数据","i-lucide-bar-chart-3","\u002Fcatalog\u002Fdata","06.catalog\u002F07.data",[518,522,526,530,534,538,542],{"title":519,"path":520,"stem":521},"数据图表","\u002Fcatalog\u002Fdata\u002Fdata-chart","06.catalog\u002F07.data\u002F01.data-chart",{"title":523,"path":524,"stem":525},"西班牙地图","\u002Fcatalog\u002Fdata\u002Fspain-map","06.catalog\u002F07.data\u002F02.spain-map",{"title":527,"path":528,"stem":529},"美国地图","\u002Fcatalog\u002Fdata\u002Fus-map","06.catalog\u002F07.data\u002F03.us-map",{"title":531,"path":532,"stem":533},"美国气泡地图","\u002Fcatalog\u002Fdata\u002Fus-map-bubble","06.catalog\u002F07.data\u002F04.us-map-bubble",{"title":535,"path":536,"stem":537},"美国流动地图","\u002Fcatalog\u002Fdata\u002Fus-map-flow","06.catalog\u002F07.data\u002F05.us-map-flow",{"title":539,"path":540,"stem":541},"美国六边形网格地图","\u002Fcatalog\u002Fdata\u002Fus-map-hex","06.catalog\u002F07.data\u002F06.us-map-hex",{"title":543,"path":544,"stem":545},"世界地图","\u002Fcatalog\u002Fdata\u002Fworld-map","06.catalog\u002F07.data\u002F07.world-map",{"title":547,"icon":548,"path":549,"stem":550,"children":551,"page":30},"效果","i-lucide-sparkles","\u002Fcatalog\u002Feffects","06.catalog\u002F08.effects",[552,556,560,564,568,572,576,580],{"title":553,"path":554,"stem":555},"差值混合","\u002Fcatalog\u002Feffects\u002Fcaption-blend-difference","06.catalog\u002F08.effects\u002F01.caption-blend-difference",{"title":557,"path":558,"stem":559},"胶片颗粒叠加","\u002Fcatalog\u002Feffects\u002Fgrain-overlay","06.catalog\u002F08.effects\u002F02.grain-overlay",{"title":561,"path":562,"stem":563},"网格像素化擦除","\u002Fcatalog\u002Feffects\u002Fgrid-pixelate-wipe","06.catalog\u002F08.effects\u002F03.grid-pixelate-wipe",{"title":565,"path":566,"stem":567},"视差缩小","\u002Fcatalog\u002Feffects\u002Fparallax-unzoom","06.catalog\u002F08.effects\u002F04.parallax-unzoom",{"title":569,"path":570,"stem":571},"视差放大","\u002Fcatalog\u002Feffects\u002Fparallax-zoom","06.catalog\u002F08.effects\u002F05.parallax-zoom",{"title":573,"path":574,"stem":575},"微光扫过","\u002Fcatalog\u002Feffects\u002Fshimmer-sweep","06.catalog\u002F08.effects\u002F06.shimmer-sweep",{"title":577,"path":578,"stem":579},"纹理遮罩文字","\u002Fcatalog\u002Feffects\u002Ftexture-mask-text","06.catalog\u002F08.effects\u002F07.texture-mask-text",{"title":581,"path":582,"stem":583},"暗角","\u002Fcatalog\u002Feffects\u002Fvignette","06.catalog\u002F08.effects\u002F08.vignette",{"title":585,"icon":586,"path":587,"stem":588,"children":589,"page":30},"区块","i-lucide-box","\u002Fcatalog\u002Fblocks","06.catalog\u002F09.blocks",[590,594],{"title":591,"path":592,"stem":593},"流程图","\u002Fcatalog\u002Fblocks\u002Fflowchart","06.catalog\u002F09.blocks\u002F01.flowchart",{"title":595,"path":596,"stem":597},"Logo 片尾","\u002Fcatalog\u002Fblocks\u002Flogo-outro","06.catalog\u002F09.blocks\u002F02.logo-outro",{"title":599,"icon":600,"path":601,"stem":602,"children":603,"page":30},"代码片段","i-lucide-code-2","\u002Fcatalog\u002Fcode-snippets","06.catalog\u002F10.code-snippets",[604,608,612,616,620,624,628,632,636,640,644,648],{"title":605,"path":606,"stem":607},"Dark 2026","\u002Fcatalog\u002Fcode-snippets\u002Fcode-snippet-dark-2026","06.catalog\u002F10.code-snippets\u002F01.code-snippet-dark-2026",{"title":609,"path":610,"stem":611},"Dark Modern","\u002Fcatalog\u002Fcode-snippets\u002Fcode-snippet-dark-modern","06.catalog\u002F10.code-snippets\u002F02.code-snippet-dark-modern",{"title":613,"path":614,"stem":615},"Dark+","\u002Fcatalog\u002Fcode-snippets\u002Fcode-snippet-dark-plus","06.catalog\u002F10.code-snippets\u002F03.code-snippet-dark-plus",{"title":617,"path":618,"stem":619},"High Contrast","\u002Fcatalog\u002Fcode-snippets\u002Fcode-snippet-high-contrast","06.catalog\u002F10.code-snippets\u002F04.code-snippet-high-contrast",{"title":621,"path":622,"stem":623},"High Contrast Light","\u002Fcatalog\u002Fcode-snippets\u002Fcode-snippet-high-contrast-light","06.catalog\u002F10.code-snippets\u002F05.code-snippet-high-contrast-light",{"title":625,"path":626,"stem":627},"Light 2026","\u002Fcatalog\u002Fcode-snippets\u002Fcode-snippet-light-2026","06.catalog\u002F10.code-snippets\u002F06.code-snippet-light-2026",{"title":629,"path":630,"stem":631},"Light Modern","\u002Fcatalog\u002Fcode-snippets\u002Fcode-snippet-light-modern","06.catalog\u002F10.code-snippets\u002F07.code-snippet-light-modern",{"title":633,"path":634,"stem":635},"Light+","\u002Fcatalog\u002Fcode-snippets\u002Fcode-snippet-light-plus","06.catalog\u002F10.code-snippets\u002F08.code-snippet-light-plus",{"title":637,"path":638,"stem":639},"Monokai","\u002Fcatalog\u002Fcode-snippets\u002Fcode-snippet-monokai","06.catalog\u002F10.code-snippets\u002F09.code-snippet-monokai",{"title":641,"path":642,"stem":643},"Solarized Light","\u002Fcatalog\u002Fcode-snippets\u002Fcode-snippet-solarized-light","06.catalog\u002F10.code-snippets\u002F10.code-snippet-solarized-light",{"title":645,"path":646,"stem":647},"Visual Studio Dark","\u002Fcatalog\u002Fcode-snippets\u002Fcode-snippet-visual-studio-dark","06.catalog\u002F10.code-snippets\u002F11.code-snippet-visual-studio-dark",{"title":649,"path":650,"stem":651},"Visual Studio Light","\u002Fcatalog\u002Fcode-snippets\u002Fcode-snippet-visual-studio-light","06.catalog\u002F10.code-snippets\u002F12.code-snippet-visual-studio-light",{"title":653,"icon":654,"path":655,"stem":656,"children":657,"page":30},"参考","i-lucide-book-marked","\u002Freference","07.reference",[658,662,666,670,674,678,682],{"title":659,"path":660,"stem":661},"HTML Schema 参考","\u002Freference\u002Fhtml-schema","07.reference\u002F01.html-schema",{"title":663,"path":664,"stem":665},"贡献指南","\u002Freference\u002Fcontributing","07.reference\u002F02.contributing",{"title":667,"path":668,"stem":669},"贡献到 Catalog","\u002Freference\u002Fcatalog","07.reference\u002F03.catalog",{"title":671,"path":672,"stem":673},"发布渠道","\u002Freference\u002Frelease-channels","07.reference\u002F04.release-channels",{"title":675,"path":676,"stem":677},"测试本地 CLI 变更","\u002Freference\u002Ftesting-local-changes","07.reference\u002F05.testing-local-changes",{"title":679,"path":680,"stem":681},"Studio 手动 DOM 编辑","\u002Freference\u002Fstudio-manual-dom-editing","07.reference\u002F06.studio-manual-dom-editing",{"title":683,"path":684,"stem":685},"采用者","\u002Freference\u002Fadopters","07.reference\u002F07.adopters",{"id":687,"title":116,"body":688,"description":1580,"extension":1581,"links":1582,"meta":1583,"navigation":1323,"path":117,"seo":1584,"stem":118,"__hash__":1585},"docs\u002F03.guides\u002F14.4k-rendering.md",{"type":689,"value":690,"toc":1559},"minimark",[691,695,723,726,731,769,788,792,814,835,839,869,872,880,883,897,986,989,1044,1050,1056,1114,1117,1129,1133,1136,1269,1284,1287,1292,1295,1357,1360,1375,1378,1383,1390,1393,1395,1398,1432,1439,1443,1458,1465,1489,1497,1500,1519,1522,1555],[692,693,694],"p",{},"Hyperframes 通过两种方式渲染到 4K（3840×2160）。两种方式都能生成真正的 4K MP4；选择适合你项目的方式。",[696,697,698,710],"ul",{},[699,700,701,705,706],"li",{},[702,703,704],"strong",{},"以 4K 创作","\n以 4K 分辨率创建项目，使合成原生以 4K 布局。适合需要清晰的 4K 原生排版和素材时使用。 ",[707,708,709],"code",{},"bash npx hyperframes init my-video --resolution 4k ",[699,711,712,715,716,719,720],{},[702,713,714],{},"渲染时超采样","\n保留现有的 1080p 合成。在渲染时传入 ",[707,717,718],{},"--resolution 4k","，Chrome 会以 2× DPR 渲染，使截图达到 4K 分辨率。 ",[707,721,722],{},"bash npx hyperframes render --resolution 4k --output 4k.mp4 ",[724,725,15],"h2",{"id":15},[727,728,730],"h3",{"id":729},"以-4k-渲染现有项目","以 4K 渲染现有项目",[732,733,739],"pre",{"className":734,"code":735,"language":736,"meta":737,"style":738},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","npx hyperframes render --resolution 4k --output my-video-4k.mp4\n","bash","Terminal","",[707,740,741],{"__ignoreMap":738},[742,743,746,750,754,757,760,763,766],"span",{"class":744,"line":745},"line",1,[742,747,749],{"class":748},"sBMFI","npx",[742,751,753],{"class":752},"sfazB"," hyperframes",[742,755,756],{"class":752}," render",[742,758,759],{"class":752}," --resolution",[742,761,762],{"class":752}," 4k",[742,764,765],{"class":752}," --output",[742,767,768],{"class":752}," my-video-4k.mp4\n",[692,770,771,772,775,776,779,780,783,784,787],{},"合成的 ",[707,773,774],{},"data-width"," \u002F ",[707,777,778],{},"data-height"," 保持不变。Chrome 的 ",[707,781,782],{},"deviceScaleFactor"," 设为 ",[707,785,786],{},"2","，因此每帧的截图为 3840×2160。ffmpeg 自动从截图流中检测尺寸并以 4K 编码。",[727,789,791],{"id":790},"或以-4k-创建新项目","或以 4K 创建新项目",[732,793,795],{"className":734,"code":794,"language":736,"meta":737,"style":738},"npx hyperframes init my-video --resolution 4k\n",[707,796,797],{"__ignoreMap":738},[742,798,799,801,803,806,809,811],{"class":744,"line":745},[742,800,749],{"class":748},[742,802,753],{"class":752},[742,804,805],{"class":752}," init",[742,807,808],{"class":752}," my-video",[742,810,759],{"class":752},[742,812,813],{"class":752}," 4k\n",[692,815,816,817,820,821,820,824,820,827,830,831,834],{},"每个脚手架 HTML 文件会被就地修改：",[707,818,819],{},"data-width=\"3840\"","、",[707,822,823],{},"data-height=\"2160\"",[707,825,826],{},"data-resolution=\"landscape-4k\"",[707,828,829],{},"#stage"," CSS 尺寸以及 ",[707,832,833],{},"\u003Cmeta viewport>"," 标签。",[727,836,838],{"id":837},"验证输出为-4k","验证输出为 4K",[732,840,842],{"className":734,"code":841,"language":736,"meta":737,"style":738},"ffprobe -v error -select_streams v:0 -show_entries stream=width,height my-video-4k.mp4\n",[707,843,844],{"__ignoreMap":738},[742,845,846,849,852,855,858,861,864,867],{"class":744,"line":745},[742,847,848],{"class":748},"ffprobe",[742,850,851],{"class":752}," -v",[742,853,854],{"class":752}," error",[742,856,857],{"class":752}," -select_streams",[742,859,860],{"class":752}," v:0",[742,862,863],{"class":752}," -show_entries",[742,865,866],{"class":752}," stream=width,height",[742,868,768],{"class":752},[692,870,871],{},"预期输出：",[732,873,878],{"className":874,"code":876,"language":877},[875],"language-text","width=3840\nheight=2160\n","text",[707,879,876],{"__ignoreMap":738},[724,881,882],{"id":882},"分辨率预设",[692,884,885,888,889,892,893,896],{},[707,886,887],{},"--resolution"," 在 ",[707,890,891],{},"init"," 和 ",[707,894,895],{},"render"," 命令中接受以下值：",[898,899,900,916],"table",{},[901,902,903],"thead",{},[904,905,906,910,913],"tr",{},[907,908,909],"th",{},"预设",[907,911,912],{},"尺寸",[907,914,915],{},"别名",[917,918,919,938,953,971],"tbody",{},[904,920,921,927,930],{},[922,923,924],"td",{},[707,925,926],{},"landscape",[922,928,929],{},"1920×1080",[922,931,932,820,935],{},[707,933,934],{},"1080p",[707,936,937],{},"hd",[904,939,940,945,948],{},[922,941,942],{},[707,943,944],{},"portrait",[922,946,947],{},"1080×1920",[922,949,950],{},[707,951,952],{},"1080p-portrait",[904,954,955,960,963],{},[922,956,957],{},[707,958,959],{},"landscape-4k",[922,961,962],{},"3840×2160",[922,964,965,820,968],{},[707,966,967],{},"4k",[707,969,970],{},"uhd",[904,972,973,978,981],{},[922,974,975],{},[707,976,977],{},"portrait-4k",[922,979,980],{},"2160×3840",[922,982,983],{},[707,984,985],{},"4k-portrait",[692,987,988],{},"示例：",[732,990,992],{"className":734,"code":991,"language":736,"meta":737,"style":738},"npx hyperframes render --resolution 4k         # 横屏 4K\nnpx hyperframes render --resolution portrait-4k # 竖屏 4K（TikTok \u002F Reels 最高质量）\nnpx hyperframes render --resolution 1080p       # 显式 1080p（对 1080p 合成无效果）\n",[707,993,994,1010,1027],{"__ignoreMap":738},[742,995,996,998,1000,1002,1004,1006],{"class":744,"line":745},[742,997,749],{"class":748},[742,999,753],{"class":752},[742,1001,756],{"class":752},[742,1003,759],{"class":752},[742,1005,762],{"class":752},[742,1007,1009],{"class":1008},"sHwdD","         # 横屏 4K\n",[742,1011,1013,1015,1017,1019,1021,1024],{"class":744,"line":1012},2,[742,1014,749],{"class":748},[742,1016,753],{"class":752},[742,1018,756],{"class":752},[742,1020,759],{"class":752},[742,1022,1023],{"class":752}," portrait-4k",[742,1025,1026],{"class":1008}," # 竖屏 4K（TikTok \u002F Reels 最高质量）\n",[742,1028,1030,1032,1034,1036,1038,1041],{"class":744,"line":1029},3,[742,1031,749],{"class":748},[742,1033,753],{"class":752},[742,1035,756],{"class":752},[742,1037,759],{"class":752},[742,1039,1040],{"class":752}," 1080p",[742,1042,1043],{"class":1008},"       # 显式 1080p（对 1080p 合成无效果）\n",[724,1045,1047,1049],{"id":1046},"resolution-的工作原理超采样",[707,1048,887],{}," 的工作原理（超采样）",[692,1051,1052,1053,1055],{},"合成保持其创作时的尺寸。Hyperframes 根据输出与合成尺寸的比率计算 ",[707,1054,782],{},"，并将其传递给 Chrome：",[898,1057,1058,1075],{},[901,1059,1060],{},[904,1061,1062,1064,1068,1072],{},[907,1063,38],{},[907,1065,1066],{},[707,1067,887],{},[907,1069,1070],{},[707,1071,782],{},[907,1073,1074],{},"输出",[917,1076,1077,1089,1101],{},[904,1078,1079,1081,1085,1087],{},[922,1080,929],{},[922,1082,1083],{},[707,1084,967],{},[922,1086,786],{},[922,1088,962],{},[904,1090,1091,1093,1097,1099],{},[922,1092,947],{},[922,1094,1095],{},[707,1096,977],{},[922,1098,786],{},[922,1100,980],{},[904,1102,1103,1105,1109,1112],{},[922,1104,962],{},[922,1106,1107],{},[707,1108,967],{},[922,1110,1111],{},"1（无操作）",[922,1113,962],{},[692,1115,1116],{},"Chrome 然后以更高的 DPR 渲染页面——实质上将每个 CSS 像素渲染为 2×2 设备像素——因此截图具有所请求的分辨率。",[1118,1119,1120,1126],"blockquote",{},[692,1121,1122,1123],{},"💡 ",[702,1124,1125],{},"Tip",[692,1127,1128],{},"这种方法刻意保持简单——无需编辑合成，无需二次创作。权衡是：4K 渲染每帧大约需要 4 倍的时间，因为需要捕获和编码 4 倍的像素。",[724,1130,1132],{"id":1131},"什么会缩放什么不会","什么会缩放，什么不会",[692,1134,1135],{},"超采样以更高的 DPR 重新渲染页面。这对浏览器从矢量或高分辨率源光栅化的任何内容都有真正帮助，但对已锁定到固定像素网格的内容则无效果。了解哪些会缩放、哪些不会，有助于在 4K 渲染前设定正确的预期：",[898,1137,1138,1150],{},[901,1139,1140],{},[904,1141,1142,1145],{},[907,1143,1144],{},"素材类型",[907,1146,1147,1149],{},[707,1148,718],{}," 下的行为",[917,1151,1152,1168,1178,1188,1199,1211,1226,1255],{},[904,1153,1154,1161],{},[922,1155,1156,1157,1160],{},"文本（HTML、SVG ",[707,1158,1159],{},"\u003Ctext>","、Web 字体）",[922,1162,1163,1164,1167],{},"✅ ",[702,1165,1166],{},"以 4K 重新光栅化。"," 字形是矢量的，浏览器在新的 DPR 下对其进行塑形\u002F光栅化。任何缩放级别都清晰。",[904,1169,1170,1173],{},[922,1171,1172],{},"SVG \u002F 矢量图形",[922,1174,1163,1175,1177],{},[702,1176,1166],{}," 与文本相同——路径是矢量的。",[904,1179,1180,1183],{},[922,1181,1182],{},"CSS 形状、渐变、边框、阴影",[922,1184,1163,1185,1187],{},[702,1186,1166],{}," 浏览器生成的光栅。",[904,1189,1190,1193],{},[922,1191,1192],{},"固有尺寸 ≥ 4K 的图像",[922,1194,1163,1195,1198],{},[702,1196,1197],{},"完全受益。"," 3840×2160 的源素材提供所有细节。",[904,1200,1201,1204],{},[922,1202,1203],{},"小于 4K 的图像（如 1920×1080 的 PNG）",[922,1205,1206,1207,1210],{},"⚠️ ",[702,1208,1209],{},"无新增细节。"," 浏览器放大源位图；输出不会比在 1080p 渲染后外部放大更清晰——但也不会更差。",[904,1212,1213,1219],{},[922,1214,1215,1218],{},[707,1216,1217],{},"\u003Cvideo>"," 元素",[922,1220,1221,1222,1225],{},"❌ ",[702,1223,1224],{},"锁定到源分辨率。"," 1080p 的 MP4 仍然是 1080p；超采样仅帮助周围的 DOM。如果需要全程 4K，请以目标分辨率编码源视频。",[904,1227,1228,1234],{},[922,1229,1230,1233],{},[707,1231,1232],{},"\u003Ccanvas>","（2D 和 WebGL）",[922,1235,1221,1236,1239,1240,1243,1244,775,1247,1250,1251,1254],{},[702,1237,1238],{},"锁定到 canvas 固有尺寸。"," ",[707,1241,1242],{},"\u003Ccanvas width=\"1920\" height=\"1080\">"," 无论 DPR 如何都是 1080p 位图。要以 4K 渲染 canvas 内容，请将 ",[707,1245,1246],{},"canvas.width",[707,1248,1249],{},"canvas.height"," 乘以目标 DPR，并缩放绘图上下文（",[707,1252,1253],{},"ctx.scale(2, 2)"," 用于相同逻辑布局的 2× canvas）。",[904,1256,1257,1260],{},[922,1258,1259],{},"引擎注入的预渲染视频帧",[922,1261,1221,1262,1265,1266,1268],{},[702,1263,1264],{},"锁定到提取分辨率。"," 当 producer 通过 ffmpeg 预提取 ",[707,1267,1217],{}," 帧时，它们以源视频的尺寸解码。",[692,1270,1271,1274,1275,1279,1280,1283],{},[702,1272,1273],{},"经验法则","：如果素材是",[1276,1277,1278],"em",{},"矢量的或由浏览器生成的","，超采样有帮助。如果它是",[1276,1281,1282],{},"具有固定像素尺寸的位图","（视频、canvas、低分辨率 PNG），则没有帮助——请以目标分辨率创作。",[724,1285,1286],{"id":1286},"约束条件",[692,1288,1289,1291],{},[707,1290,887],{}," 在捕获帧之前执行三项检查。如果任何一项失败，渲染会在执行前退出。",[727,1293,1294],{"id":1294},"宽高比必须匹配",[732,1296,1298],{"className":734,"code":1297,"language":736,"meta":738,"style":738},"# 正确——都是横屏\nhyperframes render --resolution 4k         # 合成是 1920×1080\n\n# 错误——合成是横屏，目标是竖屏\nhyperframes render --resolution portrait-4k  # 合成是 1920×1080\n# → outputResolution portrait-4k (2160×3840) 与合成的宽高比 (1920×1080) 不匹配。\n#   请选择方向匹配的预设。\n",[707,1299,1300,1305,1319,1325,1331,1345,1351],{"__ignoreMap":738},[742,1301,1302],{"class":744,"line":745},[742,1303,1304],{"class":1008},"# 正确——都是横屏\n",[742,1306,1307,1310,1312,1314,1316],{"class":744,"line":1012},[742,1308,1309],{"class":748},"hyperframes",[742,1311,756],{"class":752},[742,1313,759],{"class":752},[742,1315,762],{"class":752},[742,1317,1318],{"class":1008},"         # 合成是 1920×1080\n",[742,1320,1321],{"class":744,"line":1029},[742,1322,1324],{"emptyLinePlaceholder":1323},true,"\n",[742,1326,1328],{"class":744,"line":1327},4,[742,1329,1330],{"class":1008},"# 错误——合成是横屏，目标是竖屏\n",[742,1332,1334,1336,1338,1340,1342],{"class":744,"line":1333},5,[742,1335,1309],{"class":748},[742,1337,756],{"class":752},[742,1339,759],{"class":752},[742,1341,1023],{"class":752},[742,1343,1344],{"class":1008},"  # 合成是 1920×1080\n",[742,1346,1348],{"class":744,"line":1347},6,[742,1349,1350],{"class":1008},"# → outputResolution portrait-4k (2160×3840) 与合成的宽高比 (1920×1080) 不匹配。\n",[742,1352,1354],{"class":744,"line":1353},7,[742,1355,1356],{"class":1008},"#   请选择方向匹配的预设。\n",[727,1358,1359],{"id":1359},"缩放比例必须为整数",[692,1361,1362,1363,1366,1367,1370,1371,1374],{},"宽度比率（输出 ÷ 合成）必须为正整数。1080p → 4K 恰好是 ",[707,1364,1365],{},"2×","。720p → 4K 是 ",[707,1368,1369],{},"3×","，可以工作。非整数缩放（如 900p → 4K 的 ",[707,1372,1373],{},"2.4×","）会在亚像素定位的文本上引入锯齿——Hyperframes 会拒绝而不是生成模糊的渲染。",[727,1376,1377],{"id":1377},"不支持降采样",[692,1379,1380,1382],{},[707,1381,887],{}," 仅支持超采样。4K 合成无法通过此标志降采样到 1080p——请以合成的原生分辨率渲染，如果需要降采样则使用 ffmpeg 单独处理。",[727,1384,1386,1387],{"id":1385},"尚不支持-hdr","尚不支持 ",[707,1388,1389],{},"--hdr",[692,1391,1392],{},"HDR 分层合成器在合成尺寸下处理像素缓冲区；超采样 + HDR 需要对这些缓冲区进行并行缩放。该组合会被拒绝并显示明确的错误信息。如果需要两者，分两遍渲染：先以合成分辨率渲染 HDR，然后单独放大。",[724,1394,120],{"id":120},[692,1396,1397],{},"1080p → 4K 超采样大约需要处理 4 倍的像素进行捕获、编码和写入。预期：",[696,1399,1400,1406,1412,1422],{},[699,1401,1402,1405],{},[702,1403,1404],{},"每帧捕获","：慢 3–4 倍（Chrome 绘制 4 倍的像素，截图传输量增大 4 倍）",[699,1407,1408,1411],{},[702,1409,1410],{},"编码","：慢 2–3 倍（取决于编码器；H.264 随分辨率亚线性扩展）",[699,1413,1414,1417,1418,1421],{},[702,1415,1416],{},"内存","：有上限——引擎的帧 data-URI 缓存有字节预算（默认每个 worker 1500 MB，可通过 ",[707,1419,1420],{},"PRODUCER_FRAME_DATA_URI_CACHE_BYTES_MB"," 配置）",[699,1423,1424,1427,1428,1431],{},[702,1425,1426],{},"输出文件大小","：在默认 CRF 下，预期为 1080p 渲染文件大小的 3–5 倍。传入 ",[707,1429,1430],{},"--video-bitrate 25M","（或更高）可获得可预测的文件大小。",[692,1433,1434,1435,1438],{},"对于 30 秒合成的 4K 渲染，在现代笔记本电脑上预计需要几分钟的挂钟时间。在渲染机器上添加 ",[707,1436,1437],{},"--workers 4","（或更多）以实现并行捕获。",[724,1440,1442],{"id":1441},"studio-支持","Studio 支持",[692,1444,1445,1446,1449,1450,1453,1454,1457],{},"Studio 的渲染面板在格式和质量选择器旁边包含一个分辨率下拉菜单。选择 ",[707,1447,1448],{},"4K","（或竖屏 ",[707,1451,1452],{},"4K ↕","）并点击",[702,1455,1456],{},"导出","——运行与 CLI 标志相同的超采样路径，无需编辑合成。",[692,1459,1460,1461,1464],{},"下拉菜单默认为 ",[707,1462,1463],{},"Auto","（以合成的创作尺寸渲染）。可用预设：",[696,1466,1467,1472,1481],{},[699,1468,1469,1471],{},[702,1470,1463],{}," — 合成的原生尺寸",[699,1473,1474,775,1477,1480],{},[702,1475,1476],{},"1080p ↔",[702,1478,1479],{},"1080p ↕"," — 1920×1080 \u002F 1080×1920",[699,1482,1483,775,1486,1488],{},[702,1484,1485],{},"4K ↔",[702,1487,1452],{}," — 3840×2160 \u002F 2160×3840",[692,1490,1491,1492,1496],{},"分辨率按每次渲染应用，而非按项目——你的合成文件不会改变。相同的",[1493,1494,1286],"a",{"href":1495},"#%E7%BA%A6%E6%9D%9F%E6%9D%A1%E4%BB%B6","适用；当 producer 拒绝某个组合时，失败信息会显示在 Studio 渲染队列中。",[692,1498,1499],{},"你也可以通过 CLI 控制分辨率：",[696,1501,1502,1511],{},[699,1503,1504,1507,1508],{},[702,1505,1506],{},"新项目","：",[707,1509,1510],{},"hyperframes init my-video --resolution 4k",[699,1512,1513,1507,1516],{},[702,1514,1515],{},"现有项目",[707,1517,1518],{},"hyperframes render --resolution 4k --output 4k.mp4",[724,1520,1521],{"id":1521},"另请参阅",[696,1523,1524,1539,1550],{},[699,1525,1526,1532,1533,892,1536],{},[1493,1527,1529,1531],{"href":1528},"\u002Fpackages\u002Fcli#render",[707,1530,895],{}," CLI 参考"," — 每个渲染标志，包括 ",[707,1534,1535],{},"--video-bitrate",[707,1537,1538],{},"--crf",[699,1540,1541,1546,1547,1549],{},[1493,1542,1544,1531],{"href":1543},"\u002Fpackages\u002Fcli#init",[707,1545,891],{}," — 创建时的 ",[707,1548,887],{}," 标志",[699,1551,1552,1554],{},[1493,1553,112],{"href":113}," — 颜色管线指南；HDR + 4K 尚不支持组合使用",[1556,1557,1558],"style",{},"html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}",{"title":738,"searchDepth":745,"depth":1012,"links":1560},[1561,1566,1567,1569,1570,1577,1578,1579],{"id":15,"depth":1012,"text":15,"children":1562},[1563,1564,1565],{"id":729,"depth":1029,"text":730},{"id":790,"depth":1029,"text":791},{"id":837,"depth":1029,"text":838},{"id":882,"depth":1012,"text":882},{"id":1046,"depth":1012,"text":1568},"--resolution 的工作原理（超采样）",{"id":1131,"depth":1012,"text":1132},{"id":1286,"depth":1012,"text":1286,"children":1571},[1572,1573,1574,1575],{"id":1294,"depth":1029,"text":1294},{"id":1359,"depth":1029,"text":1359},{"id":1377,"depth":1029,"text":1377},{"id":1385,"depth":1029,"text":1576},"尚不支持 --hdr",{"id":120,"depth":1012,"text":120},{"id":1441,"depth":1012,"text":1442},{"id":1521,"depth":1012,"text":1521},"无需重写即可将任何合成渲染为 4K（3840×2160）—— CLI 通过 Chrome 的 device scale factor 对 1080p 合成进行超采样。","md",null,{},{"title":116,"description":1580},"G1631qASAQphqL1YZDFPZWrUAb4P2x35IHuDtNAek7o",[1587,1589],{"title":112,"path":113,"stem":114,"description":1588,"children":-1},"当源包含 HDR 视频或图片时，将合成渲染为 HDR10 MP4（BT.2020 PQ 或 HLG，10-bit H.265）。",{"title":120,"path":121,"stem":122,"description":1590,"children":-1},"如何保持预览播放流畅，以及如何诊断高开销的合成。",1780322250569]