[{"data":1,"prerenderedAt":2474},["ShallowReactive",2],{"navigation":3,"/api/advanced/web-gpu":211,"/api/advanced/web-gpu-surround":2469},[4,29,62,149,177,187,191,195,199,203,207],{"title":5,"path":6,"stem":7,"children":8,"icon":27,"titleTemplate":28},"Getting Started","/getting-started","1.getting-started/1.index",[9,12,17,22],{"title":10,"path":6,"stem":7,"icon":11},"Introduction","i-lucide-house",{"title":13,"path":14,"stem":15,"icon":16},"Installation","/getting-started/installation","1.getting-started/2.installation","i-lucide-download",{"title":18,"path":19,"stem":20,"icon":21},"Your First Scene","/getting-started/your-first-scene","1.getting-started/3.your-first-scene","i-lucide-donut",{"title":23,"path":24,"stem":25,"icon":26},"Upgrade Guide","/getting-started/upgrade-guide","1.getting-started/4.upgrade-guide","i-lucide-circle-arrow-up","i-lucide-rocket","%s · Get Started with TresJS",{"title":30,"path":31,"stem":32,"children":33},"Essentials","/essentials","2.essentials",[34,36,48],{"title":30,"path":31,"stem":35},"2.essentials/index",{"title":37,"icon":38,"open":39,"path":40,"stem":41,"children":42,"page":47},"Core Architecture","i-lucide-cpu",true,"/essentials/core-architecture","2.essentials/1.core-architecture",[43],{"title":44,"path":45,"stem":46},"Custom Vue Renderer","/essentials/core-architecture/custom-vue-renderer","2.essentials/1.core-architecture/2.custom-vue-renderer",false,{"title":49,"icon":50,"open":39,"path":51,"stem":52,"children":53,"page":47},"Key Concepts","i-lucide-medal","/essentials/concepts","2.essentials/2.concepts",[54,58],{"title":55,"path":56,"stem":57},"Declarative vs Imperative","/essentials/concepts/declarative-vs-imperative","2.essentials/2.concepts/1.declarative-vs-imperative",{"title":59,"path":60,"stem":61},"Reactivity","/essentials/concepts/reactivity","2.essentials/2.concepts/2.reactivity",{"title":63,"path":64,"stem":65,"children":66},"API","/api","3.api",[67,70,84,111,121,131],{"title":68,"path":64,"stem":69},"TresJS API Reference","3.api/1.index",{"title":71,"icon":72,"open":39,"path":73,"stem":74,"children":75,"page":47},"Components","i-lucide-box","/api/components","3.api/1.components",[76,80],{"title":77,"path":78,"stem":79},"\u003CTresCanvas />","/api/components/tres-canvas","3.api/1.components/tres-canvas",{"title":81,"path":82,"stem":83},"Tres Components","/api/components/tres-objects","3.api/1.components/tres-objects",{"title":85,"titleTemplate":86,"icon":87,"path":88,"stem":89,"children":90,"page":47},"Composables","%s · TresJS Composables","i-lucide-arrow-right-left","/api/composables","3.api/2.composables",[91,95,99,103,107],{"title":92,"path":93,"stem":94},"useTres","/api/composables/use-tres","3.api/2.composables/1.use-tres",{"title":96,"path":97,"stem":98},"useTresContext","/api/composables/use-tres-context","3.api/2.composables/2.use-tres-context",{"title":100,"path":101,"stem":102},"useLoop","/api/composables/use-loop","3.api/2.composables/3.use-loop",{"title":104,"path":105,"stem":106},"useGraph","/api/composables/use-graph","3.api/2.composables/4.use-graph",{"title":108,"path":109,"stem":110},"useLoader","/api/composables/use-loader","3.api/2.composables/5.use-loader",{"title":112,"icon":113,"path":114,"stem":115,"children":116,"page":47},"Event handling","i-lucide-mouse-pointer-2","/api/events","3.api/3.events",[117],{"title":118,"path":119,"stem":120},"Pointer Events","/api/events/pointer-events","3.api/3.events/1.pointer-events",{"title":122,"icon":123,"path":124,"stem":125,"children":126,"page":47},"Utils","i-lucide-wrench","/api/utils","3.api/4.utils",[127],{"title":128,"path":129,"stem":130},"Type Guards","/api/utils/type-guards","3.api/4.utils/1.type-guards",{"title":132,"icon":133,"path":134,"stem":135,"children":136,"page":47},"Advanced","i-lucide-brain-circuit","/api/advanced","3.api/5.advanced",[137,141,145],{"title":138,"path":139,"stem":140},"Scaling Performance 🚀","/api/advanced/performance","3.api/5.advanced/performance",{"title":142,"path":143,"stem":144},"Primitives","/api/advanced/primitives","3.api/5.advanced/primitives",{"title":146,"path":147,"stem":148},"WebGPU","/api/advanced/web-gpu","3.api/5.advanced/web-gpu",{"title":150,"path":151,"stem":152,"children":153},"Cookbook","/cookbook","4.cookbook",[154,157,161,165,169,173],{"title":155,"path":151,"stem":156},"Cookbook 🍳🧑‍🍳","4.cookbook/index",{"title":158,"path":159,"stem":160},"OrbitControls","/cookbook/orbit-controls","4.cookbook/1.orbit-controls",{"title":162,"path":163,"stem":164},"Basic Animations","/cookbook/basic-animations","4.cookbook/2.basic-animations",{"title":166,"path":167,"stem":168},"Model Animation","/cookbook/model-animation","4.cookbook/3.model-animation",{"title":170,"path":171,"stem":172},"Advanced GSAP Animations","/cookbook/advanced-gsap-animations","4.cookbook/4.advanced-gsap-animations",{"title":174,"path":175,"stem":176},"Tweakpane","/cookbook/tweakpane","4.cookbook/5.tweakpane",{"title":178,"path":179,"stem":180,"children":181},"Community","/community","5.community/1.index",[182,183],{"title":178,"path":179,"stem":180},{"title":184,"path":185,"stem":186},"Awesome Resources","/community/awesome-resources","5.community/awesome-resources",{"title":188,"path":189,"stem":190},"German Translation","/de","de",{"title":192,"path":193,"stem":194},"Spanish Translation","/es","es",{"title":196,"path":197,"stem":198},"French Translation","/fr","fr",{"title":200,"path":201,"stem":202},"Italian Translation","/it","it",{"title":204,"path":205,"stem":206},"Japanese Translation","/jp","jp",{"title":208,"path":209,"stem":210},"Chinese Translation","/zh","zh",{"id":212,"title":146,"body":213,"description":2463,"extension":2464,"links":2465,"meta":2466,"navigation":39,"path":147,"seo":2467,"stem":148,"__hash__":2468},"docs/3.api/5.advanced/web-gpu.md",{"type":214,"value":215,"toc":2453},"minimark",[216,227,232,241,248,282,288,291,311,329,333,341,345,790,794,797,2449],[217,218,219],"warning",{},[220,221,222,226],"p",{},[223,224,225],"strong",{},"Experimental Feature",": WebGPU support in TresJS is experimental and requires modern browser support. WebGPU is still being developed and may have breaking changes.",[228,229,231],"h2",{"id":230},"what-is-webgpu","What is WebGPU?",[220,233,234,240],{},[235,236,146],"a",{"href":237,"rel":238},"https://developer.mozilla.org/en-US/docs/Web/API/WebGPU_API",[239],"nofollow"," is the next-generation graphics API for the web, designed to provide high-performance 3D graphics and general-purpose computing capabilities directly in web browsers. It offers several advantages over WebGL:",[242,243,245],"h3",{"id":244},"key-benefits",[223,246,247],{},"Key Benefits",[249,250,251,258,264,270,276],"ul",{},[252,253,254,257],"li",{},[223,255,256],{},"Better Performance",": More efficient GPU utilization and reduced CPU overhead",[252,259,260,263],{},[223,261,262],{},"Modern GPU Features",": Access to compute shaders, advanced texturing, and modern GPU capabilities",[252,265,266,269],{},[223,267,268],{},"Unified API",": Single API for both graphics and compute operations",[252,271,272,275],{},[223,273,274],{},"Better Debugging",": Improved error handling and debugging capabilities",[252,277,278,281],{},[223,279,280],{},"Future-Proof",": Designed for modern GPU architectures",[242,283,285],{"id":284},"browser-support",[223,286,287],{},"Browser Support",[220,289,290],{},"WebGPU is currently supported in:",[249,292,293,299,305],{},[252,294,295,298],{},[223,296,297],{},"Chrome/Edge",": Stable support (Chrome 113+)",[252,300,301,304],{},[223,302,303],{},"Firefox",": Behind experimental flag",[252,306,307,310],{},[223,308,309],{},"Safari",": Experimental support in Safari Technology Preview",[312,313,314],"note",{},[220,315,316,317,322,323,328],{},"Check current WebGPU browser support at ",[235,318,321],{"href":319,"rel":320},"https://caniuse.com/webgpu",[239],"Can I Use WebGPU"," and the official ",[235,324,327],{"href":325,"rel":326},"https://github.com/gpuweb/gpuweb/wiki/Implementation-Status",[239],"WebGPU support matrix",".",[228,330,332],{"id":331},"usage-with-tresjs","Usage with TresJS",[220,334,335,336,340],{},"TresJS supports WebGPU through Three.js's WebGPU renderer. You can enable WebGPU by providing a custom renderer factory to the ",[337,338,339],"code",{},"\u003CTresCanvas>"," component.",[242,342,344],{"id":343},"basic-setup","Basic Setup",[346,347,353],"pre",{"className":348,"code":349,"filename":350,"language":351,"meta":352,"style":352},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { WebGPURenderer } from 'three/webgpu'\nimport type { TresRendererSetupContext } from '@tresjs/core'\n\n// Create WebGPU renderer factory\nconst createWebGPURenderer = (ctx: TresRendererSetupContext) => {\n  const renderer = new WebGPURenderer({\n    canvas: toValue(ctx.canvas),\n    // WebGPU specific configuration\n    alpha: true,\n    antialias: true,\n  })\n  return renderer\n}\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas :renderer=\"createWebGPURenderer\">\n    \u003CTresPerspectiveCamera :position=\"[3, 3, 3]\" />\n    \u003CTresBoxGeometry :args=\"[1, 1, 1]\" />\n    \u003CTresMeshBasicMaterial color=\"hotpink\" />\n    \u003C!-- Your 3D scene here -->\n  \u003C/TresCanvas>\n\u003C/template>\n","basic-webgpu.vue","vue","",[337,354,355,390,419,440,463,469,476,509,533,558,564,578,590,599,608,614,624,629,639,665,707,743,765,771,781],{"__ignoreMap":352},[356,357,360,364,368,372,375,378,381,385,387],"span",{"class":358,"line":359},"line",1,[356,361,363],{"class":362},"sMK4o","\u003C",[356,365,367],{"class":366},"swJcz","script",[356,369,371],{"class":370},"spNyl"," setup",[356,373,374],{"class":370}," lang",[356,376,377],{"class":362},"=",[356,379,380],{"class":362},"\"",[356,382,384],{"class":383},"sfazB","ts",[356,386,380],{"class":362},[356,388,389],{"class":362},">\n",[356,391,393,397,400,404,407,410,413,416],{"class":358,"line":392},2,[356,394,396],{"class":395},"s7zQu","import",[356,398,399],{"class":362}," {",[356,401,403],{"class":402},"sTEyZ"," TresCanvas",[356,405,406],{"class":362}," }",[356,408,409],{"class":395}," from",[356,411,412],{"class":362}," '",[356,414,415],{"class":383},"@tresjs/core",[356,417,418],{"class":362},"'\n",[356,420,422,424,426,429,431,433,435,438],{"class":358,"line":421},3,[356,423,396],{"class":395},[356,425,399],{"class":362},[356,427,428],{"class":402}," WebGPURenderer",[356,430,406],{"class":362},[356,432,409],{"class":395},[356,434,412],{"class":362},[356,436,437],{"class":383},"three/webgpu",[356,439,418],{"class":362},[356,441,443,445,448,450,453,455,457,459,461],{"class":358,"line":442},4,[356,444,396],{"class":395},[356,446,447],{"class":395}," type",[356,449,399],{"class":362},[356,451,452],{"class":402}," TresRendererSetupContext",[356,454,406],{"class":362},[356,456,409],{"class":395},[356,458,412],{"class":362},[356,460,415],{"class":383},[356,462,418],{"class":362},[356,464,466],{"class":358,"line":465},5,[356,467,468],{"emptyLinePlaceholder":39},"\n",[356,470,472],{"class":358,"line":471},6,[356,473,475],{"class":474},"sHwdD","// Create WebGPU renderer factory\n",[356,477,479,482,485,487,490,494,497,500,503,506],{"class":358,"line":478},7,[356,480,481],{"class":370},"const",[356,483,484],{"class":402}," createWebGPURenderer ",[356,486,377],{"class":362},[356,488,489],{"class":362}," (",[356,491,493],{"class":492},"sHdIc","ctx",[356,495,496],{"class":362},":",[356,498,452],{"class":499},"sBMFI",[356,501,502],{"class":362},")",[356,504,505],{"class":370}," =>",[356,507,508],{"class":362}," {\n",[356,510,512,515,518,521,524,527,530],{"class":358,"line":511},8,[356,513,514],{"class":370},"  const",[356,516,517],{"class":402}," renderer",[356,519,520],{"class":362}," =",[356,522,523],{"class":362}," new",[356,525,428],{"class":526},"s2Zo4",[356,528,529],{"class":366},"(",[356,531,532],{"class":362},"{\n",[356,534,536,539,541,544,546,548,550,553,555],{"class":358,"line":535},9,[356,537,538],{"class":366},"    canvas",[356,540,496],{"class":362},[356,542,543],{"class":526}," toValue",[356,545,529],{"class":366},[356,547,493],{"class":402},[356,549,328],{"class":362},[356,551,552],{"class":402},"canvas",[356,554,502],{"class":366},[356,556,557],{"class":362},",\n",[356,559,561],{"class":358,"line":560},10,[356,562,563],{"class":474},"    // WebGPU specific configuration\n",[356,565,567,570,572,576],{"class":358,"line":566},11,[356,568,569],{"class":366},"    alpha",[356,571,496],{"class":362},[356,573,575],{"class":574},"sfNiH"," true",[356,577,557],{"class":362},[356,579,581,584,586,588],{"class":358,"line":580},12,[356,582,583],{"class":366},"    antialias",[356,585,496],{"class":362},[356,587,575],{"class":574},[356,589,557],{"class":362},[356,591,593,596],{"class":358,"line":592},13,[356,594,595],{"class":362},"  }",[356,597,598],{"class":366},")\n",[356,600,602,605],{"class":358,"line":601},14,[356,603,604],{"class":395},"  return",[356,606,607],{"class":402}," renderer\n",[356,609,611],{"class":358,"line":610},15,[356,612,613],{"class":362},"}\n",[356,615,617,620,622],{"class":358,"line":616},16,[356,618,619],{"class":362},"\u003C/",[356,621,367],{"class":366},[356,623,389],{"class":362},[356,625,627],{"class":358,"line":626},17,[356,628,468],{"emptyLinePlaceholder":39},[356,630,632,634,637],{"class":358,"line":631},18,[356,633,363],{"class":362},[356,635,636],{"class":366},"template",[356,638,389],{"class":362},[356,640,642,645,648,651,654,656,658,661,663],{"class":358,"line":641},19,[356,643,644],{"class":362},"  \u003C",[356,646,647],{"class":366},"TresCanvas",[356,649,650],{"class":362}," :",[356,652,653],{"class":370},"renderer",[356,655,377],{"class":362},[356,657,380],{"class":362},[356,659,660],{"class":402},"createWebGPURenderer",[356,662,380],{"class":362},[356,664,389],{"class":362},[356,666,668,671,674,676,679,681,683,686,690,693,695,697,699,702,704],{"class":358,"line":667},20,[356,669,670],{"class":362},"    \u003C",[356,672,673],{"class":366},"TresPerspectiveCamera",[356,675,650],{"class":362},[356,677,678],{"class":370},"position",[356,680,377],{"class":362},[356,682,380],{"class":362},[356,684,685],{"class":362},"[",[356,687,689],{"class":688},"sbssI","3",[356,691,692],{"class":362},", ",[356,694,689],{"class":688},[356,696,692],{"class":362},[356,698,689],{"class":688},[356,700,701],{"class":362},"]",[356,703,380],{"class":362},[356,705,706],{"class":362}," />\n",[356,708,710,712,715,717,720,722,724,726,729,731,733,735,737,739,741],{"class":358,"line":709},21,[356,711,670],{"class":362},[356,713,714],{"class":366},"TresBoxGeometry",[356,716,650],{"class":362},[356,718,719],{"class":370},"args",[356,721,377],{"class":362},[356,723,380],{"class":362},[356,725,685],{"class":362},[356,727,728],{"class":688},"1",[356,730,692],{"class":362},[356,732,728],{"class":688},[356,734,692],{"class":362},[356,736,728],{"class":688},[356,738,701],{"class":362},[356,740,380],{"class":362},[356,742,706],{"class":362},[356,744,746,748,751,754,756,758,761,763],{"class":358,"line":745},22,[356,747,670],{"class":362},[356,749,750],{"class":366},"TresMeshBasicMaterial",[356,752,753],{"class":370}," color",[356,755,377],{"class":362},[356,757,380],{"class":362},[356,759,760],{"class":383},"hotpink",[356,762,380],{"class":362},[356,764,706],{"class":362},[356,766,768],{"class":358,"line":767},23,[356,769,770],{"class":474},"    \u003C!-- Your 3D scene here -->\n",[356,772,774,777,779],{"class":358,"line":773},24,[356,775,776],{"class":362},"  \u003C/",[356,778,647],{"class":366},[356,780,389],{"class":362},[356,782,784,786,788],{"class":358,"line":783},25,[356,785,619],{"class":362},[356,787,636],{"class":366},[356,789,389],{"class":362},[242,791,793],{"id":792},"advanced-webgpu-example","Advanced WebGPU Example",[795,796],"examples-web-gpu",{},[798,799,803],"code-preview",{"className":800},[801,802],"[&>div]:*:my-0","[&>div]:*:w-full",[804,805,807,2067],"code-tree",{"default-value":806},"app.vue",[346,808,811],{"className":348,"code":809,"filename":810,"language":351,"meta":352,"style":352},"\u003Cscript setup lang=\"ts\">\nimport { isMesh } from '@tesjs/core'\nimport { useGLTF } from '@tresjs/cientos'\nimport { add, cameraProjectionMatrix, cameraViewMatrix, color, Fn, hash, mix, normalView, positionWorld, sin, timerGlobal, uniform, varying, vec3, vec4 } from 'three/tsl'\nimport { AdditiveBlending, DoubleSide, MeshBasicNodeMaterial } from 'three/webgpu'\n\nconst { nodes } = useGLTF('https://raw.githubusercontent.com/Tresjs/assets/main/models/gltf/blender-cube.glb', { draco: true })\n\nconst model = computed(() => nodes.value.BlenderCube)\n/**\n* Material\n*/\nconst material = new MeshBasicNodeMaterial({\n  transparent: true,\n  side: DoubleSide,\n  depthWrite: false,\n  blending: AdditiveBlending,\n})\n// Position\nconst glitchStrength = varying(0)\nmaterial.vertexNode = Fn(() => {\n  const glitchTime = timerGlobal().sub(positionWorld.y.mul(0.5))\n  glitchStrength.assign(add(\n    sin(glitchTime),\n    sin(glitchTime.mul(3.45)),\n    sin(glitchTime.mul(8.76)),\n  ).div(3).smoothstep(0.3, 1))\n  const glitch = vec3(\n    hash(positionWorld.xz.abs().mul(9999)).sub(0.5),\n    0,\n    hash(positionWorld.yx.abs().mul(9999)).sub(0.5),\n  )\n  positionWorld.xyz.addAssign(glitch.mul(glitchStrength.mul(0.5)))\n  return cameraProjectionMatrix.mul(cameraViewMatrix).mul(positionWorld)\n})()\n// Color\nconst colorInside = uniform(color('#ff6088'))\nconst colorOutside = uniform(color('#4d55ff'))\nmaterial.colorNode = Fn(() => {\n  const stripes = positionWorld.y.sub(timerGlobal(0.02)).mul(20).mod(1).pow(3)\n  const fresnel = normalView.dot(vec3(0, 0, 1)).abs().oneMinus()\n  const falloff = fresnel.smoothstep(0.8, 0.2)\n  const alpha = stripes.mul(fresnel).add(fresnel.mul(1.25)).mul(falloff)\n  const finalColor = mix(colorInside, colorOutside, fresnel.add(glitchStrength.mul(0.6)))\n  return vec4(finalColor, alpha)\n})()\n\nwatch(model, (newModel) => {\n  newModel.traverse((child) => {\n    if (isMesh(child)) {\n      child.material = material\n    }\n  })\n})\n\u003C/script>\n\n\u003Ctemplate>\n  \u003Cprimitive v-if=\"model\" :object=\"model\" />\n\u003C/template>\n","components/HologramCube.vue",[337,812,813,833,853,873,963,992,996,1037,1041,1073,1078,1083,1088,1105,1116,1127,1139,1150,1156,1161,1179,1201,1242,1260,1274,1296,1318,1352,1366,1411,1419,1461,1467,1508,1536,1544,1550,1578,1605,1627,1692,1743,1771,1824,1869,1887,1894,1899,1921,1945,1965,1980,1986,1993,2000,2009,2014,2023,2058],{"__ignoreMap":352},[356,814,815,817,819,821,823,825,827,829,831],{"class":358,"line":359},[356,816,363],{"class":362},[356,818,367],{"class":366},[356,820,371],{"class":370},[356,822,374],{"class":370},[356,824,377],{"class":362},[356,826,380],{"class":362},[356,828,384],{"class":383},[356,830,380],{"class":362},[356,832,389],{"class":362},[356,834,835,837,839,842,844,846,848,851],{"class":358,"line":392},[356,836,396],{"class":395},[356,838,399],{"class":362},[356,840,841],{"class":402}," isMesh",[356,843,406],{"class":362},[356,845,409],{"class":395},[356,847,412],{"class":362},[356,849,850],{"class":383},"@tesjs/core",[356,852,418],{"class":362},[356,854,855,857,859,862,864,866,868,871],{"class":358,"line":421},[356,856,396],{"class":395},[356,858,399],{"class":362},[356,860,861],{"class":402}," useGLTF",[356,863,406],{"class":362},[356,865,409],{"class":395},[356,867,412],{"class":362},[356,869,870],{"class":383},"@tresjs/cientos",[356,872,418],{"class":362},[356,874,875,877,879,882,885,888,890,893,895,897,899,902,904,907,909,912,914,917,919,922,924,927,929,932,934,937,939,942,944,947,949,952,954,956,958,961],{"class":358,"line":442},[356,876,396],{"class":395},[356,878,399],{"class":362},[356,880,881],{"class":402}," add",[356,883,884],{"class":362},",",[356,886,887],{"class":402}," cameraProjectionMatrix",[356,889,884],{"class":362},[356,891,892],{"class":402}," cameraViewMatrix",[356,894,884],{"class":362},[356,896,753],{"class":402},[356,898,884],{"class":362},[356,900,901],{"class":402}," Fn",[356,903,884],{"class":362},[356,905,906],{"class":402}," hash",[356,908,884],{"class":362},[356,910,911],{"class":402}," mix",[356,913,884],{"class":362},[356,915,916],{"class":402}," normalView",[356,918,884],{"class":362},[356,920,921],{"class":402}," positionWorld",[356,923,884],{"class":362},[356,925,926],{"class":402}," sin",[356,928,884],{"class":362},[356,930,931],{"class":402}," timerGlobal",[356,933,884],{"class":362},[356,935,936],{"class":402}," uniform",[356,938,884],{"class":362},[356,940,941],{"class":402}," varying",[356,943,884],{"class":362},[356,945,946],{"class":402}," vec3",[356,948,884],{"class":362},[356,950,951],{"class":402}," vec4",[356,953,406],{"class":362},[356,955,409],{"class":395},[356,957,412],{"class":362},[356,959,960],{"class":383},"three/tsl",[356,962,418],{"class":362},[356,964,965,967,969,972,974,977,979,982,984,986,988,990],{"class":358,"line":465},[356,966,396],{"class":395},[356,968,399],{"class":362},[356,970,971],{"class":402}," AdditiveBlending",[356,973,884],{"class":362},[356,975,976],{"class":402}," DoubleSide",[356,978,884],{"class":362},[356,980,981],{"class":402}," MeshBasicNodeMaterial",[356,983,406],{"class":362},[356,985,409],{"class":395},[356,987,412],{"class":362},[356,989,437],{"class":383},[356,991,418],{"class":362},[356,993,994],{"class":358,"line":471},[356,995,468],{"emptyLinePlaceholder":39},[356,997,998,1000,1002,1005,1008,1010,1012,1014,1017,1020,1022,1024,1026,1029,1031,1033,1035],{"class":358,"line":478},[356,999,481],{"class":370},[356,1001,399],{"class":362},[356,1003,1004],{"class":402}," nodes ",[356,1006,1007],{"class":362},"}",[356,1009,520],{"class":362},[356,1011,861],{"class":526},[356,1013,529],{"class":402},[356,1015,1016],{"class":362},"'",[356,1018,1019],{"class":383},"https://raw.githubusercontent.com/Tresjs/assets/main/models/gltf/blender-cube.glb",[356,1021,1016],{"class":362},[356,1023,884],{"class":362},[356,1025,399],{"class":362},[356,1027,1028],{"class":366}," draco",[356,1030,496],{"class":362},[356,1032,575],{"class":574},[356,1034,406],{"class":362},[356,1036,598],{"class":402},[356,1038,1039],{"class":358,"line":511},[356,1040,468],{"emptyLinePlaceholder":39},[356,1042,1043,1045,1048,1050,1053,1055,1058,1060,1063,1065,1068,1070],{"class":358,"line":535},[356,1044,481],{"class":370},[356,1046,1047],{"class":402}," model ",[356,1049,377],{"class":362},[356,1051,1052],{"class":526}," computed",[356,1054,529],{"class":402},[356,1056,1057],{"class":362},"()",[356,1059,505],{"class":370},[356,1061,1062],{"class":402}," nodes",[356,1064,328],{"class":362},[356,1066,1067],{"class":402},"value",[356,1069,328],{"class":362},[356,1071,1072],{"class":402},"BlenderCube)\n",[356,1074,1075],{"class":358,"line":560},[356,1076,1077],{"class":474},"/**\n",[356,1079,1080],{"class":358,"line":566},[356,1081,1082],{"class":474},"* Material\n",[356,1084,1085],{"class":358,"line":580},[356,1086,1087],{"class":474},"*/\n",[356,1089,1090,1092,1095,1097,1099,1101,1103],{"class":358,"line":592},[356,1091,481],{"class":370},[356,1093,1094],{"class":402}," material ",[356,1096,377],{"class":362},[356,1098,523],{"class":362},[356,1100,981],{"class":526},[356,1102,529],{"class":402},[356,1104,532],{"class":362},[356,1106,1107,1110,1112,1114],{"class":358,"line":601},[356,1108,1109],{"class":366},"  transparent",[356,1111,496],{"class":362},[356,1113,575],{"class":574},[356,1115,557],{"class":362},[356,1117,1118,1121,1123,1125],{"class":358,"line":610},[356,1119,1120],{"class":366},"  side",[356,1122,496],{"class":362},[356,1124,976],{"class":402},[356,1126,557],{"class":362},[356,1128,1129,1132,1134,1137],{"class":358,"line":616},[356,1130,1131],{"class":366},"  depthWrite",[356,1133,496],{"class":362},[356,1135,1136],{"class":574}," false",[356,1138,557],{"class":362},[356,1140,1141,1144,1146,1148],{"class":358,"line":626},[356,1142,1143],{"class":366},"  blending",[356,1145,496],{"class":362},[356,1147,971],{"class":402},[356,1149,557],{"class":362},[356,1151,1152,1154],{"class":358,"line":631},[356,1153,1007],{"class":362},[356,1155,598],{"class":402},[356,1157,1158],{"class":358,"line":641},[356,1159,1160],{"class":474},"// Position\n",[356,1162,1163,1165,1168,1170,1172,1174,1177],{"class":358,"line":667},[356,1164,481],{"class":370},[356,1166,1167],{"class":402}," glitchStrength ",[356,1169,377],{"class":362},[356,1171,941],{"class":526},[356,1173,529],{"class":402},[356,1175,1176],{"class":688},"0",[356,1178,598],{"class":402},[356,1180,1181,1184,1186,1189,1191,1193,1195,1197,1199],{"class":358,"line":709},[356,1182,1183],{"class":402},"material",[356,1185,328],{"class":362},[356,1187,1188],{"class":402},"vertexNode ",[356,1190,377],{"class":362},[356,1192,901],{"class":526},[356,1194,529],{"class":402},[356,1196,1057],{"class":362},[356,1198,505],{"class":370},[356,1200,508],{"class":362},[356,1202,1203,1205,1208,1210,1212,1214,1216,1219,1221,1224,1226,1229,1231,1234,1236,1239],{"class":358,"line":745},[356,1204,514],{"class":370},[356,1206,1207],{"class":402}," glitchTime",[356,1209,520],{"class":362},[356,1211,931],{"class":526},[356,1213,1057],{"class":366},[356,1215,328],{"class":362},[356,1217,1218],{"class":526},"sub",[356,1220,529],{"class":366},[356,1222,1223],{"class":402},"positionWorld",[356,1225,328],{"class":362},[356,1227,1228],{"class":402},"y",[356,1230,328],{"class":362},[356,1232,1233],{"class":526},"mul",[356,1235,529],{"class":366},[356,1237,1238],{"class":688},"0.5",[356,1240,1241],{"class":366},"))\n",[356,1243,1244,1247,1249,1252,1254,1257],{"class":358,"line":767},[356,1245,1246],{"class":402},"  glitchStrength",[356,1248,328],{"class":362},[356,1250,1251],{"class":526},"assign",[356,1253,529],{"class":366},[356,1255,1256],{"class":526},"add",[356,1258,1259],{"class":366},"(\n",[356,1261,1262,1265,1267,1270,1272],{"class":358,"line":773},[356,1263,1264],{"class":526},"    sin",[356,1266,529],{"class":366},[356,1268,1269],{"class":402},"glitchTime",[356,1271,502],{"class":366},[356,1273,557],{"class":362},[356,1275,1276,1278,1280,1282,1284,1286,1288,1291,1294],{"class":358,"line":783},[356,1277,1264],{"class":526},[356,1279,529],{"class":366},[356,1281,1269],{"class":402},[356,1283,328],{"class":362},[356,1285,1233],{"class":526},[356,1287,529],{"class":366},[356,1289,1290],{"class":688},"3.45",[356,1292,1293],{"class":366},"))",[356,1295,557],{"class":362},[356,1297,1299,1301,1303,1305,1307,1309,1311,1314,1316],{"class":358,"line":1298},26,[356,1300,1264],{"class":526},[356,1302,529],{"class":366},[356,1304,1269],{"class":402},[356,1306,328],{"class":362},[356,1308,1233],{"class":526},[356,1310,529],{"class":366},[356,1312,1313],{"class":688},"8.76",[356,1315,1293],{"class":366},[356,1317,557],{"class":362},[356,1319,1321,1324,1326,1329,1331,1333,1335,1337,1340,1342,1345,1347,1350],{"class":358,"line":1320},27,[356,1322,1323],{"class":366},"  )",[356,1325,328],{"class":362},[356,1327,1328],{"class":526},"div",[356,1330,529],{"class":366},[356,1332,689],{"class":688},[356,1334,502],{"class":366},[356,1336,328],{"class":362},[356,1338,1339],{"class":526},"smoothstep",[356,1341,529],{"class":366},[356,1343,1344],{"class":688},"0.3",[356,1346,884],{"class":362},[356,1348,1349],{"class":688}," 1",[356,1351,1241],{"class":366},[356,1353,1355,1357,1360,1362,1364],{"class":358,"line":1354},28,[356,1356,514],{"class":370},[356,1358,1359],{"class":402}," glitch",[356,1361,520],{"class":362},[356,1363,946],{"class":526},[356,1365,1259],{"class":366},[356,1367,1369,1372,1374,1376,1378,1381,1383,1386,1388,1390,1392,1394,1397,1399,1401,1403,1405,1407,1409],{"class":358,"line":1368},29,[356,1370,1371],{"class":526},"    hash",[356,1373,529],{"class":366},[356,1375,1223],{"class":402},[356,1377,328],{"class":362},[356,1379,1380],{"class":402},"xz",[356,1382,328],{"class":362},[356,1384,1385],{"class":526},"abs",[356,1387,1057],{"class":366},[356,1389,328],{"class":362},[356,1391,1233],{"class":526},[356,1393,529],{"class":366},[356,1395,1396],{"class":688},"9999",[356,1398,1293],{"class":366},[356,1400,328],{"class":362},[356,1402,1218],{"class":526},[356,1404,529],{"class":366},[356,1406,1238],{"class":688},[356,1408,502],{"class":366},[356,1410,557],{"class":362},[356,1412,1414,1417],{"class":358,"line":1413},30,[356,1415,1416],{"class":688},"    0",[356,1418,557],{"class":362},[356,1420,1422,1424,1426,1428,1430,1433,1435,1437,1439,1441,1443,1445,1447,1449,1451,1453,1455,1457,1459],{"class":358,"line":1421},31,[356,1423,1371],{"class":526},[356,1425,529],{"class":366},[356,1427,1223],{"class":402},[356,1429,328],{"class":362},[356,1431,1432],{"class":402},"yx",[356,1434,328],{"class":362},[356,1436,1385],{"class":526},[356,1438,1057],{"class":366},[356,1440,328],{"class":362},[356,1442,1233],{"class":526},[356,1444,529],{"class":366},[356,1446,1396],{"class":688},[356,1448,1293],{"class":366},[356,1450,328],{"class":362},[356,1452,1218],{"class":526},[356,1454,529],{"class":366},[356,1456,1238],{"class":688},[356,1458,502],{"class":366},[356,1460,557],{"class":362},[356,1462,1464],{"class":358,"line":1463},32,[356,1465,1466],{"class":366},"  )\n",[356,1468,1470,1473,1475,1478,1480,1483,1485,1488,1490,1492,1494,1497,1499,1501,1503,1505],{"class":358,"line":1469},33,[356,1471,1472],{"class":402},"  positionWorld",[356,1474,328],{"class":362},[356,1476,1477],{"class":402},"xyz",[356,1479,328],{"class":362},[356,1481,1482],{"class":526},"addAssign",[356,1484,529],{"class":366},[356,1486,1487],{"class":402},"glitch",[356,1489,328],{"class":362},[356,1491,1233],{"class":526},[356,1493,529],{"class":366},[356,1495,1496],{"class":402},"glitchStrength",[356,1498,328],{"class":362},[356,1500,1233],{"class":526},[356,1502,529],{"class":366},[356,1504,1238],{"class":688},[356,1506,1507],{"class":366},")))\n",[356,1509,1511,1513,1515,1517,1519,1521,1524,1526,1528,1530,1532,1534],{"class":358,"line":1510},34,[356,1512,604],{"class":395},[356,1514,887],{"class":402},[356,1516,328],{"class":362},[356,1518,1233],{"class":526},[356,1520,529],{"class":366},[356,1522,1523],{"class":402},"cameraViewMatrix",[356,1525,502],{"class":366},[356,1527,328],{"class":362},[356,1529,1233],{"class":526},[356,1531,529],{"class":366},[356,1533,1223],{"class":402},[356,1535,598],{"class":366},[356,1537,1539,1541],{"class":358,"line":1538},35,[356,1540,1007],{"class":362},[356,1542,1543],{"class":402},")()\n",[356,1545,1547],{"class":358,"line":1546},36,[356,1548,1549],{"class":474},"// Color\n",[356,1551,1553,1555,1558,1560,1562,1564,1567,1569,1571,1574,1576],{"class":358,"line":1552},37,[356,1554,481],{"class":370},[356,1556,1557],{"class":402}," colorInside ",[356,1559,377],{"class":362},[356,1561,936],{"class":526},[356,1563,529],{"class":402},[356,1565,1566],{"class":526},"color",[356,1568,529],{"class":402},[356,1570,1016],{"class":362},[356,1572,1573],{"class":383},"#ff6088",[356,1575,1016],{"class":362},[356,1577,1241],{"class":402},[356,1579,1581,1583,1586,1588,1590,1592,1594,1596,1598,1601,1603],{"class":358,"line":1580},38,[356,1582,481],{"class":370},[356,1584,1585],{"class":402}," colorOutside ",[356,1587,377],{"class":362},[356,1589,936],{"class":526},[356,1591,529],{"class":402},[356,1593,1566],{"class":526},[356,1595,529],{"class":402},[356,1597,1016],{"class":362},[356,1599,1600],{"class":383},"#4d55ff",[356,1602,1016],{"class":362},[356,1604,1241],{"class":402},[356,1606,1608,1610,1612,1615,1617,1619,1621,1623,1625],{"class":358,"line":1607},39,[356,1609,1183],{"class":402},[356,1611,328],{"class":362},[356,1613,1614],{"class":402},"colorNode ",[356,1616,377],{"class":362},[356,1618,901],{"class":526},[356,1620,529],{"class":402},[356,1622,1057],{"class":362},[356,1624,505],{"class":370},[356,1626,508],{"class":362},[356,1628,1630,1632,1635,1637,1639,1641,1643,1645,1647,1649,1652,1654,1657,1659,1661,1663,1665,1668,1670,1672,1675,1677,1679,1681,1683,1686,1688,1690],{"class":358,"line":1629},40,[356,1631,514],{"class":370},[356,1633,1634],{"class":402}," stripes",[356,1636,520],{"class":362},[356,1638,921],{"class":402},[356,1640,328],{"class":362},[356,1642,1228],{"class":402},[356,1644,328],{"class":362},[356,1646,1218],{"class":526},[356,1648,529],{"class":366},[356,1650,1651],{"class":526},"timerGlobal",[356,1653,529],{"class":366},[356,1655,1656],{"class":688},"0.02",[356,1658,1293],{"class":366},[356,1660,328],{"class":362},[356,1662,1233],{"class":526},[356,1664,529],{"class":366},[356,1666,1667],{"class":688},"20",[356,1669,502],{"class":366},[356,1671,328],{"class":362},[356,1673,1674],{"class":526},"mod",[356,1676,529],{"class":366},[356,1678,728],{"class":688},[356,1680,502],{"class":366},[356,1682,328],{"class":362},[356,1684,1685],{"class":526},"pow",[356,1687,529],{"class":366},[356,1689,689],{"class":688},[356,1691,598],{"class":366},[356,1693,1695,1697,1700,1702,1704,1706,1709,1711,1714,1716,1718,1720,1723,1725,1727,1729,1731,1733,1735,1737,1740],{"class":358,"line":1694},41,[356,1696,514],{"class":370},[356,1698,1699],{"class":402}," fresnel",[356,1701,520],{"class":362},[356,1703,916],{"class":402},[356,1705,328],{"class":362},[356,1707,1708],{"class":526},"dot",[356,1710,529],{"class":366},[356,1712,1713],{"class":526},"vec3",[356,1715,529],{"class":366},[356,1717,1176],{"class":688},[356,1719,884],{"class":362},[356,1721,1722],{"class":688}," 0",[356,1724,884],{"class":362},[356,1726,1349],{"class":688},[356,1728,1293],{"class":366},[356,1730,328],{"class":362},[356,1732,1385],{"class":526},[356,1734,1057],{"class":366},[356,1736,328],{"class":362},[356,1738,1739],{"class":526},"oneMinus",[356,1741,1742],{"class":366},"()\n",[356,1744,1746,1748,1751,1753,1755,1757,1759,1761,1764,1766,1769],{"class":358,"line":1745},42,[356,1747,514],{"class":370},[356,1749,1750],{"class":402}," falloff",[356,1752,520],{"class":362},[356,1754,1699],{"class":402},[356,1756,328],{"class":362},[356,1758,1339],{"class":526},[356,1760,529],{"class":366},[356,1762,1763],{"class":688},"0.8",[356,1765,884],{"class":362},[356,1767,1768],{"class":688}," 0.2",[356,1770,598],{"class":366},[356,1772,1774,1776,1779,1781,1783,1785,1787,1789,1792,1794,1796,1798,1800,1802,1804,1806,1808,1811,1813,1815,1817,1819,1822],{"class":358,"line":1773},43,[356,1775,514],{"class":370},[356,1777,1778],{"class":402}," alpha",[356,1780,520],{"class":362},[356,1782,1634],{"class":402},[356,1784,328],{"class":362},[356,1786,1233],{"class":526},[356,1788,529],{"class":366},[356,1790,1791],{"class":402},"fresnel",[356,1793,502],{"class":366},[356,1795,328],{"class":362},[356,1797,1256],{"class":526},[356,1799,529],{"class":366},[356,1801,1791],{"class":402},[356,1803,328],{"class":362},[356,1805,1233],{"class":526},[356,1807,529],{"class":366},[356,1809,1810],{"class":688},"1.25",[356,1812,1293],{"class":366},[356,1814,328],{"class":362},[356,1816,1233],{"class":526},[356,1818,529],{"class":366},[356,1820,1821],{"class":402},"falloff",[356,1823,598],{"class":366},[356,1825,1827,1829,1832,1834,1836,1838,1841,1843,1846,1848,1850,1852,1854,1856,1858,1860,1862,1864,1867],{"class":358,"line":1826},44,[356,1828,514],{"class":370},[356,1830,1831],{"class":402}," finalColor",[356,1833,520],{"class":362},[356,1835,911],{"class":526},[356,1837,529],{"class":366},[356,1839,1840],{"class":402},"colorInside",[356,1842,884],{"class":362},[356,1844,1845],{"class":402}," colorOutside",[356,1847,884],{"class":362},[356,1849,1699],{"class":402},[356,1851,328],{"class":362},[356,1853,1256],{"class":526},[356,1855,529],{"class":366},[356,1857,1496],{"class":402},[356,1859,328],{"class":362},[356,1861,1233],{"class":526},[356,1863,529],{"class":366},[356,1865,1866],{"class":688},"0.6",[356,1868,1507],{"class":366},[356,1870,1872,1874,1876,1878,1881,1883,1885],{"class":358,"line":1871},45,[356,1873,604],{"class":395},[356,1875,951],{"class":526},[356,1877,529],{"class":366},[356,1879,1880],{"class":402},"finalColor",[356,1882,884],{"class":362},[356,1884,1778],{"class":402},[356,1886,598],{"class":366},[356,1888,1890,1892],{"class":358,"line":1889},46,[356,1891,1007],{"class":362},[356,1893,1543],{"class":402},[356,1895,1897],{"class":358,"line":1896},47,[356,1898,468],{"emptyLinePlaceholder":39},[356,1900,1902,1905,1908,1910,1912,1915,1917,1919],{"class":358,"line":1901},48,[356,1903,1904],{"class":526},"watch",[356,1906,1907],{"class":402},"(model",[356,1909,884],{"class":362},[356,1911,489],{"class":362},[356,1913,1914],{"class":492},"newModel",[356,1916,502],{"class":362},[356,1918,505],{"class":370},[356,1920,508],{"class":362},[356,1922,1924,1927,1929,1932,1934,1936,1939,1941,1943],{"class":358,"line":1923},49,[356,1925,1926],{"class":402},"  newModel",[356,1928,328],{"class":362},[356,1930,1931],{"class":526},"traverse",[356,1933,529],{"class":366},[356,1935,529],{"class":362},[356,1937,1938],{"class":492},"child",[356,1940,502],{"class":362},[356,1942,505],{"class":370},[356,1944,508],{"class":362},[356,1946,1948,1951,1953,1956,1958,1960,1963],{"class":358,"line":1947},50,[356,1949,1950],{"class":395},"    if",[356,1952,489],{"class":366},[356,1954,1955],{"class":526},"isMesh",[356,1957,529],{"class":366},[356,1959,1938],{"class":402},[356,1961,1962],{"class":366},")) ",[356,1964,532],{"class":362},[356,1966,1968,1971,1973,1975,1977],{"class":358,"line":1967},51,[356,1969,1970],{"class":402},"      child",[356,1972,328],{"class":362},[356,1974,1183],{"class":402},[356,1976,520],{"class":362},[356,1978,1979],{"class":402}," material\n",[356,1981,1983],{"class":358,"line":1982},52,[356,1984,1985],{"class":362},"    }\n",[356,1987,1989,1991],{"class":358,"line":1988},53,[356,1990,595],{"class":362},[356,1992,598],{"class":366},[356,1994,1996,1998],{"class":358,"line":1995},54,[356,1997,1007],{"class":362},[356,1999,598],{"class":402},[356,2001,2003,2005,2007],{"class":358,"line":2002},55,[356,2004,619],{"class":362},[356,2006,367],{"class":366},[356,2008,389],{"class":362},[356,2010,2012],{"class":358,"line":2011},56,[356,2013,468],{"emptyLinePlaceholder":39},[356,2015,2017,2019,2021],{"class":358,"line":2016},57,[356,2018,363],{"class":362},[356,2020,636],{"class":366},[356,2022,389],{"class":362},[356,2024,2026,2028,2031,2034,2036,2038,2041,2043,2045,2048,2050,2052,2054,2056],{"class":358,"line":2025},58,[356,2027,644],{"class":362},[356,2029,2030],{"class":366},"primitive",[356,2032,2033],{"class":395}," v-if",[356,2035,377],{"class":362},[356,2037,380],{"class":362},[356,2039,2040],{"class":402},"model",[356,2042,380],{"class":362},[356,2044,650],{"class":362},[356,2046,2047],{"class":370},"object",[356,2049,377],{"class":362},[356,2051,380],{"class":362},[356,2053,2040],{"class":402},[356,2055,380],{"class":362},[356,2057,706],{"class":362},[356,2059,2061,2063,2065],{"class":358,"line":2060},59,[356,2062,619],{"class":362},[356,2064,636],{"class":366},[356,2066,389],{"class":362},[346,2068,2070],{"className":348,"code":2069,"filename":806,"language":351,"meta":352,"style":352},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { WebGPURenderer } from 'three/webgpu'\nimport type { ShadowMapType, ToneMapping } from 'three'\nimport type { TresRendererSetupContext } from '@tresjs/core'\n\nimport HologramCube from './HologramCube.vue'\n\nconst createWebGPURenderer = (ctx: TresRendererSetupContext) => {\n  const renderer = new WebGPURenderer({\n    canvas: toValue(ctx.canvas),\n    // WebGPU specific configuration\n    alpha: true,\n    antialias: true,\n  })\n  return renderer\n}\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas :renderer=\"createWebGPURenderer\">\n    \u003CTresPerspectiveCamera\n      :position=\"[3, 3, 3]\"\n      :look-at=\"[0, 0, 0]\"\n    />\n    \u003CSuspense>\n      \u003CHologramCube />\n    \u003C/Suspense>\n  \u003C/TresCanvas>\n\u003C/template>\n",[337,2071,2072,2092,2110,2128,2155,2175,2179,2196,2200,2222,2238,2258,2262,2272,2282,2288,2294,2298,2306,2310,2318,2338,2345,2373,2400,2405,2414,2424,2433,2441],{"__ignoreMap":352},[356,2073,2074,2076,2078,2080,2082,2084,2086,2088,2090],{"class":358,"line":359},[356,2075,363],{"class":362},[356,2077,367],{"class":366},[356,2079,371],{"class":370},[356,2081,374],{"class":370},[356,2083,377],{"class":362},[356,2085,380],{"class":362},[356,2087,384],{"class":383},[356,2089,380],{"class":362},[356,2091,389],{"class":362},[356,2093,2094,2096,2098,2100,2102,2104,2106,2108],{"class":358,"line":392},[356,2095,396],{"class":395},[356,2097,399],{"class":362},[356,2099,403],{"class":402},[356,2101,406],{"class":362},[356,2103,409],{"class":395},[356,2105,412],{"class":362},[356,2107,415],{"class":383},[356,2109,418],{"class":362},[356,2111,2112,2114,2116,2118,2120,2122,2124,2126],{"class":358,"line":421},[356,2113,396],{"class":395},[356,2115,399],{"class":362},[356,2117,428],{"class":402},[356,2119,406],{"class":362},[356,2121,409],{"class":395},[356,2123,412],{"class":362},[356,2125,437],{"class":383},[356,2127,418],{"class":362},[356,2129,2130,2132,2134,2136,2139,2141,2144,2146,2148,2150,2153],{"class":358,"line":442},[356,2131,396],{"class":395},[356,2133,447],{"class":395},[356,2135,399],{"class":362},[356,2137,2138],{"class":402}," ShadowMapType",[356,2140,884],{"class":362},[356,2142,2143],{"class":402}," ToneMapping",[356,2145,406],{"class":362},[356,2147,409],{"class":395},[356,2149,412],{"class":362},[356,2151,2152],{"class":383},"three",[356,2154,418],{"class":362},[356,2156,2157,2159,2161,2163,2165,2167,2169,2171,2173],{"class":358,"line":465},[356,2158,396],{"class":395},[356,2160,447],{"class":395},[356,2162,399],{"class":362},[356,2164,452],{"class":402},[356,2166,406],{"class":362},[356,2168,409],{"class":395},[356,2170,412],{"class":362},[356,2172,415],{"class":383},[356,2174,418],{"class":362},[356,2176,2177],{"class":358,"line":471},[356,2178,468],{"emptyLinePlaceholder":39},[356,2180,2181,2183,2186,2189,2191,2194],{"class":358,"line":478},[356,2182,396],{"class":395},[356,2184,2185],{"class":402}," HologramCube ",[356,2187,2188],{"class":395},"from",[356,2190,412],{"class":362},[356,2192,2193],{"class":383},"./HologramCube.vue",[356,2195,418],{"class":362},[356,2197,2198],{"class":358,"line":511},[356,2199,468],{"emptyLinePlaceholder":39},[356,2201,2202,2204,2206,2208,2210,2212,2214,2216,2218,2220],{"class":358,"line":535},[356,2203,481],{"class":370},[356,2205,484],{"class":402},[356,2207,377],{"class":362},[356,2209,489],{"class":362},[356,2211,493],{"class":492},[356,2213,496],{"class":362},[356,2215,452],{"class":499},[356,2217,502],{"class":362},[356,2219,505],{"class":370},[356,2221,508],{"class":362},[356,2223,2224,2226,2228,2230,2232,2234,2236],{"class":358,"line":560},[356,2225,514],{"class":370},[356,2227,517],{"class":402},[356,2229,520],{"class":362},[356,2231,523],{"class":362},[356,2233,428],{"class":526},[356,2235,529],{"class":366},[356,2237,532],{"class":362},[356,2239,2240,2242,2244,2246,2248,2250,2252,2254,2256],{"class":358,"line":566},[356,2241,538],{"class":366},[356,2243,496],{"class":362},[356,2245,543],{"class":526},[356,2247,529],{"class":366},[356,2249,493],{"class":402},[356,2251,328],{"class":362},[356,2253,552],{"class":402},[356,2255,502],{"class":366},[356,2257,557],{"class":362},[356,2259,2260],{"class":358,"line":580},[356,2261,563],{"class":474},[356,2263,2264,2266,2268,2270],{"class":358,"line":592},[356,2265,569],{"class":366},[356,2267,496],{"class":362},[356,2269,575],{"class":574},[356,2271,557],{"class":362},[356,2273,2274,2276,2278,2280],{"class":358,"line":601},[356,2275,583],{"class":366},[356,2277,496],{"class":362},[356,2279,575],{"class":574},[356,2281,557],{"class":362},[356,2283,2284,2286],{"class":358,"line":610},[356,2285,595],{"class":362},[356,2287,598],{"class":366},[356,2289,2290,2292],{"class":358,"line":616},[356,2291,604],{"class":395},[356,2293,607],{"class":402},[356,2295,2296],{"class":358,"line":626},[356,2297,613],{"class":362},[356,2299,2300,2302,2304],{"class":358,"line":631},[356,2301,619],{"class":362},[356,2303,367],{"class":366},[356,2305,389],{"class":362},[356,2307,2308],{"class":358,"line":641},[356,2309,468],{"emptyLinePlaceholder":39},[356,2311,2312,2314,2316],{"class":358,"line":667},[356,2313,363],{"class":362},[356,2315,636],{"class":366},[356,2317,389],{"class":362},[356,2319,2320,2322,2324,2326,2328,2330,2332,2334,2336],{"class":358,"line":709},[356,2321,644],{"class":362},[356,2323,647],{"class":366},[356,2325,650],{"class":362},[356,2327,653],{"class":370},[356,2329,377],{"class":362},[356,2331,380],{"class":362},[356,2333,660],{"class":402},[356,2335,380],{"class":362},[356,2337,389],{"class":362},[356,2339,2340,2342],{"class":358,"line":745},[356,2341,670],{"class":362},[356,2343,2344],{"class":366},"TresPerspectiveCamera\n",[356,2346,2347,2350,2352,2354,2356,2358,2360,2362,2364,2366,2368,2370],{"class":358,"line":767},[356,2348,2349],{"class":362},"      :",[356,2351,678],{"class":370},[356,2353,377],{"class":362},[356,2355,380],{"class":362},[356,2357,685],{"class":362},[356,2359,689],{"class":688},[356,2361,692],{"class":362},[356,2363,689],{"class":688},[356,2365,692],{"class":362},[356,2367,689],{"class":688},[356,2369,701],{"class":362},[356,2371,2372],{"class":362},"\"\n",[356,2374,2375,2377,2380,2382,2384,2386,2388,2390,2392,2394,2396,2398],{"class":358,"line":773},[356,2376,2349],{"class":362},[356,2378,2379],{"class":370},"look-at",[356,2381,377],{"class":362},[356,2383,380],{"class":362},[356,2385,685],{"class":362},[356,2387,1176],{"class":688},[356,2389,692],{"class":362},[356,2391,1176],{"class":688},[356,2393,692],{"class":362},[356,2395,1176],{"class":688},[356,2397,701],{"class":362},[356,2399,2372],{"class":362},[356,2401,2402],{"class":358,"line":783},[356,2403,2404],{"class":362},"    />\n",[356,2406,2407,2409,2412],{"class":358,"line":1298},[356,2408,670],{"class":362},[356,2410,2411],{"class":366},"Suspense",[356,2413,389],{"class":362},[356,2415,2416,2419,2422],{"class":358,"line":1320},[356,2417,2418],{"class":362},"      \u003C",[356,2420,2421],{"class":366},"HologramCube",[356,2423,706],{"class":362},[356,2425,2426,2429,2431],{"class":358,"line":1354},[356,2427,2428],{"class":362},"    \u003C/",[356,2430,2411],{"class":366},[356,2432,389],{"class":362},[356,2434,2435,2437,2439],{"class":358,"line":1368},[356,2436,776],{"class":362},[356,2438,647],{"class":366},[356,2440,389],{"class":362},[356,2442,2443,2445,2447],{"class":358,"line":1413},[356,2444,619],{"class":362},[356,2446,636],{"class":366},[356,2448,389],{"class":362},[2450,2451,2452],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}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}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}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);}",{"title":352,"searchDepth":359,"depth":392,"links":2454},[2455,2459],{"id":230,"depth":392,"text":231,"children":2456},[2457,2458],{"id":244,"depth":421,"text":247},{"id":284,"depth":421,"text":287},{"id":331,"depth":392,"text":332,"children":2460},[2461,2462],{"id":343,"depth":421,"text":344},{"id":792,"depth":421,"text":793},"Explore experimental WebGPU rendering capabilities in TresJS.","md",null,{},{"title":146,"description":2463},"ctrwX0M4tZQcHdLVAt5GlV-c-0F_0P7NRTK92byfbko",[2470,2472],{"title":142,"path":143,"stem":144,"description":2471,"children":-1},"Use the primitive component to directly integrate any Three.js object within your Vue application.",{"title":155,"path":151,"stem":156,"description":2473,"children":-1},"Discover guided recipes to help you get started with the basics of using Tres. Each recipe is designed to help you understand the core concepts of Tres and how to use them in your projects.",1768600247879]