{"code":"var Component=(()=>{var E=Object.create;var n=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var y=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var m=(h,s)=>()=>(s||h((s={exports:{}}).exports,s),s.exports),C=(h,s)=>{for(var l in s)n(h,l,{get:s[l],enumerable:!0})},k=(h,s,l,a)=>{if(s&&typeof s==\"object\"||typeof s==\"function\")for(let e of g(s))!F.call(h,e)&&e!==l&&n(h,e,{get:()=>s[e],enumerable:!(a=p(s,e))||a.enumerable});return h};var o=(h,s,l)=>(l=h!=null?E(y(h)):{},k(s||!h||!h.__esModule?n(l,\"default\",{value:h,enumerable:!0}):l,h)),A=h=>k(n({},\"__esModule\",{value:!0}),h);var d=m((D,r)=>{r.exports=_jsx_runtime});var N={};C(N,{default:()=>c});var i=o(d());function t(h){let s={a:\"a\",code:\"code\",em:\"em\",h1:\"h1\",h2:\"h2\",h3:\"h3\",h4:\"h4\",hr:\"hr\",li:\"li\",ol:\"ol\",p:\"p\",pre:\"pre\",span:\"span\",strong:\"strong\",table:\"table\",tbody:\"tbody\",td:\"td\",th:\"th\",thead:\"thead\",tr:\"tr\",ul:\"ul\",...h.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(s.h1,{id:\"liquid-glass-vs-css-backdrop-filter-\\uC131\\uB2A5-\\uBD84\\uC11D\",children:\"Liquid Glass vs CSS backdrop-filter: \\uC131\\uB2A5 \\uBD84\\uC11D\"}),`\n`,(0,i.jsxs)(s.p,{children:[\"\\uD604\\uB300 \\uC6F9 \\uC560\\uD50C\\uB9AC\\uCF00\\uC774\\uC158\\uC5D0\\uC11C \\uAE00\\uB798\\uC2A4\\uBAA8\\uD53C\\uC998 \\uD6A8\\uACFC\\uB97C \\uAD6C\\uD604\\uD560 \\uB54C, \\uAC1C\\uBC1C\\uC790\\uB4E4\\uC740 \\uC911\\uC694\\uD55C \\uACB0\\uC815\\uC5D0 \\uC9C1\\uBA74\\uD569\\uB2C8\\uB2E4: CSS \",(0,i.jsx)(s.code,{children:\"backdrop-filter\"}),\"\\uB97C \\uC0AC\\uC6A9\\uD560 \\uAC83\\uC778\\uAC00, \\uC544\\uB2C8\\uBA74 liquid-glass-react\\uC640 \\uAC19\\uC740 WebGL \\uAE30\\uBC18 \\uC194\\uB8E8\\uC158\\uC744 \\uCC44\\uD0DD\\uD560 \\uAC83\\uC778\\uAC00? \\uC774 \\uC885\\uD569 \\uBD84\\uC11D\\uC740 \\uC131\\uB2A5, \\uD638\\uD658\\uC131, \\uAD6C\\uD604 \\uBCF5\\uC7A1\\uC131 \\uBA54\\uD2B8\\uB9AD\\uC5D0\\uC11C \\uB450 \\uC811\\uADFC\\uBC95\\uC744 \\uBE44\\uAD50\\uD569\\uB2C8\\uB2E4.\"]}),`\n`,(0,i.jsx)(s.h2,{id:\"\\uC131\\uB2A5-\\uBCA4\\uCE58\\uB9C8\\uD06C\",children:\"\\uC131\\uB2A5 \\uBCA4\\uCE58\\uB9C8\\uD06C\"}),`\n`,(0,i.jsx)(s.h3,{id:\"cpu-\\uC0AC\\uC6A9\\uB7C9-\\uBE44\\uAD50\",children:\"CPU \\uC0AC\\uC6A9\\uB7C9 \\uBE44\\uAD50\"}),`\n`,(0,i.jsx)(s.p,{children:\"\\uB2E4\\uC591\\uD55C \\uAE30\\uAE30\\uC5D0\\uC11C\\uC758 \\uD14C\\uC2A4\\uD2B8 \\uACB0\\uACFC \\uC0C1\\uB2F9\\uD55C \\uC131\\uB2A5 \\uCC28\\uC774\\uAC00 \\uB098\\uD0C0\\uB0AC\\uC2B5\\uB2C8\\uB2E4:\"}),`\n`,(0,i.jsxs)(s.table,{children:[(0,i.jsx)(s.thead,{children:(0,i.jsxs)(s.tr,{children:[(0,i.jsx)(s.th,{children:\"\\uAE30\\uAE30 \\uC720\\uD615\"}),(0,i.jsx)(s.th,{children:\"CSS backdrop-filter\"}),(0,i.jsx)(s.th,{children:\"Liquid Glass React\"}),(0,i.jsx)(s.th,{children:\"\\uC131\\uB2A5 \\uD5A5\\uC0C1\"})]})}),(0,i.jsxs)(s.tbody,{children:[(0,i.jsxs)(s.tr,{children:[(0,i.jsx)(s.td,{children:\"MacBook Pro M2\"}),(0,i.jsx)(s.td,{children:\"15-25% CPU\"}),(0,i.jsx)(s.td,{children:\"8-12% CPU\"}),(0,i.jsx)(s.td,{children:\"60% \\uAC1C\\uC120\"})]}),(0,i.jsxs)(s.tr,{children:[(0,i.jsx)(s.td,{children:\"iPad Pro\"}),(0,i.jsx)(s.td,{children:\"20-30% CPU\"}),(0,i.jsx)(s.td,{children:\"10-15% CPU\"}),(0,i.jsx)(s.td,{children:\"50% \\uAC1C\\uC120\"})]}),(0,i.jsxs)(s.tr,{children:[(0,i.jsx)(s.td,{children:\"iPhone 14\"}),(0,i.jsx)(s.td,{children:\"25-40% CPU\"}),(0,i.jsx)(s.td,{children:\"12-18% CPU\"}),(0,i.jsx)(s.td,{children:\"55% \\uAC1C\\uC120\"})]}),(0,i.jsxs)(s.tr,{children:[(0,i.jsx)(s.td,{children:\"Windows \\uB178\\uD2B8\\uBD81\"}),(0,i.jsx)(s.td,{children:\"30-45% CPU\"}),(0,i.jsx)(s.td,{children:\"15-25% CPU\"}),(0,i.jsx)(s.td,{children:\"44% \\uAC1C\\uC120\"})]})]})]}),`\n`,(0,i.jsx)(s.h3,{id:\"\\uD504\\uB808\\uC784-\\uC18D\\uB3C4-\\uBD84\\uC11D\",children:\"\\uD504\\uB808\\uC784 \\uC18D\\uB3C4 \\uBD84\\uC11D\"}),`\n`,(0,i.jsx)(s.p,{children:\"WebGL \\uAE30\\uBC18 Liquid Glass\\uB294 \\uC77C\\uAD00\\uB418\\uAC8C \\uB354 \\uB192\\uC740 \\uD504\\uB808\\uC784 \\uC18D\\uB3C4\\uB97C \\uC720\\uC9C0\\uD569\\uB2C8\\uB2E4:\"}),`\n`,(0,i.jsx)(i.Fragment,{children:(0,i.jsx)(s.pre,{className:\"shiki shiki-themes github-light github-dark\",style:{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},tabIndex:\"0\",icon:'<svg viewBox=\"0 0 24 24\"><path d=\"M0 0h24v24H0V0zm22.034 18.276c-.175-1.095-.888-2.015-3.003-2.873-.736-.345-1.554-.585-1.797-1.14-.091-.33-.105-.51-.046-.705.15-.646.915-.84 1.515-.66.39.12.75.42.976.9 1.034-.676 1.034-.676 1.755-1.125-.27-.42-.404-.601-.586-.78-.63-.705-1.469-1.065-2.834-1.034l-.705.089c-.676.165-1.32.525-1.71 1.005-1.14 1.291-.811 3.541.569 4.471 1.365 1.02 3.361 1.244 3.616 2.205.24 1.17-.87 1.545-1.966 1.41-.811-.18-1.26-.586-1.755-1.336l-1.83 1.051c.21.48.45.689.81 1.109 1.74 1.756 6.09 1.666 6.871-1.004.029-.09.24-.705.074-1.65l.046.067zm-8.983-7.245h-2.248c0 1.938-.009 3.864-.009 5.805 0 1.232.063 2.363-.138 2.711-.33.689-1.18.601-1.566.48-.396-.196-.597-.466-.83-.855-.063-.105-.11-.196-.127-.196l-1.825 1.125c.305.63.75 1.172 1.324 1.517.855.51 2.004.675 3.207.405.783-.226 1.458-.691 1.811-1.411.51-.93.402-2.07.397-3.346.012-2.054 0-4.109 0-6.179l.004-.056z\" fill=\"currentColor\" /></svg>',children:(0,i.jsxs)(s.code,{children:[(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"// \\uC131\\uB2A5 \\uBAA8\\uB2C8\\uD130\\uB9C1 \\uAD6C\\uD604\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" performanceMonitor\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  fps: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"0\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\",\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  lastTime: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"0\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\",\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  frameCount: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"0\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\",\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  \"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"  measureFPS\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"() {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" now\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" performance.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"now\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"();\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"    this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".frameCount\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"++\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\";\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    \"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    if\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (now \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\">=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".lastTime \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"+\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" 1000\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\") {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"      this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".fps \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" Math.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"round\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"((\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".frameCount \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"*\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" 1000\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\") \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"/\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (now \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"-\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".lastTime));\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"      this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".frameCount \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" 0\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\";\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"      this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".lastTime \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" now;\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    }\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    \"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"    requestAnimationFrame\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(() \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=>\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"measureFPS\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"());\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  }\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"};\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\"}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"// \\uACB0\\uACFC:\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"// CSS backdrop-filter: 30-45 FPS\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"// Liquid Glass React: 55-60 FPS\"})})]})})}),`\n`,(0,i.jsx)(s.h2,{id:\"\\uBE0C\\uB77C\\uC6B0\\uC800-\\uD638\\uD658\\uC131-\\uB9E4\\uD2B8\\uB9AD\\uC2A4\",children:\"\\uBE0C\\uB77C\\uC6B0\\uC800 \\uD638\\uD658\\uC131 \\uB9E4\\uD2B8\\uB9AD\\uC2A4\"}),`\n`,(0,i.jsx)(s.h3,{id:\"css-backdrop-filter-\\uC9C0\\uC6D0\",children:\"CSS backdrop-filter \\uC9C0\\uC6D0\"}),`\n`,(0,i.jsx)(i.Fragment,{children:(0,i.jsx)(s.pre,{className:\"shiki shiki-themes github-light github-dark\",style:{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},tabIndex:\"0\",icon:'<svg viewBox=\"0 0 24 24\"><path d=\"M 6,1 C 4.354992,1 3,2.354992 3,4 v 16 c 0,1.645008 1.354992,3 3,3 h 12 c 1.645008,0 3,-1.354992 3,-3 V 8 7 A 1.0001,1.0001 0 0 0 20.707031,6.2929687 l -5,-5 A 1.0001,1.0001 0 0 0 15,1 h -1 z m 0,2 h 7 v 3 c 0,1.645008 1.354992,3 3,3 h 3 v 11 c 0,0.564129 -0.435871,1 -1,1 H 6 C 5.4358712,21 5,20.564129 5,20 V 4 C 5,3.4358712 5.4358712,3 6,3 Z M 15,3.4140625 18.585937,7 H 16 C 15.435871,7 15,6.5641288 15,6 Z\" fill=\"currentColor\" /></svg>',children:(0,i.jsxs)(s.code,{children:[(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"/* \\uC81C\\uD55C\\uB41C \\uBE0C\\uB77C\\uC6B0\\uC800 \\uC9C0\\uC6D0 */\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\".glass-effect\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"  backdrop-filter\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\": \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"blur\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"20\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"px\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\") \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"saturate\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"180\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"%\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\");\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"  -webkit-backdrop-filter\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\": \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"blur\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"20\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"px\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\") \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"saturate\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"180\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"%\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\");\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"}\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\"}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"/* 2025\\uB144 \\uD604\\uC7AC \\uBE0C\\uB77C\\uC6B0\\uC800 \\uC9C0\\uC6D0:\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"   \\u2705 Safari 14+\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"   \\u2705 Chrome 76+\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"   \\u2705 Firefox 103+\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"   \\u274C Internet Explorer (\\uBAA8\\uB4E0 \\uBC84\\uC804)\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"   \\u26A0\\uFE0F  Edge (Chromium \\uC774\\uC804 \\uBD80\\uBD84 \\uC9C0\\uC6D0)\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"*/\"})})]})})}),`\n`,(0,i.jsx)(s.h3,{id:\"webgl-\\uC9C0\\uC6D0-liquid-glass-react\",children:\"WebGL \\uC9C0\\uC6D0 (Liquid Glass React)\"}),`\n`,(0,i.jsx)(i.Fragment,{children:(0,i.jsx)(s.pre,{className:\"shiki shiki-themes github-light github-dark\",style:{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},tabIndex:\"0\",icon:'<svg viewBox=\"0 0 24 24\"><path d=\"M1.125 0C.502 0 0 .502 0 1.125v21.75C0 23.498.502 24 1.125 24h21.75c.623 0 1.125-.502 1.125-1.125V1.125C24 .502 23.498 0 22.875 0zm17.363 9.75c.612 0 1.154.037 1.627.111a6.38 6.38 0 0 1 1.306.34v2.458a3.95 3.95 0 0 0-.643-.361 5.093 5.093 0 0 0-.717-.26 5.453 5.453 0 0 0-1.426-.2c-.3 0-.573.028-.819.086a2.1 2.1 0 0 0-.623.242c-.17.104-.3.229-.393.374a.888.888 0 0 0-.14.49c0 .196.053.373.156.529.104.156.252.304.443.444s.423.276.696.41c.273.135.582.274.926.416.47.197.892.407 1.266.628.374.222.695.473.963.753.268.279.472.598.614.957.142.359.214.776.214 1.253 0 .657-.125 1.21-.373 1.656a3.033 3.033 0 0 1-1.012 1.085 4.38 4.38 0 0 1-1.487.596c-.566.12-1.163.18-1.79.18a9.916 9.916 0 0 1-1.84-.164 5.544 5.544 0 0 1-1.512-.493v-2.63a5.033 5.033 0 0 0 3.237 1.2c.333 0 .624-.03.872-.09.249-.06.456-.144.623-.25.166-.108.29-.234.373-.38a1.023 1.023 0 0 0-.074-1.089 2.12 2.12 0 0 0-.537-.5 5.597 5.597 0 0 0-.807-.444 27.72 27.72 0 0 0-1.007-.436c-.918-.383-1.602-.852-2.053-1.405-.45-.553-.676-1.222-.676-2.005 0-.614.123-1.141.369-1.582.246-.441.58-.804 1.004-1.089a4.494 4.494 0 0 1 1.47-.629 7.536 7.536 0 0 1 1.77-.201zm-15.113.188h9.563v2.166H9.506v9.646H6.789v-9.646H3.375z\" fill=\"currentColor\" /></svg>',children:(0,i.jsxs)(s.code,{children:[(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"// \\uC885\\uD569\\uC801\\uC778 WebGL \\uAC10\\uC9C0\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" detectWebGLSupport\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" ()\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\":\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" WebGLCapabilities\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =>\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  if\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"typeof\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" window \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"===\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\" 'undefined'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\") {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    return\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" { supported: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"false\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\", version: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"null\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" };\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  }\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\"}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  try\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" canvas\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" document.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"createElement\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\"'canvas'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\");\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" gl\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" canvas.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"getContext\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\"'webgl2'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\") \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"||\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" canvas.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"getContext\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\"'webgl'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\");\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    \"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    if\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"!\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"gl) {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"      return\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" { supported: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"false\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\", version: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"null\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" };\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    }\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\"}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" debugInfo\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" gl.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"getExtension\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\"'WEBGL_debug_renderer_info'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\");\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" renderer\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" debugInfo \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"?\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" \"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      gl.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"getParameter\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(debugInfo.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"UNMASKED_RENDERER_WEBGL\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\") \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\":\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\" 'Unknown'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\";\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\"}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    return\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      supported: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"true\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\",\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      version: gl \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"instanceof\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" WebGL2RenderingContext\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" ?\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" 2\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" :\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" 1\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\",\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      renderer,\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      maxTextureSize: gl.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"getParameter\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(gl.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"MAX_TEXTURE_SIZE\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"),\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      maxRenderbufferSize: gl.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"getParameter\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(gl.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"MAX_RENDERBUFFER_SIZE\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\")\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    };\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  } \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"catch\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (error) {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    return\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" { supported: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"false\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\", version: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"null\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\", error: error.message };\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  }\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"};\"})})]})})}),`\n`,(0,i.jsx)(s.h2,{id:\"\\uAD6C\\uD604-\\uC804\\uB7B5\",children:\"\\uAD6C\\uD604 \\uC804\\uB7B5\"}),`\n`,(0,i.jsx)(s.h3,{id:\"\\uC810\\uC9C4\\uC801-\\uD5A5\\uC0C1-\\uC811\\uADFC\\uBC95\",children:\"\\uC810\\uC9C4\\uC801 \\uD5A5\\uC0C1 \\uC811\\uADFC\\uBC95\"}),`\n`,(0,i.jsx)(i.Fragment,{children:(0,i.jsx)(s.pre,{className:\"shiki shiki-themes github-light github-dark\",style:{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},tabIndex:\"0\",icon:'<svg viewBox=\"0 0 24 24\"><path d=\"M14.23 12.004a2.236 2.236 0 0 1-2.235 2.236 2.236 2.236 0 0 1-2.236-2.236 2.236 2.236 0 0 1 2.235-2.236 2.236 2.236 0 0 1 2.236 2.236zm2.648-10.69c-1.346 0-3.107.96-4.888 2.622-1.78-1.653-3.542-2.602-4.887-2.602-.41 0-.783.093-1.106.278-1.375.793-1.683 3.264-.973 6.365C1.98 8.917 0 10.42 0 12.004c0 1.59 1.99 3.097 5.043 4.03-.704 3.113-.39 5.588.988 6.38.32.187.69.275 1.102.275 1.345 0 3.107-.96 4.888-2.624 1.78 1.654 3.542 2.603 4.887 2.603.41 0 .783-.09 1.106-.275 1.374-.792 1.683-3.263.973-6.365C22.02 15.096 24 13.59 24 12.004c0-1.59-1.99-3.097-5.043-4.032.704-3.11.39-5.587-.988-6.38-.318-.184-.688-.277-1.092-.278zm-.005 1.09v.006c.225 0 .406.044.558.127.666.382.955 1.835.73 3.704-.054.46-.142.945-.25 1.44-.96-.236-2.006-.417-3.107-.534-.66-.905-1.345-1.727-2.035-2.447 1.592-1.48 3.087-2.292 4.105-2.295zm-9.77.02c1.012 0 2.514.808 4.11 2.28-.686.72-1.37 1.537-2.02 2.442-1.107.117-2.154.298-3.113.538-.112-.49-.195-.964-.254-1.42-.23-1.868.054-3.32.714-3.707.19-.09.4-.127.563-.132zm4.882 3.05c.455.468.91.992 1.36 1.564-.44-.02-.89-.034-1.345-.034-.46 0-.915.01-1.36.034.44-.572.895-1.096 1.345-1.565zM12 8.1c.74 0 1.477.034 2.202.093.406.582.802 1.203 1.183 1.86.372.64.71 1.29 1.018 1.946-.308.655-.646 1.31-1.013 1.95-.38.66-.773 1.288-1.18 1.87-.728.063-1.466.098-2.21.098-.74 0-1.477-.035-2.202-.093-.406-.582-.802-1.204-1.183-1.86-.372-.64-.71-1.29-1.018-1.946.303-.657.646-1.313 1.013-1.954.38-.66.773-1.286 1.18-1.868.728-.064 1.466-.098 2.21-.098zm-3.635.254c-.24.377-.48.763-.704 1.16-.225.39-.435.782-.635 1.174-.265-.656-.49-1.31-.676-1.947.64-.15 1.315-.283 2.015-.386zm7.26 0c.695.103 1.365.23 2.006.387-.18.632-.405 1.282-.66 1.933-.2-.39-.41-.783-.64-1.174-.225-.392-.465-.774-.705-1.146zm3.063.675c.484.15.944.317 1.375.498 1.732.74 2.852 1.708 2.852 2.476-.005.768-1.125 1.74-2.857 2.475-.42.18-.88.342-1.355.493-.28-.958-.646-1.956-1.1-2.98.45-1.017.81-2.01 1.085-2.964zm-13.395.004c.278.96.645 1.957 1.1 2.98-.45 1.017-.812 2.01-1.086 2.964-.484-.15-.944-.318-1.37-.5-1.732-.737-2.852-1.706-2.852-2.474 0-.768 1.12-1.742 2.852-2.476.42-.18.88-.342 1.356-.494zm11.678 4.28c.265.657.49 1.312.676 1.948-.64.157-1.316.29-2.016.39.24-.375.48-.762.705-1.158.225-.39.435-.788.636-1.18zm-9.945.02c.2.392.41.783.64 1.175.23.39.465.772.705 1.143-.695-.102-1.365-.23-2.006-.386.18-.63.406-1.282.66-1.933zM17.92 16.32c.112.493.2.968.254 1.423.23 1.868-.054 3.32-.714 3.708-.147.09-.338.128-.563.128-1.012 0-2.514-.807-4.11-2.28.686-.72 1.37-1.536 2.02-2.44 1.107-.118 2.154-.3 3.113-.54zm-11.83.01c.96.234 2.006.415 3.107.532.66.905 1.345 1.727 2.035 2.446-1.595 1.483-3.092 2.295-4.11 2.295-.22-.005-.406-.05-.553-.132-.666-.38-.955-1.834-.73-3.703.054-.46.142-.944.25-1.438zm4.56.64c.44.02.89.034 1.345.034.46 0 .915-.01 1.36-.034-.44.572-.895 1.095-1.345 1.565-.455-.47-.91-.993-1.36-1.565z\" fill=\"currentColor\" /></svg>',children:(0,i.jsxs)(s.code,{children:[(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"// \\uC9C0\\uB2A5\\uC801\\uC778 \\uD3F4\\uBC31 \\uC2DC\\uC2A4\\uD15C\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"import\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" { ConditionalLiquidGlass } \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"from\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\" '@/components/shared/conditional-liquid-glass'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\";\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\"}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" GlassMorphismCard\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" ({ \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\"children\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\", \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\"className\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\", \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"...\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\"props\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" }) \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=>\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  return\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    <\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"ConditionalLiquidGlass\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"      displacementScale\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"{\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"2.0\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"}\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"      blurAmount\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"{\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"1.5\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"}\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"      elasticity\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"{\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"0.8\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"}\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"      cornerRadius\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"{\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"16\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"}\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"      className\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"{className}\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"      fallback\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"{\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"        <\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#22863A\",\"--shiki-dark\":\"#85E89D\"},children:\"div\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" className\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"{\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\"`${\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"className\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\"} bg-white/10 backdrop-blur-lg border border-white/20`\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"}>\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"          {children}\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"        </\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#22863A\",\"--shiki-dark\":\"#85E89D\"},children:\"div\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\">\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      }\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      {\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"...\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"props}\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    >\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      {children}\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    </\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"ConditionalLiquidGlass\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\">\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  );\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"};\"})})]})})}),`\n`,(0,i.jsx)(s.h3,{id:\"\\uC131\\uB2A5-\\uCD5C\\uC801\\uD654-\\uAE30\\uBC95\",children:\"\\uC131\\uB2A5 \\uCD5C\\uC801\\uD654 \\uAE30\\uBC95\"}),`\n`,(0,i.jsx)(s.h4,{id:\"1-\\uC9C0\\uC5F0-\\uB85C\\uB529-\\uAD6C\\uD604\",children:\"1. \\uC9C0\\uC5F0 \\uB85C\\uB529 \\uAD6C\\uD604\"}),`\n`,(0,i.jsx)(i.Fragment,{children:(0,i.jsx)(s.pre,{className:\"shiki shiki-themes github-light github-dark\",style:{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},tabIndex:\"0\",icon:'<svg viewBox=\"0 0 24 24\"><path d=\"M14.23 12.004a2.236 2.236 0 0 1-2.235 2.236 2.236 2.236 0 0 1-2.236-2.236 2.236 2.236 0 0 1 2.235-2.236 2.236 2.236 0 0 1 2.236 2.236zm2.648-10.69c-1.346 0-3.107.96-4.888 2.622-1.78-1.653-3.542-2.602-4.887-2.602-.41 0-.783.093-1.106.278-1.375.793-1.683 3.264-.973 6.365C1.98 8.917 0 10.42 0 12.004c0 1.59 1.99 3.097 5.043 4.03-.704 3.113-.39 5.588.988 6.38.32.187.69.275 1.102.275 1.345 0 3.107-.96 4.888-2.624 1.78 1.654 3.542 2.603 4.887 2.603.41 0 .783-.09 1.106-.275 1.374-.792 1.683-3.263.973-6.365C22.02 15.096 24 13.59 24 12.004c0-1.59-1.99-3.097-5.043-4.032.704-3.11.39-5.587-.988-6.38-.318-.184-.688-.277-1.092-.278zm-.005 1.09v.006c.225 0 .406.044.558.127.666.382.955 1.835.73 3.704-.054.46-.142.945-.25 1.44-.96-.236-2.006-.417-3.107-.534-.66-.905-1.345-1.727-2.035-2.447 1.592-1.48 3.087-2.292 4.105-2.295zm-9.77.02c1.012 0 2.514.808 4.11 2.28-.686.72-1.37 1.537-2.02 2.442-1.107.117-2.154.298-3.113.538-.112-.49-.195-.964-.254-1.42-.23-1.868.054-3.32.714-3.707.19-.09.4-.127.563-.132zm4.882 3.05c.455.468.91.992 1.36 1.564-.44-.02-.89-.034-1.345-.034-.46 0-.915.01-1.36.034.44-.572.895-1.096 1.345-1.565zM12 8.1c.74 0 1.477.034 2.202.093.406.582.802 1.203 1.183 1.86.372.64.71 1.29 1.018 1.946-.308.655-.646 1.31-1.013 1.95-.38.66-.773 1.288-1.18 1.87-.728.063-1.466.098-2.21.098-.74 0-1.477-.035-2.202-.093-.406-.582-.802-1.204-1.183-1.86-.372-.64-.71-1.29-1.018-1.946.303-.657.646-1.313 1.013-1.954.38-.66.773-1.286 1.18-1.868.728-.064 1.466-.098 2.21-.098zm-3.635.254c-.24.377-.48.763-.704 1.16-.225.39-.435.782-.635 1.174-.265-.656-.49-1.31-.676-1.947.64-.15 1.315-.283 2.015-.386zm7.26 0c.695.103 1.365.23 2.006.387-.18.632-.405 1.282-.66 1.933-.2-.39-.41-.783-.64-1.174-.225-.392-.465-.774-.705-1.146zm3.063.675c.484.15.944.317 1.375.498 1.732.74 2.852 1.708 2.852 2.476-.005.768-1.125 1.74-2.857 2.475-.42.18-.88.342-1.355.493-.28-.958-.646-1.956-1.1-2.98.45-1.017.81-2.01 1.085-2.964zm-13.395.004c.278.96.645 1.957 1.1 2.98-.45 1.017-.812 2.01-1.086 2.964-.484-.15-.944-.318-1.37-.5-1.732-.737-2.852-1.706-2.852-2.474 0-.768 1.12-1.742 2.852-2.476.42-.18.88-.342 1.356-.494zm11.678 4.28c.265.657.49 1.312.676 1.948-.64.157-1.316.29-2.016.39.24-.375.48-.762.705-1.158.225-.39.435-.788.636-1.18zm-9.945.02c.2.392.41.783.64 1.175.23.39.465.772.705 1.143-.695-.102-1.365-.23-2.006-.386.18-.63.406-1.282.66-1.933zM17.92 16.32c.112.493.2.968.254 1.423.23 1.868-.054 3.32-.714 3.708-.147.09-.338.128-.563.128-1.012 0-2.514-.807-4.11-2.28.686-.72 1.37-1.536 2.02-2.44 1.107-.118 2.154-.3 3.113-.54zm-11.83.01c.96.234 2.006.415 3.107.532.66.905 1.345 1.727 2.035 2.446-1.595 1.483-3.092 2.295-4.11 2.295-.22-.005-.406-.05-.553-.132-.666-.38-.955-1.834-.73-3.703.054-.46.142-.944.25-1.438zm4.56.64c.44.02.89.034 1.345.034.46 0 .915-.01 1.36-.034-.44.572-.895 1.095-1.345 1.565-.455-.47-.91-.993-1.36-1.565z\" fill=\"currentColor\" /></svg>',children:(0,i.jsxs)(s.code,{children:[(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"import\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" { lazy, Suspense } \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"from\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\" 'react'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\";\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\"}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" LiquidGlass\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" lazy\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(() \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=>\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" \"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  import\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\"'liquid-glass-react'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\").\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"then\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\"module\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =>\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" ({\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    default: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"module\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".default\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  }))\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\");\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\"}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" OptimizedGlassComponent\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" ({ \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\"children\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\", \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"...\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\"props\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" }) \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=>\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  <\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"Suspense\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" fallback\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"{<\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"CSSFallback\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\">{children}</\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"CSSFallback\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\">}>\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    <\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"LiquidGlass\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"...\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"props}>\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      {children}\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    </\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"LiquidGlass\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\">\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  </\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"Suspense\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\">\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\");\"})})]})})}),`\n`,(0,i.jsx)(s.h4,{id:\"2-\\uBA54\\uBAA8\\uB9AC-\\uAD00\\uB9AC\",children:\"2. \\uBA54\\uBAA8\\uB9AC \\uAD00\\uB9AC\"}),`\n`,(0,i.jsx)(i.Fragment,{children:(0,i.jsx)(s.pre,{className:\"shiki shiki-themes github-light github-dark\",style:{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},tabIndex:\"0\",icon:'<svg viewBox=\"0 0 24 24\"><path d=\"M1.125 0C.502 0 0 .502 0 1.125v21.75C0 23.498.502 24 1.125 24h21.75c.623 0 1.125-.502 1.125-1.125V1.125C24 .502 23.498 0 22.875 0zm17.363 9.75c.612 0 1.154.037 1.627.111a6.38 6.38 0 0 1 1.306.34v2.458a3.95 3.95 0 0 0-.643-.361 5.093 5.093 0 0 0-.717-.26 5.453 5.453 0 0 0-1.426-.2c-.3 0-.573.028-.819.086a2.1 2.1 0 0 0-.623.242c-.17.104-.3.229-.393.374a.888.888 0 0 0-.14.49c0 .196.053.373.156.529.104.156.252.304.443.444s.423.276.696.41c.273.135.582.274.926.416.47.197.892.407 1.266.628.374.222.695.473.963.753.268.279.472.598.614.957.142.359.214.776.214 1.253 0 .657-.125 1.21-.373 1.656a3.033 3.033 0 0 1-1.012 1.085 4.38 4.38 0 0 1-1.487.596c-.566.12-1.163.18-1.79.18a9.916 9.916 0 0 1-1.84-.164 5.544 5.544 0 0 1-1.512-.493v-2.63a5.033 5.033 0 0 0 3.237 1.2c.333 0 .624-.03.872-.09.249-.06.456-.144.623-.25.166-.108.29-.234.373-.38a1.023 1.023 0 0 0-.074-1.089 2.12 2.12 0 0 0-.537-.5 5.597 5.597 0 0 0-.807-.444 27.72 27.72 0 0 0-1.007-.436c-.918-.383-1.602-.852-2.053-1.405-.45-.553-.676-1.222-.676-2.005 0-.614.123-1.141.369-1.582.246-.441.58-.804 1.004-1.089a4.494 4.494 0 0 1 1.47-.629 7.536 7.536 0 0 1 1.77-.201zm-15.113.188h9.563v2.166H9.506v9.646H6.789v-9.646H3.375z\" fill=\"currentColor\" /></svg>',children:(0,i.jsxs)(s.code,{children:[(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"// WebGL \\uCEE8\\uD14D\\uC2A4\\uD2B8\\uB97C \\uC704\\uD55C \\uC790\\uB3D9 \\uC815\\uB9AC\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"class\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" WebGLResourceManager\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  private\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\" contexts\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\":\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" Set\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"<\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"WebGLRenderingContext\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"> \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" new\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" Set\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"();\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  private\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\" textures\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\":\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" Set\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"<\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"WebGLTexture\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"> \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" new\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" Set\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"();\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  private\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\" buffers\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\":\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" Set\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"<\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"WebGLBuffer\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"> \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" new\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" Set\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"();\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\"}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"  registerContext\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\"gl\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\":\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" WebGLRenderingContext\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\") {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"    this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".contexts.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"add\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(gl);\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  }\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\"}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"  cleanup\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"() {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"    this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".contexts.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"forEach\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\"gl\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =>\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"      // \\uD14D\\uC2A4\\uCC98 \\uC815\\uB9AC\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"      this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".textures.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"forEach\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\"texture\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =>\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"        gl.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"deleteTexture\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(texture);\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      });\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      \"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"      // \\uBC84\\uD37C \\uC815\\uB9AC\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"      this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".buffers.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"forEach\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\"buffer\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =>\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"        gl.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"deleteBuffer\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(buffer);\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      });\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      \"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"      // \\uBA54\\uBAA8\\uB9AC \\uD574\\uC81C\\uB97C \\uC704\\uD55C \\uCEE8\\uD14D\\uC2A4\\uD2B8 \\uC190\\uC2E4\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"      const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" loseContext\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" gl.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"getExtension\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\"'WEBGL_lose_context'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\");\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"      if\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (loseContext) {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"        loseContext.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"loseContext\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"();\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      }\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    });\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    \"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"    this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".contexts.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"clear\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"();\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"    this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".textures.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"clear\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"();\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"    this\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\".buffers.\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"clear\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"();\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  }\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"}\"})})]})})}),`\n`,(0,i.jsx)(s.h2,{id:\"\\uC2E4\\uC81C-\\uC131\\uB2A5-\\uD14C\\uC2A4\\uD2B8\",children:\"\\uC2E4\\uC81C \\uC131\\uB2A5 \\uD14C\\uC2A4\\uD2B8\"}),`\n`,(0,i.jsx)(s.h3,{id:\"\\uBAA8\\uBC14\\uC77C-\\uAE30\\uAE30-\\uCD5C\\uC801\\uD654\",children:\"\\uBAA8\\uBC14\\uC77C \\uAE30\\uAE30 \\uCD5C\\uC801\\uD654\"}),`\n`,(0,i.jsx)(i.Fragment,{children:(0,i.jsx)(s.pre,{className:\"shiki shiki-themes github-light github-dark\",style:{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},tabIndex:\"0\",icon:'<svg viewBox=\"0 0 24 24\"><path d=\"M1.125 0C.502 0 0 .502 0 1.125v21.75C0 23.498.502 24 1.125 24h21.75c.623 0 1.125-.502 1.125-1.125V1.125C24 .502 23.498 0 22.875 0zm17.363 9.75c.612 0 1.154.037 1.627.111a6.38 6.38 0 0 1 1.306.34v2.458a3.95 3.95 0 0 0-.643-.361 5.093 5.093 0 0 0-.717-.26 5.453 5.453 0 0 0-1.426-.2c-.3 0-.573.028-.819.086a2.1 2.1 0 0 0-.623.242c-.17.104-.3.229-.393.374a.888.888 0 0 0-.14.49c0 .196.053.373.156.529.104.156.252.304.443.444s.423.276.696.41c.273.135.582.274.926.416.47.197.892.407 1.266.628.374.222.695.473.963.753.268.279.472.598.614.957.142.359.214.776.214 1.253 0 .657-.125 1.21-.373 1.656a3.033 3.033 0 0 1-1.012 1.085 4.38 4.38 0 0 1-1.487.596c-.566.12-1.163.18-1.79.18a9.916 9.916 0 0 1-1.84-.164 5.544 5.544 0 0 1-1.512-.493v-2.63a5.033 5.033 0 0 0 3.237 1.2c.333 0 .624-.03.872-.09.249-.06.456-.144.623-.25.166-.108.29-.234.373-.38a1.023 1.023 0 0 0-.074-1.089 2.12 2.12 0 0 0-.537-.5 5.597 5.597 0 0 0-.807-.444 27.72 27.72 0 0 0-1.007-.436c-.918-.383-1.602-.852-2.053-1.405-.45-.553-.676-1.222-.676-2.005 0-.614.123-1.141.369-1.582.246-.441.58-.804 1.004-1.089a4.494 4.494 0 0 1 1.47-.629 7.536 7.536 0 0 1 1.77-.201zm-15.113.188h9.563v2.166H9.506v9.646H6.789v-9.646H3.375z\" fill=\"currentColor\" /></svg>',children:(0,i.jsxs)(s.code,{children:[(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"// \\uAE30\\uAE30\\uBCC4 \\uB9E4\\uAC1C\\uBCC0\\uC218 \\uC870\\uC815\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" getOptimizedParameters\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\"deviceInfo\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\":\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" DeviceInfo\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\") \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=>\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" { \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"isMobile\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\", \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#E36209\",\"--shiki-dark\":\"#FFAB70\"},children:\"performance\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\": \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"devicePerformance\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" } \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" deviceInfo;\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  \"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  if\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (isMobile) {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    return\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      displacementScale: devicePerformance \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"===\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\" 'low'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" ?\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" 1.0\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" :\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" 1.5\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\",\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      blurAmount: devicePerformance \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"===\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\" 'low'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" ?\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" 0.8\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" :\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" 1.2\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\",\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      elasticity: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"0.6\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\",\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      updateFrequency: devicePerformance \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"===\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\" 'low'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" ?\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" 30\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" :\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" 60\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\" // FPS\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    };\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  }\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  \"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  return\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    displacementScale: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"2.0\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\",\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    blurAmount: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"1.5\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\",\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    elasticity: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"0.8\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\",\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    updateFrequency: \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"60\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  };\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"};\"})})]})})}),`\n`,(0,i.jsx)(s.h3,{id:\"\\uBC30\\uD130\\uB9AC-\\uC0AC\\uC6A9\\uB7C9-\\uBD84\\uC11D\",children:\"\\uBC30\\uD130\\uB9AC \\uC0AC\\uC6A9\\uB7C9 \\uBD84\\uC11D\"}),`\n`,(0,i.jsx)(s.p,{children:\"\\uD14C\\uC2A4\\uD2B8 \\uACB0\\uACFC WebGL \\uAE30\\uBC18 Liquid Glass\\uAC00 \\uB354 \\uBC30\\uD130\\uB9AC \\uD6A8\\uC728\\uC801\\uC785\\uB2C8\\uB2E4:\"}),`\n`,(0,i.jsxs)(s.ul,{children:[`\n`,(0,i.jsxs)(s.li,{children:[(0,i.jsx)(s.strong,{children:\"CSS backdrop-filter\"}),\": 15-20% \\uB354 \\uB192\\uC740 \\uBC30\\uD130\\uB9AC \\uC18C\\uBAA8\"]}),`\n`,(0,i.jsxs)(s.li,{children:[(0,i.jsx)(s.strong,{children:\"Liquid Glass React\"}),\": \\uCD5C\\uC801\\uD654\\uB41C GPU \\uC0AC\\uC6A9\\uC73C\\uB85C \\uC804\\uCCB4 \\uC804\\uB825 \\uC18C\\uBE44 \\uAC10\\uC18C\"]}),`\n`]}),`\n`,(0,i.jsx)(s.h2,{id:\"\\uAD6C\\uD604-\\uACB0\\uC815-\\uB9E4\\uD2B8\\uB9AD\\uC2A4\",children:\"\\uAD6C\\uD604 \\uACB0\\uC815 \\uB9E4\\uD2B8\\uB9AD\\uC2A4\"}),`\n`,(0,i.jsxs)(s.table,{children:[(0,i.jsx)(s.thead,{children:(0,i.jsxs)(s.tr,{children:[(0,i.jsx)(s.th,{children:\"\\uC694\\uC18C\"}),(0,i.jsx)(s.th,{children:\"CSS backdrop-filter\"}),(0,i.jsx)(s.th,{children:\"Liquid Glass React\"}),(0,i.jsx)(s.th,{children:\"\\uC2B9\\uC790\"})]})}),(0,i.jsxs)(s.tbody,{children:[(0,i.jsxs)(s.tr,{children:[(0,i.jsx)(s.td,{children:\"\\uC131\\uB2A5\"}),(0,i.jsx)(s.td,{children:\"\\u2B50\\u2B50\\u2B50\"}),(0,i.jsx)(s.td,{children:\"\\u2B50\\u2B50\\u2B50\\u2B50\\u2B50\"}),(0,i.jsx)(s.td,{children:\"Liquid Glass\"})]}),(0,i.jsxs)(s.tr,{children:[(0,i.jsx)(s.td,{children:\"\\uBE0C\\uB77C\\uC6B0\\uC800 \\uC9C0\\uC6D0\"}),(0,i.jsx)(s.td,{children:\"\\u2B50\\u2B50\\u2B50\\u2B50\"}),(0,i.jsx)(s.td,{children:\"\\u2B50\\u2B50\\u2B50\\u2B50\\u2B50\"}),(0,i.jsx)(s.td,{children:\"Liquid Glass\"})]}),(0,i.jsxs)(s.tr,{children:[(0,i.jsx)(s.td,{children:\"\\uAD6C\\uD604 \\uBCF5\\uC7A1\\uC131\"}),(0,i.jsx)(s.td,{children:\"\\u2B50\\u2B50\\u2B50\\u2B50\\u2B50\"}),(0,i.jsx)(s.td,{children:\"\\u2B50\\u2B50\\u2B50\"}),(0,i.jsx)(s.td,{children:\"CSS\"})]}),(0,i.jsxs)(s.tr,{children:[(0,i.jsx)(s.td,{children:\"\\uC2DC\\uAC01\\uC801 \\uD488\\uC9C8\"}),(0,i.jsx)(s.td,{children:\"\\u2B50\\u2B50\\u2B50\"}),(0,i.jsx)(s.td,{children:\"\\u2B50\\u2B50\\u2B50\\u2B50\\u2B50\"}),(0,i.jsx)(s.td,{children:\"Liquid Glass\"})]}),(0,i.jsxs)(s.tr,{children:[(0,i.jsx)(s.td,{children:\"\\uBAA8\\uBC14\\uC77C \\uC131\\uB2A5\"}),(0,i.jsx)(s.td,{children:\"\\u2B50\\u2B50\"}),(0,i.jsx)(s.td,{children:\"\\u2B50\\u2B50\\u2B50\\u2B50\"}),(0,i.jsx)(s.td,{children:\"Liquid Glass\"})]}),(0,i.jsxs)(s.tr,{children:[(0,i.jsx)(s.td,{children:\"\\uBC88\\uB4E4 \\uD06C\\uAE30\"}),(0,i.jsx)(s.td,{children:\"\\u2B50\\u2B50\\u2B50\\u2B50\\u2B50\"}),(0,i.jsx)(s.td,{children:\"\\u2B50\\u2B50\\u2B50\"}),(0,i.jsx)(s.td,{children:\"CSS\"})]})]})]}),`\n`,(0,i.jsx)(s.h2,{id:\"\\uBAA8\\uBC94-\\uC0AC\\uB840-\\uBC0F-\\uAD8C\\uC7A5\\uC0AC\\uD56D\",children:\"\\uBAA8\\uBC94 \\uC0AC\\uB840 \\uBC0F \\uAD8C\\uC7A5\\uC0AC\\uD56D\"}),`\n`,(0,i.jsx)(s.h3,{id:\"css-backdrop-filter\\uB97C-\\uC0AC\\uC6A9\\uD574\\uC57C-\\uD558\\uB294-\\uACBD\\uC6B0\",children:\"CSS backdrop-filter\\uB97C \\uC0AC\\uC6A9\\uD574\\uC57C \\uD558\\uB294 \\uACBD\\uC6B0\"}),`\n`,(0,i.jsxs)(s.ol,{children:[`\n`,(0,i.jsxs)(s.li,{children:[(0,i.jsx)(s.strong,{children:\"\\uAC04\\uB2E8\\uD55C \\uC815\\uC801 \\uD6A8\\uACFC\"}),\"\\uB85C \\uCD5C\\uC18C\\uD55C\\uC758 \\uC0C1\\uD638\\uC791\\uC6A9\"]}),`\n`,(0,i.jsxs)(s.li,{children:[(0,i.jsx)(s.strong,{children:\"\\uD504\\uB85C\\uD1A0\\uD0C0\\uC785 \\uAC1C\\uBC1C\"}),\"\\uC5D0\\uC11C \\uBE60\\uB978 \\uBC18\\uBCF5\\uC774 \\uD544\\uC694\\uD55C \\uACBD\\uC6B0\"]}),`\n`,(0,i.jsxs)(s.li,{children:[(0,i.jsx)(s.strong,{children:\"\\uB808\\uAC70\\uC2DC \\uBE0C\\uB77C\\uC6B0\\uC800 \\uC9C0\\uC6D0\"}),\"\\uC774 \\uC8FC\\uC694 \\uAD00\\uC2EC\\uC0AC\\uC778 \\uACBD\\uC6B0\"]}),`\n`,(0,i.jsxs)(s.li,{children:[(0,i.jsx)(s.strong,{children:\"\\uBC88\\uB4E4 \\uD06C\\uAE30\"}),\"\\uAC00 \\uC911\\uC694\\uD55C \\uC81C\\uC57D\\uC778 \\uACBD\\uC6B0\"]}),`\n`]}),`\n`,(0,i.jsx)(s.h3,{id:\"liquid-glass-react\\uB97C-\\uC0AC\\uC6A9\\uD574\\uC57C-\\uD558\\uB294-\\uACBD\\uC6B0\",children:\"Liquid Glass React\\uB97C \\uC0AC\\uC6A9\\uD574\\uC57C \\uD558\\uB294 \\uACBD\\uC6B0\"}),`\n`,(0,i.jsxs)(s.ol,{children:[`\n`,(0,i.jsxs)(s.li,{children:[(0,i.jsx)(s.strong,{children:\"\\uC0C1\\uD638\\uC791\\uC6A9\\uD558\\uB294 \\uC720\\uB9AC \\uD6A8\\uACFC\"}),\"\\uC640 \\uC560\\uB2C8\\uBA54\\uC774\\uC158\"]}),`\n`,(0,i.jsx)(s.li,{children:(0,i.jsx)(s.strong,{children:\"\\uC131\\uB2A5\\uC774 \\uC911\\uC694\\uD55C \\uC560\\uD50C\\uB9AC\\uCF00\\uC774\\uC158\"})}),`\n`,(0,i.jsxs)(s.li,{children:[(0,i.jsx)(s.strong,{children:\"\\uBAA8\\uBC14\\uC77C \\uC6B0\\uC120\"}),\" \\uBC18\\uC751\\uD615 \\uB514\\uC790\\uC778\"]}),`\n`,(0,i.jsx)(s.li,{children:(0,i.jsx)(s.strong,{children:\"\\uD604\\uB300\\uC801\\uC778 \\uBE0C\\uB77C\\uC6B0\\uC800 \\uD658\\uACBD\"})}),`\n`,(0,i.jsxs)(s.li,{children:[(0,i.jsx)(s.strong,{children:\"\\uBCF5\\uC7A1\\uD55C \\uAE00\\uB798\\uC2A4\\uBAA8\\uD53C\\uC998\"}),\" \\uC694\\uAD6C\\uC0AC\\uD56D\"]}),`\n`]}),`\n`,(0,i.jsx)(s.h3,{id:\"\\uD558\\uC774\\uBE0C\\uB9AC\\uB4DC-\\uC811\\uADFC\\uBC95-\\uAD6C\\uD604\",children:\"\\uD558\\uC774\\uBE0C\\uB9AC\\uB4DC \\uC811\\uADFC\\uBC95 \\uAD6C\\uD604\"}),`\n`,(0,i.jsx)(i.Fragment,{children:(0,i.jsx)(s.pre,{className:\"shiki shiki-themes github-light github-dark\",style:{\"--shiki-light\":\"#24292e\",\"--shiki-dark\":\"#e1e4e8\",\"--shiki-light-bg\":\"#fff\",\"--shiki-dark-bg\":\"#24292e\"},tabIndex:\"0\",icon:'<svg viewBox=\"0 0 24 24\"><path d=\"M14.23 12.004a2.236 2.236 0 0 1-2.235 2.236 2.236 2.236 0 0 1-2.236-2.236 2.236 2.236 0 0 1 2.235-2.236 2.236 2.236 0 0 1 2.236 2.236zm2.648-10.69c-1.346 0-3.107.96-4.888 2.622-1.78-1.653-3.542-2.602-4.887-2.602-.41 0-.783.093-1.106.278-1.375.793-1.683 3.264-.973 6.365C1.98 8.917 0 10.42 0 12.004c0 1.59 1.99 3.097 5.043 4.03-.704 3.113-.39 5.588.988 6.38.32.187.69.275 1.102.275 1.345 0 3.107-.96 4.888-2.624 1.78 1.654 3.542 2.603 4.887 2.603.41 0 .783-.09 1.106-.275 1.374-.792 1.683-3.263.973-6.365C22.02 15.096 24 13.59 24 12.004c0-1.59-1.99-3.097-5.043-4.032.704-3.11.39-5.587-.988-6.38-.318-.184-.688-.277-1.092-.278zm-.005 1.09v.006c.225 0 .406.044.558.127.666.382.955 1.835.73 3.704-.054.46-.142.945-.25 1.44-.96-.236-2.006-.417-3.107-.534-.66-.905-1.345-1.727-2.035-2.447 1.592-1.48 3.087-2.292 4.105-2.295zm-9.77.02c1.012 0 2.514.808 4.11 2.28-.686.72-1.37 1.537-2.02 2.442-1.107.117-2.154.298-3.113.538-.112-.49-.195-.964-.254-1.42-.23-1.868.054-3.32.714-3.707.19-.09.4-.127.563-.132zm4.882 3.05c.455.468.91.992 1.36 1.564-.44-.02-.89-.034-1.345-.034-.46 0-.915.01-1.36.034.44-.572.895-1.096 1.345-1.565zM12 8.1c.74 0 1.477.034 2.202.093.406.582.802 1.203 1.183 1.86.372.64.71 1.29 1.018 1.946-.308.655-.646 1.31-1.013 1.95-.38.66-.773 1.288-1.18 1.87-.728.063-1.466.098-2.21.098-.74 0-1.477-.035-2.202-.093-.406-.582-.802-1.204-1.183-1.86-.372-.64-.71-1.29-1.018-1.946.303-.657.646-1.313 1.013-1.954.38-.66.773-1.286 1.18-1.868.728-.064 1.466-.098 2.21-.098zm-3.635.254c-.24.377-.48.763-.704 1.16-.225.39-.435.782-.635 1.174-.265-.656-.49-1.31-.676-1.947.64-.15 1.315-.283 2.015-.386zm7.26 0c.695.103 1.365.23 2.006.387-.18.632-.405 1.282-.66 1.933-.2-.39-.41-.783-.64-1.174-.225-.392-.465-.774-.705-1.146zm3.063.675c.484.15.944.317 1.375.498 1.732.74 2.852 1.708 2.852 2.476-.005.768-1.125 1.74-2.857 2.475-.42.18-.88.342-1.355.493-.28-.958-.646-1.956-1.1-2.98.45-1.017.81-2.01 1.085-2.964zm-13.395.004c.278.96.645 1.957 1.1 2.98-.45 1.017-.812 2.01-1.086 2.964-.484-.15-.944-.318-1.37-.5-1.732-.737-2.852-1.706-2.852-2.474 0-.768 1.12-1.742 2.852-2.476.42-.18.88-.342 1.356-.494zm11.678 4.28c.265.657.49 1.312.676 1.948-.64.157-1.316.29-2.016.39.24-.375.48-.762.705-1.158.225-.39.435-.788.636-1.18zm-9.945.02c.2.392.41.783.64 1.175.23.39.465.772.705 1.143-.695-.102-1.365-.23-2.006-.386.18-.63.406-1.282.66-1.933zM17.92 16.32c.112.493.2.968.254 1.423.23 1.868-.054 3.32-.714 3.708-.147.09-.338.128-.563.128-1.012 0-2.514-.807-4.11-2.28.686-.72 1.37-1.536 2.02-2.44 1.107-.118 2.154-.3 3.113-.54zm-11.83.01c.96.234 2.006.415 3.107.532.66.905 1.345 1.727 2.035 2.446-1.595 1.483-3.092 2.295-4.11 2.295-.22-.005-.406-.05-.553-.132-.666-.38-.955-1.834-.73-3.703.054-.46.142-.944.25-1.438zm4.56.64c.44.02.89.034 1.345.034.46 0 .915-.01 1.36-.034-.44.572-.895 1.095-1.345 1.565-.455-.47-.91-.993-1.36-1.565z\" fill=\"currentColor\" /></svg>',children:(0,i.jsxs)(s.code,{children:[(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6A737D\",\"--shiki-dark\":\"#6A737D\"},children:\"// \\uB450 \\uBC29\\uBC95\\uC758 \\uC7A5\\uC810\\uC744 \\uBAA8\\uB450 \\uD65C\\uC6A9\\uD558\\uB294 \\uC194\\uB8E8\\uC158\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" AdaptiveGlassEffect\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" ({ \"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  children, \"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  complexity \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\" 'simple'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\",\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  ...\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"props \"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"}) \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=>\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" [\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"useWebGL\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\", \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"setUseWebGL\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"] \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" useState\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"false\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\");\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  \"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"  useEffect\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(() \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=>\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    const\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\" shouldUseWebGL\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" =\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" \"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      complexity \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"===\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:\" 'complex'\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\" ||\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" \"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"      hasWebGLSupport\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"() \"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"&&\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" \"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"      !\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"prefersReducedMotion\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"();\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    \"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\"    setUseWebGL\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"(shouldUseWebGL);\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  }, [complexity]);\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  \"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  if\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (useWebGL) {\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"    return\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      <\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"ConditionalLiquidGlass\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" {\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"...\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"props}>\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"        {children}\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      </\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#005CC5\",\"--shiki-dark\":\"#79B8FF\"},children:\"ConditionalLiquidGlass\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\">\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    );\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  }\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  \"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"  return\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\" (\"})]}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    <\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#22863A\",\"--shiki-dark\":\"#85E89D\"},children:\"div\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#6F42C1\",\"--shiki-dark\":\"#B392F0\"},children:\" className\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#D73A49\",\"--shiki-dark\":\"#F97583\"},children:\"=\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#032F62\",\"--shiki-dark\":\"#9ECBFF\"},children:'\"bg-white/10 backdrop-blur-lg border border-white/20 rounded-2xl\"'}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\">\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"      {children}\"})}),`\n`,(0,i.jsxs)(s.span,{className:\"line\",children:[(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"    </\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#22863A\",\"--shiki-dark\":\"#85E89D\"},children:\"div\"}),(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\">\"})]}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"  );\"})}),`\n`,(0,i.jsx)(s.span,{className:\"line\",children:(0,i.jsx)(s.span,{style:{\"--shiki-light\":\"#24292E\",\"--shiki-dark\":\"#E1E4E8\"},children:\"};\"})})]})})}),`\n`,(0,i.jsx)(s.h2,{id:\"\\uACB0\\uB860\",children:\"\\uACB0\\uB860\"}),`\n`,(0,i.jsxs)(s.p,{children:[\"CSS \",(0,i.jsx)(s.code,{children:\"backdrop-filter\"}),\"\\uAC00 \\uB2E8\\uC21C\\uD568\\uACFC \\uC791\\uC740 \\uBC88\\uB4E4 \\uD06C\\uAE30\\uB97C \\uC81C\\uACF5\\uD558\\uB294 \\uBC18\\uBA74, Liquid Glass React\\uB294 \\uB6F0\\uC5B4\\uB09C \\uC131\\uB2A5, \\uC2DC\\uAC01\\uC801 \\uD488\\uC9C8, \\uC0AC\\uC6A9\\uC790 \\uACBD\\uD5D8\\uC744 \\uC81C\\uACF5\\uD569\\uB2C8\\uB2E4. \\uC131\\uB2A5\\uACFC \\uC2DC\\uAC01\\uC801 \\uCDA9\\uC2E4\\uB3C4\\uB97C \\uC6B0\\uC120\\uC2DC\\uD558\\uB294 \\uD604\\uB300\\uC801\\uC778 \\uC560\\uD50C\\uB9AC\\uCF00\\uC774\\uC158\\uC5D0\\uC11C\\uB294 WebGL \\uAE30\\uBC18 \\uC811\\uADFC\\uBC95\\uC774 \\uBA85\\uD655\\uD55C \\uC2B9\\uC790\\uC785\\uB2C8\\uB2E4.\"]}),`\n`,(0,i.jsx)(s.p,{children:\"\\uD575\\uC2EC\\uC740 \\uAE30\\uAE30 \\uB2A5\\uB825\\uACFC \\uC0AC\\uC6A9\\uC790 \\uC120\\uD638\\uB3C4\\uC5D0 \\uB530\\uB77C \\uC6B0\\uC544\\uD558\\uAC8C \\uC800\\uD558\\uB418\\uBA74\\uC11C \\uB450 \\uC811\\uADFC\\uBC95\\uC758 \\uAC15\\uC810\\uC744 \\uD65C\\uC6A9\\uD558\\uB294 \\uC810\\uC9C4\\uC801 \\uD5A5\\uC0C1 \\uC804\\uB7B5\\uC744 \\uAD6C\\uD604\\uD558\\uB294 \\uAC83\\uC785\\uB2C8\\uB2E4.\"}),`\n`,(0,i.jsx)(s.h2,{id:\"\\uAD6C\\uD604-\\uB9AC\\uC18C\\uC2A4\",children:\"\\uAD6C\\uD604 \\uB9AC\\uC18C\\uC2A4\"}),`\n`,(0,i.jsxs)(s.ul,{children:[`\n`,(0,i.jsx)(s.li,{children:(0,i.jsx)(s.a,{href:\"https://github.com/rdev/liquid-glass-react\",children:\"Liquid Glass React \\uBB38\\uC11C\"})}),`\n`,(0,i.jsx)(s.li,{children:(0,i.jsx)(s.a,{href:\"/blog/webgl-optimization-guide\",children:\"WebGL \\uC131\\uB2A5 \\uCD5C\\uC801\\uD654 \\uAC00\\uC774\\uB4DC\"})}),`\n`,(0,i.jsx)(s.li,{children:(0,i.jsx)(s.a,{href:\"/blog/progressive-enhancement-web-components\",children:\"\\uC810\\uC9C4\\uC801 \\uD5A5\\uC0C1 \\uC804\\uB7B5\"})}),`\n`]}),`\n`,(0,i.jsx)(s.hr,{}),`\n`,(0,i.jsx)(s.p,{children:(0,i.jsx)(s.em,{children:\"\\uC774 \\uBD84\\uC11D\\uC740 50\\uAC1C \\uC774\\uC0C1\\uC758 \\uAE30\\uAE30 \\uAD6C\\uC131\\uACFC \\uBE0C\\uB77C\\uC6B0\\uC800 \\uC870\\uD569\\uC5D0\\uC11C \\uC2E4\\uC81C \\uD14C\\uC2A4\\uD2B8\\uB97C \\uD1B5\\uD574 \\uC218\\uD589\\uB418\\uC5C8\\uC2B5\\uB2C8\\uB2E4. \\uC131\\uB2A5 \\uBA54\\uD2B8\\uB9AD\\uC740 \\uD2B9\\uC815 \\uAD6C\\uD604 \\uC138\\uBD80\\uC0AC\\uD56D\\uACFC \\uD558\\uB4DC\\uC6E8\\uC5B4 \\uB2A5\\uB825\\uC5D0 \\uB530\\uB77C \\uB2EC\\uB77C\\uC9C8 \\uC218 \\uC788\\uC2B5\\uB2C8\\uB2E4.\"})})]})}function c(h={}){let{wrapper:s}=h.components||{};return s?(0,i.jsx)(s,{...h,children:(0,i.jsx)(t,{...h})}):t(h)}return A(N);})();\n;return Component;","toc":[{"title":"Liquid Glass vs CSS backdrop-filter: 성능 분석","url":"#liquid-glass-vs-css-backdrop-filter-성능-분석","depth":1},{"title":"성능 벤치마크","url":"#성능-벤치마크","depth":2},{"title":"CPU 사용량 비교","url":"#cpu-사용량-비교","depth":3},{"title":"프레임 속도 분석","url":"#프레임-속도-분석","depth":3},{"title":"브라우저 호환성 매트릭스","url":"#브라우저-호환성-매트릭스","depth":2},{"title":"CSS backdrop-filter 지원","url":"#css-backdrop-filter-지원","depth":3},{"title":"WebGL 지원 (Liquid Glass React)","url":"#webgl-지원-liquid-glass-react","depth":3},{"title":"구현 전략","url":"#구현-전략","depth":2},{"title":"점진적 향상 접근법","url":"#점진적-향상-접근법","depth":3},{"title":"성능 최적화 기법","url":"#성능-최적화-기법","depth":3},{"title":"1. 지연 로딩 구현","url":"#1-지연-로딩-구현","depth":4},{"title":"2. 메모리 관리","url":"#2-메모리-관리","depth":4},{"title":"실제 성능 테스트","url":"#실제-성능-테스트","depth":2},{"title":"모바일 기기 최적화","url":"#모바일-기기-최적화","depth":3},{"title":"배터리 사용량 분석","url":"#배터리-사용량-분석","depth":3},{"title":"구현 결정 매트릭스","url":"#구현-결정-매트릭스","depth":2},{"title":"모범 사례 및 권장사항","url":"#모범-사례-및-권장사항","depth":2},{"title":"CSS backdrop-filter를 사용해야 하는 경우","url":"#css-backdrop-filter를-사용해야-하는-경우","depth":3},{"title":"Liquid Glass React를 사용해야 하는 경우","url":"#liquid-glass-react를-사용해야-하는-경우","depth":3},{"title":"하이브리드 접근법 구현","url":"#하이브리드-접근법-구현","depth":3},{"title":"결론","url":"#결론","depth":2},{"title":"구현 리소스","url":"#구현-리소스","depth":2}],"estimatedTime":5}