f2e-middle-esbuild
Version:
f2e-server middleware for esbuild
71 lines (66 loc) • 32.6 kB
HTML
<html lang="en">
<head>
<meta charset="utf8">
<title>esbuild - Bundle Size Analyzer</title>
<meta property="og:title" content="esbuild - Bundle Size Analyzer" />
<meta property="og:type" content="website" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
html:not([data-theme=dark]){--bg: #fff;--fg-on: #000;--fg: #222;--pre-dim: #777;--pre-val: #870;--pre: #222;--bar-min-width: 1px}html[data-theme=dark]{color-scheme:dark;--bg: #191919;--fg-on: #ddd;--fg: #aaa;--pre-dim: #999;--pre-val: #cb8;--pre: #ccc;--bar-min-width: 3px}@media (prefers-color-scheme: dark){html:not([data-theme=light]){color-scheme:dark;--bg: #191919;--fg-on: #ddd;--fg: #aaa;--pre-dim: #999;--pre-val: #cb8;--pre: #ccc;--bar-min-width: 3px}}body{margin:50px;font:16px/20px sans-serif;background:var(--bg);color:var(--fg)}#startPanel{margin:10% auto 0}#resultsPanel{display:none}section{margin:auto;max-width:600px}#logo{background-image:url(/favicon.svg);background-size:80px;background-repeat:no-repeat;padding-left:100px;display:inline-block;text-align:left;margin-bottom:10px}h1{font-size:80px;line-height:1em;color:var(--fg-on);margin:0}blockquote{font-size:29px;line-height:1em;margin:5px 0;font-style:italic}p{margin:30px 0}a,b{color:var(--fg-on)}code{font:14px/20px Noto Sans Mono,monospace;background:rgba(127,127,127,.2);padding:2px 4px;margin-bottom:-2px;border-radius:3px}pre{color:var(--pre);font:14px/20px Noto Sans Mono,monospace;padding:0;margin:0;white-space:pre-wrap}.center{text-align:center}.noscript{color:red}button{padding:5px 30px;line-height:1.5em;background:none;color:var(--fg);border:1px solid var(--fg);border-radius:100px;cursor:pointer}button:active,button:hover{color:var(--fg-on);border:1px solid var(--fg-on);background:rgba(127,127,127,.2)}button:active{padding:6px 30px 4px;background:rgba(0,0,0,.2)}#settingsPanel{text-align:center}#settingsPanel .chartSwitcher{position:relative;margin:50px 0;display:flex;justify-content:center}#settingsPanel .chartSwitcher:after{position:absolute;left:0;right:0;top:.5em;content:"";display:block;border:1px solid #FFCF00;z-index:-1}#settingsPanel .chartSwitcher span{background:var(--bg);padding:0 1em;border-left:2px solid #FFCF00}#settingsPanel .chartSwitcher span:first-child{border:none}#settingsPanel a{text-decoration:none;color:var(--fg)}#settingsPanel a:hover{text-decoration:underline}#settingsPanel a.active{font-weight:700;color:var(--fg-on)}.summary{max-width:600px;margin:auto}.tooltip{position:absolute;background:black;color:#999;border-radius:30px;padding:0 10px;font-size:14px;line-height:30px;display:none;user-select:none;touch-action:none;pointer-events:none;z-index:1;white-space:pre}.tooltip b{color:#fff}#dragTarget{display:none;position:fixed;left:0;top:0;right:0;bottom:0;user-select:none;touch-action:none;box-shadow:inset 0 0 0 10px #ffcf00;z-index:10}#summaryPanel{text-align:center}#summaryPanel table{border-collapse:collapse;margin:auto}#summaryPanel td:first-child{text-align:right}#summaryPanel h2{font-size:30px;line-height:1em;color:var(--fg-on);margin:0}#summaryPanel .symbol{font-size:30px;padding:0 30px}#summaryPanel .formatBreakdown{display:inline-block;margin:20px auto 0;white-space:nowrap;text-decoration:none}#summaryPanel .formatBreakdown:hover .side{text-decoration:underline}#summaryPanel .bar{display:inline-table;vertical-align:middle;margin:0 .8em;border:1px solid #222}#summaryPanel .bar>div{height:20px;display:table-cell}#colorLegend{padding-left:1.6em;line-height:1.1em}#colorLegend .chit{display:inline-block;vertical-align:middle;width:1.1em;height:1.1em;margin-left:-1.6em;margin-right:.5em;border:1px solid #222;box-sizing:border-box}#colorLegend small{display:block;opacity:.5;margin-bottom:1em}#sunburstPanel main{display:flex;justify-content:center;margin-top:50px;margin-bottom:500px}#sunburstPanel .left{margin-right:20px;display:flex;flex-direction:column;align-items:center}#sunburstPanel canvas{display:block;margin-bottom:30px}#sunburstPanel .details{flex:1;max-width:800px;position:relative}#sunburstPanel .dir{font-size:20px;line-height:1.2em;display:flex;white-space:pre;margin:0 10px 20px}#sunburstPanel .dir .segments{flex:1;height:20px}#sunburstPanel .dir a{opacity:.5;text-decoration:none}#sunburstPanel .dir a[href]:hover{text-decoration:underline}#sunburstPanel .dir a:last-child{opacity:1;color:var(--fg-on);font-weight:700}#sunburstPanel .bars{width:100%}#sunburstPanel .bars .row{display:table-row;text-decoration:none;line-height:26px;color:var(--fg)}#sunburstPanel .bars .row.hover{background:rgba(127,127,127,.2);color:var(--fg-on)}#sunburstPanel .bars .row.hover .bar:after{content:"";position:absolute;left:1px;top:1px;right:1px;bottom:1px;background:rgba(255,255,255,.3)}#sunburstPanel .bars .row>div{display:table-cell}#sunburstPanel .bars .name{padding:0 10px;vertical-align:top;white-space:pre}#sunburstPanel .bars .name span{opacity:.5}#sunburstPanel .bars .size{width:100%;padding-right:100px}#sunburstPanel .bars .bar{position:relative;height:27px;box-shadow:inset 0 0 0 1px #222;margin-bottom:-1px;min-width:var(--bar-min-width)}#sunburstPanel .bars .bar.empty{min-width:0}#sunburstPanel .bars .last{position:absolute;right:-10px;width:0;white-space:nowrap}#whyFile{position:fixed;left:0;top:0;right:0;bottom:0;padding:50px;background:rgba(0,0,0,.6);overflow-y:auto}#whyFile .dialog{position:relative;margin:0 auto;padding:50px;max-width:1000px;background:var(--bg);box-shadow:0 10px 20px rgba(0,0,0,.6);box-sizing:border-box;border-radius:20px}#whyFile .dialog:focus{outline:none}#whyFile .closeButton{position:absolute;right:0;top:0;width:50px;text-decoration:none;font-size:30px;line-height:50px;text-align:center;color:var(--fg)}#whyFile .closeButton:hover{font-size:35px;color:var(--fg-on)}#whyFile .closeButton:active{font-size:30px}#whyFile h2{border-bottom:2px solid #FFCF00;padding-bottom:4px;margin:0;font-size:20px;line-height:1.2em;color:var(--fg-on)}#whyFile .outputFile{position:relative;border:1px solid rgba(127,127,127,.5);padding:30px 10px 10px;border-radius:10px;white-space:pre-wrap;margin-top:10px;line-height:22px}#whyFile .outputPath{position:absolute;left:0;top:0;background:rgba(127,127,127,.1);border-right:1px solid rgba(127,127,127,.5);border-bottom:1px solid rgba(127,127,127,.5);border-top-left-radius:10px;border-bottom-right-radius:10px;padding:5px 10px}#whyFile pre{padding:0 0 0 30px}#whyFile .comment{color:var(--pre-dim)}#whyFile .keyword{color:var(--fg-on)}#whyFile .string{color:var(--pre-val)}#whyFile .arrow,#whyFile .longArrow{position:relative}#whyFile .arrow:after,#whyFile .longArrow:after{content:"";position:absolute;top:0;width:30px;background:var(--fg);opacity:.5}#whyFile .arrow:after{height:40px;--icon: url('data:image/svg+xml,<svg width="30" height="40" xmlns="http://www.w3.org/2000/svg"><path d="M16.5 26L20.5 35L23 25.5L16.5 26Z"/><path d="M5 7C15 7 19 15 20 30" fill="none" stroke="black"/></svg>');mask-image:var(--icon);-webkit-mask-image:var(--icon)}#whyFile .longArrow:after{height:90px;--icon: url('data:image/svg+xml,<svg width="30" height="90" xmlns="http://www.w3.org/2000/svg"><path d="M17 76L20 85L23 76H17Z"/><path d="M5 7C15 7 20 25 20 80" fill="none" stroke="black"/></svg>');mask-image:var(--icon);-webkit-mask-image:var(--icon)}#flamePanel main{position:relative;margin-top:60px}#flamePanel canvas{position:absolute;left:-50px;top:0}#flamePanel section{margin-top:30px;min-height:500px}#warningsPanel{max-width:1000px;margin:auto}#warningsPanel .expand{margin-top:20px;text-align:center}#warningsPanel .content{display:none}#warningsPanel .warning{margin:30px 0;white-space:pre-wrap;color:var(--fg-on)}#warningsPanel ul{color:var(--fg);margin:5px 0 0}#warningsPanel .dim{opacity:.5}#warningsPanel pre a{text-decoration:none}#warningsPanel pre a:hover{text-decoration:underline}
</style>
</head>
<body>
<div id="dragTarget"></div>
<div id="startPanel">
<section>
<div class="center">
<div id="logo">
<h1>esbuild</h1>
<blockquote>Bundle Size Analyzer</blockquote>
</div>
</div>
<p>
This page provides a way to visualize the contents of your esbuild bundle.
Add the <a href="https://esbuild.github.io/analyze/api/#metafile">metafile</a> option to your esbuild command, then import it using the
button
below:
</p>
<p class="center">
<button id="importButton">Import your metafile...</button>
</p>
<p>
Or you can <a href="javascript:void 0" id="loadExample">load an example</a> to play around with the
visualization.
</p>
<noscript>
<p class="noscript">
❌ This page requires JavaScript.
Please enable JavaScript and reload the page.
</p>
</noscript>
</section>
</div>
<div id="resultsPanel">
<div id="summaryPanel"></div>
<div id="warningsPanel"></div>
<div id="settingsPanel">
<div class="chartSwitcher">
<span><a id="useSunburst" href="javascript:void 0">Sunburst Chart</a></span>
<span><a id="useFlame" href="javascript:void 0">Flame Chart</a></span>
</div>
</div>
<div id="chartPanel"></div>
</div>
<script>;
(()=>{var d=document,c=Math,Y=requestAnimationFrame,Z=localStorage,B=window;var be=Object.prototype.hasOwnProperty,vt=Array.prototype.indexOf,$e,Yt=/\.\w+\.map$/,Vt=/^\(disabled\):/,yt=navigator.platform.indexOf("Mac")>=0,et=()=>(B.performance||Date).now(),tt=e=>{try{return Z.getItem(e)}catch(t){return null}},lt=(e,t)=>{try{Z.setItem(e,t)}catch(r){}},Ee=e=>Yt.test(e);var Ce=e=>e.replace(Vt,""),xe=e=>$e?$e.format(e):e+"",Ke=e=>{let t=e.toFixed(1).split(".",2);return xe(+t[0])+"."+t[1]},le=e=>e===1?"1 byte":e<1024?xe(e)+" bytes":e<1024*1024?Ke(e/1024)+" kb":e<1024*1024*1024?Ke(e/(1024*1024))+" mb":Ke(e/(1024*1024*1024))+" gb",H=e=>e.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">"),We=e=>{let t=.6+.4*c.max(0,c.cos(e)),r=.5+.2*c.max(0,c.cos(e+c.PI*2/3));return"hsl("+e*180/c.PI+"deg, "+c.round(100*t)+"%, "+c.round(100*r)+"%)"},K=e=>d.createTextNode(e),rt=e=>{let t=d.createElement("code");return t.textContent=e,t},Me=(e,t)=>{let r=d.createElement("span");return r.className=e,r.textContent=t,r},Be=(e,t)=>{let r=e.split("/");if(!t)return r;for(let s=0;s<=r.length;s++)if(t[s]!==r[s]){t.length=s;break}return t},Ct=(e,t)=>{let r=e.split("/");if(!t)return r.reverse();for(let s=0;s<=r.length;s++)if(t[s]!==r[r.length-s-1]){t.length=s;break}return t},xt=e=>{let t=e.lastIndexOf("/");return t<0?".":e.slice(0,t)},Mt=(e,t)=>{let r=e.split("/"),s=t==="."?[]:t.split("/"),n=0;for(;n<s.length&&r[0]===s[n];)r.shift(),n++;if(n===s.length)r.unshift(".");else for(;n<s.length;)r.unshift(".."),n++;return r.join("/")},Nt=e=>{let t=e.split("/");for(let r=t.length-1;r>=0;r--)if(t[r]==="node_modules")return t=t.slice(r+1),t.length>1&&/^index\.(?:[jt]sx?)$/.test(t[t.length-1])&&t.pop(),t.join("/");return null},ve=!1,bt=matchMedia("(prefers-color-scheme: dark)"),Et=()=>Re&&Re(),Ze=null,Qe=null,Re=null,Ue=e=>Ze=e,je=e=>Qe=e,ze=e=>Re=e;d.addEventListener("keydown",()=>ve=!0,{capture:!0});d.addEventListener("mousedown",()=>ve=!1,{capture:!0});B.addEventListener("wheel",e=>Ze&&Ze(e),{passive:!1});B.addEventListener("resize",()=>Qe&&Qe());try{bt.addEventListener("change",Et)}catch(e){bt.addListener(Et)}try{$e=new Intl.NumberFormat}catch(e){}var it=d.getElementById("dragTarget"),qt=d.getElementById("importButton"),ot=0,nt,It=(e,t=e.dataTransfer)=>t&&t.types&&vt.call(t.types,"Files")!==-1,Ot=e=>{if(e.length===1){let t=new FileReader;t.onload=()=>Ge(t.result),t.readAsText(e[0])}};d.ondragover=e=>{e.preventDefault()};d.ondragenter=e=>{e.preventDefault(),It(e)&&(it.style.display="block",ot++)};d.ondragleave=e=>{e.preventDefault(),It(e)&&--ot===0&&(it.style.display="none")};d.ondrop=e=>{e.preventDefault(),it.style.display="none",ot=0,e.dataTransfer&&e.dataTransfer.files&&Ot(e.dataTransfer.files)};qt.onclick=function(){nt&&d.body.removeChild(nt);let e=d.createElement("input");e.type="file",e.style.display="none",d.body.appendChild(e),nt=e,e.click(),e.onchange=()=>e.files&&Ot(e.files)};d.body.addEventListener("paste",e=>{e.clipboardData&&(e.preventDefault(),Ge(e.clipboardData.getData("text/plain")))});var Lt=e=>{let t=e.inputs;for(let r in t)if(t[r].format)return!0;return!1};var Ne=(e,t)=>t.t-e.t||+(e.e>t.e)-+(e.e<t.e),Ie=(e,t,r)=>{let s=t.split("/"),n=s.length,i=e,u="";e.t+=r;for(let a=0;a<n;a++){let l=s[a],o=i.o,m=o[l],p=l+(a+1<n?"/":"");u+=p,be.call(o,l)||(m={n:p,e:u,t:0,o:{}},o[l]=m),m.t+=r,i=m}return n};var St,Pt,Rt,Xe=d.createElement("canvas"),j=Xe.getContext("2d"),Q=1,at,dt,st=0,Je,De={},ut=null,Ye=e=>ut=e,Ve=(e,t,r,s,n)=>{let i=De[t]||Le;if(i instanceof Array){let u=B.devicePixelRatio||1;if(St!==e||Pt!==u||Rt!==n){let a=c.round(64*u)/64,l,o,m;Q=n,Q=c.log2(Q),Q-=c.floor(Q),l=Q,o=c.min(1,8*l),Q=c.pow(2,Q),m=8*c.SQRT2/Q,St=e,Pt=u,Rt=n,Xe.width=Xe.height=c.round(64*a),j.scale(a,a),j.fillStyle=i[0],j.fillRect(0,0,64,64),j.globalAlpha=.25,j.fillStyle=i[1],j.fillRect(0,0,64,64),j.globalAlpha=.67,j.strokeStyle=i[1],j.beginPath();for(let p=0;p<=64;p+=16)j.moveTo(p-32,p+32),j.lineTo(p+32,p-32);if(j.lineWidth=m*(1-(o-l)/2),j.stroke(),o+l>0){j.beginPath();for(let p=8;p<64;p+=16)j.moveTo(p-32,p+32),j.lineTo(p+32,p-32);j.lineWidth=m*(o+l)/2,j.stroke()}at=e.createPattern(Xe,"repeat"),Q/=a}return r/=64*Q*u,r-=c.floor(r),r*=64*Q*u,at.setTransform(new DOMMatrix([Q,0,0,Q,r,s])),at}return i},Ae=e=>{let t=De[e]||Le;return t instanceof Array?`url('data:image/svg+xml,<svg width="26" height="26" xmlns="http://www.w3.org/2000/svg"><rect width="26" height="26" fill="${t[0]}"/><rect width="26" height="26" fill="${t[1]}" fill-opacity="25%"/><path d="M22.5 -3.5L-3.5 22.5M35.5 9.5L9.5 35.5" stroke="${t[1]}" stroke-opacity="67%" stroke-width="9.19239"/></svg>')`:t},Ht=(e,t)=>{if(dt!==e){let r=e.outputs;dt=e,st=0,Je={n:"",e:"",t:0,o:{}};for(let s in r){if(Ee(s))continue;let i=r[s].inputs;for(let u in i)Ie(Je,Ce(u),i[u].bytesInOutput)}}st!==t&&(st=t,De={},Oe.innerHTML="",t===1?wt(De,Je,0,c.PI*2):t===2&&(Ft(De,Je),Oe.innerHTML=Zt),ut&&ut())},wt=(e,t,r,s)=>{let n=t.t,i=t.o,u=[];e[t.e]=We(r+s/2);for(let a in i)u.push(i[a]);for(let a of u.sort(Ne)){let l=a.t/n*s;wt(e,a,r,l),r+=l}},He=We(3.5),we=We(1),Le="#CCC",Kt=[He,we],$t=e=>e?e===1?He:e===2?we:Kt:Le,Fe=(e,t)=>e===Le?"":e===we?t+"ESM":e===He?t+"CJS":t+"ESM & CJS",Ft=(e,t)=>{let r=t.o,s=0,n=!1;for(let i in r)s|=Ft(e,r[i]),n=!0;if(!n){let i=dt.inputs[t.e],u=i&&i.format;s=u==="esm"?2:u==="cjs"?1:0}return e[t.e]=$t(s),s},Oe=d.createElement("div"),Zt='<span class="chit" style="background:'+we+'"></span>ESM <small>modern, faster, smaller</small><span class="chit" style="background:'+He+'"></span>CommonJS <small>legacy, slower, larger</small><span class="chit" style="background:'+Le+'"></span>Other';Oe.id="colorLegend";var kt=d.getElementById("summaryPanel"),Dt=e=>e===1?"file":"files",At=(e,t)=>{let r=e.inputs,s=e.outputs,n=0,i=0,u=0,a=0,l=0,o=0,m=0,p,I,P;for(let g in r){let O=r[g],x=O.format;x==="esm"?l+=O.bytes:x==="cjs"?o+=O.bytes:m+=O.bytes,n++,u+=O.bytes}for(let g in s)Ee(g)||(i++,a+=s[g].bytes);p=c.round(200*l/u),I=c.round(200*o/u),kt.innerHTML="<table><tr><td><h2>"+H(le(u))+"</h2>"+H(xe(n))+" input "+Dt(n)+'</td><td class="symbol">→</td><td><h2>'+H(le(a))+"</h2>"+H(xe(i))+" output "+Dt(i)+"</td></tr></table>"+(l||o?'<a href="javascript:void 0" class="formatBreakdown"><span class="side">'+xe(c.round(100*o/u))+'% CJS</span><div class="bar"><div style="background:'+He+";width:"+I+'px"></div><div style="background:#CCC;width:'+(200-p-I)+'px"></div><div style="background:'+we+";width:"+p+'px"></div></div><span class="side">'+xe(c.round(100*l/u))+"% ESM</span></a>":""),P=kt.querySelector(".formatBreakdown"),P&&(P.onclick=t)};var ye=d.createElement("div"),_t,pt,qe=null,Wt=()=>ye.parentElement!==null,_e=()=>{ye.remove(),qe&&(qe.focus(),qe=null)},Qt=e=>{let t=e.inputs,r=e.outputs,s={},n={},i=[],u={};for(let l in r){let o=r[l],m=o.entryPoint;if(m){s[m]=l,i.push(l);for(let p of o.imports)!p.external&&!be.call(u,p.path)&&(u[p.path]=!0)}}let a=[];for(let l of i){let o=r[l].entryPoint;be.call(u,l)||(n[o]={e:o,d:void 0,i:"entry-point"},a.push(o))}if(!a.length)for(let l of i){let o=r[l].entryPoint;n[o]={e:o,d:void 0,i:"entry-point"},a.push(o)}for(;a.length>0;){let l=[];for(let o of a){let m=t[o];for(let p of m.imports)!p.external&&!be.call(n,p.path)&&(n[p.path]={e:o,d:p.original,i:p.kind},l.push(p.path))}a=l}return{h:s,g:n}},Se=(e,t,r)=>{let s=e.inputs[t],n=d.activeElement;if(!s)return;(!pt||_t!==e)&&(_t=e,pt=Qt(e)),ve&&n&&n.focus&&n.tagName==="A"&&(qe=n);let i=d.createElement("div");i.className="dialog",i.innerHTML="<h2>"+H(t)+"</h2><p>Original size: <b>"+H(le(s.bytes))+"</b>"+(r===null?"":"<br>Bundled size: <b>"+H(le(r))+"</b>")+(s.format==="esm"?"<br>Module format: <b>ESM</b>":s.format==="cjs"?"<br>Module format: <b>CommonJS</b>":"")+"</p>",el(i,pt,t);let u=d.createElement("a");u.className="closeButton",u.href="javascript:void 0",u.onclick=_e,u.innerHTML="×",i.appendChild(u),i.tabIndex=0,ye.id="whyFile",ye.innerHTML="",ye.appendChild(i),ye.onmousedown=a=>{a.target===ye&&_e()},d.body.appendChild(ye),i.focus(),i.onkeydown=a=>{a.key==="Escape"&&!a.shiftKey&&!a.metaKey&&!a.ctrlKey&&!a.altKey&&(a.preventDefault(),_e())}},el=(e,t,r)=>{let s=t.g,n=r,i=[{e:r,c:null}];for(;;){let o=s[n];if(!o)return;if(n===o.e)break;i.push({e:o.e,c:{e:n,d:o.d,i:o.i}}),n=o.e}i.reverse();let u=t.h,a,l="Entry point";e.appendChild(K("This file is included in the bundle because:"));for(let o of i){if(be.call(u,o.e)){let P=d.createElement("div");a=d.createElement("div"),a.className="outputFile",P.className="outputPath",P.textContent="Output file ",P.appendChild(rt(u[o.e])),a.appendChild(P),e.appendChild(a)}else if(!a)return;let m=K(l+" "),p=K(` is included in the bundle.
`);a.firstChild&&a.appendChild(K(`
`)),a.appendChild(m),a.appendChild(rt(o.e)),a.appendChild(p);let I=o.c;if(I){let P=I.d||Nt(I.e)||Mt(I.e,xt(o.e)),g=d.createElement("pre"),O=d.createElement("span");if(O.className=be.call(u,I.e)?"longArrow":"arrow",I.i==="import-statement")g.appendChild(Me("keyword","import ")),g.appendChild(Me("string",JSON.stringify(P))),g.appendChild(K(";")),l="Imported file";else if(I.i==="require-call")g.appendChild(K("require(")),g.appendChild(Me("string",JSON.stringify(P))),g.appendChild(K(");")),l="Required file";else if(I.i==="dynamic-import")g.appendChild(K("import(")),g.appendChild(Me("string",JSON.stringify(P))),g.appendChild(K(");")),l="Dynamically-imported file";else if(I.i==="import-rule")g.appendChild(K("@import ")),g.appendChild(Me("string",JSON.stringify(P))),g.appendChild(K(";")),l="Imported stylesheet";else if(I.i==="url-token")g.appendChild(K("url(")),g.appendChild(Me("string",JSON.stringify(P))),g.appendChild(K(")")),l="URL reference";else return;p.textContent=` contains:
`,g.appendChild(O),g.appendChild(K(`
`)),a.appendChild(g)}else m.textContent="So "+m.textContent.toLowerCase()}};var Bt=(e,t)=>{for(;t;){if(t===e)return!0;t=t.r}return!1},tl=e=>{let t=e.inputs,r=e.outputs,s={n:"",e:"",t:0,o:{}},n=a=>{let l=a.o,o=[];for(let m in l)o.push(n(l[m]));return{e:a.e,t:a.t,l:o.sort(Ne),r:null}},i=(a,l)=>{let o=0;for(let m of a.l){let p=i(m,l+1);m.r=a,p>o&&(o=p)}return o+1};for(let a in t)Ie(s,Ce(a),0);for(let a in r){if(Ee(a))continue;let o=r[a].inputs;for(let m in o)Ie(s,Ce(m),o[m].bytesInOutput)}let u=n(s);for(;u.l.length===1;)u=u.l[0];return{a:u,f:i(u,0)}},ft=(e,t,r)=>{if(e===t)return;let s=t.r,n=s.t||1,i=0;ft(e,s,r);for(let u of s.l){if(u===t){r.u+=r.s*i/n,r.s=u.t/n*r.s;break}i+=u.t}r.p+=1},ke=e=>50*8*c.log(1+c.log(1+e/8)),jt=e=>{let t=d.createElement("div"),r=d.createElement("main"),s=tl(e),n=s.a,i=null,u=g=>{n!==g&&(n=g,p(),P())},a=g=>{i!==g&&(i=g,p(),P())},l=()=>{let g=d.createElement("div"),O=d.createElement("canvas"),x=O.getContext("2d"),U=()=>{let f=2*c.ceil(ke(s.f)),C=B.devicePixelRatio||1;w=c.min(c.round(innerWidth*.4),f),z=w,W=w>>1,A=z>>1,O.style.width=w+"px",O.style.height=z+"px",O.width=c.round(w*C),O.height=c.round(z*C),x.scale(C,C),pe()},he=(f,C,N,S,se,$,D)=>{let q=ke(C+1);if(q>A)return D;f===i&&($|=8);let de=(N+q)/2,te=S+se;if(te-D<1.5/de)return D;let X=2/de;if(se>X&&(X=se),$&2)x.fillStyle=Ve(x,f.e,W,A,1),x.beginPath(),x.arc(W,A,N,S,S+X,!1),x.arc(W,A,q,S+X,S,!0),x.fill(),i&&($&8||f.r===i)&&(x.fillStyle="rgba(255, 255, 255, 0.3)",x.fill());else{let ce=X===c.PI*2,Tt=$&4||ce?q:N;$&1&&N>0&&x.arc(W,A,N,S+X,S,!0),x.moveTo(W+Tt*c.cos(S),A+Tt*c.sin(S)),x.arc(W,A,q,S,S+X,!1),ce||x.lineTo(W+N*c.cos(S+X),A+N*c.sin(S+X))}let me=f.t,ge=$&10,Te=0,ne=-1/0;for(let ce of f.l)ne=he(ce,C+1,q,S+se*Te/me,ce.t/me*se,ge,ne),Te+=ce.t,ge|=4;return te},pe=()=>{x.clearRect(0,0,w,z),he(F,G,ke(G),J,re,3,-1/0),x.strokeStyle="#222",x.beginPath(),he(F,G,ke(G),J,re,1,-1/0),x.stroke(),G===0&&(x.fillStyle="#222",x.font="bold 16px sans-serif",x.textAlign="center",x.textBaseline="middle",x.fillText(le(L.t),W,A))},ee=-c.PI/2,w=0,z=0,W=0,A=0,V=null,ie=0,T=0,R=ee,_=c.PI*2,L=n,fe=T,oe=R,ae=_,F=n,G=T,J=R,re=_,h=f=>{let C=(D,q,de,te,X)=>{let me=ke(q+1);if(me>A)return null;if(se>=de&&se<me){let ne=$-te;if(ne/=c.PI*2,ne-=c.floor(ne),ne*=c.PI*2,ne<X)return D===F?D.r:D}let ge=D.t,Te=0;for(let ne of D.l){let ce=C(ne,q+1,me,te+X*Te/ge,ne.t/ge*X);if(ce)return ce;Te+=ne.t}return null},N=f.pageX,S=f.pageY;for(let D=O;D;D=D.offsetParent)N-=D.offsetLeft,S-=D.offsetTop;N-=W,S-=A;let se=c.sqrt(N*N+S*S),$=c.atan2(S,N);return C(F,G,ke(G),J,re)},b=()=>{let f=(et()-ie)/350;f<0||f>1?(f=1,V=null,F=L,fe=0,oe=ee,ae=c.PI*2):(f<.5?f*=4*f*f:(f=1-f,f*=4*f*f,f=1-f),V=Y(b)),G=T+(fe-T)*f,J=R+(oe-R)*f,re=_+(ae-_)*f,pe()},E=d.createElement("div"),v=(f,C,N)=>{E.style.display="block",E.style.left=f+"px",E.style.top=C+"px",E.innerHTML=N},y=()=>{E.style.display="none"},k=null,M=[];return U(),ze(pe),je(U),Ue(null),O.onmousemove=f=>{let C=h(f);if(a(C),C&&C!==F.r){let N=C.e;if(C.r){let S=C.r.e.length;N=H(N.slice(0,S))+"<b>"+H(N.slice(S))+"</b>"}else N="<b>"+H(N)+"</b>";ue===2?N+=H(Fe(Ae(C.e)," \u2013 ")):N+=" \u2013 "+H(le(C.t)),v(f.pageX,f.pageY+20,N),O.style.cursor="pointer"}else y()},O.onmouseout=()=>{a(null),y()},O.onclick=f=>{let C=h(f);if(!C)return;y();let N=[];C!==F.r?N=M.concat(n):M.length>0&&(C=M.pop(),N=M.slice()),C.l.length>0?(u(C),M=N):(f.preventDefault(),Se(e,C.e,C.t))},g.className="left",g.appendChild(O),g.appendChild(Oe),E.className="tooltip",r.appendChild(E),r.appendChild(g),[pe,()=>{if(k!==i&&(k=i,i||(O.style.cursor="auto",y()),V===null&&(V=Y(b))),L!==n){if(M.length=0,V===null&&(V=Y(b)),ie=et(),Bt(F,n)){let f={p:G,u:J,s:re};ft(F,n,f),G=f.p,J=f.u,re=f.s,fe=0,oe=ee,ae=c.PI*2,F=n}else if(Bt(n,F)){let f={p:0,u:ee,s:c.PI*2};ft(n,F,f),fe=f.p,oe=f.u,ae=f.s}else ie=-1/0,F=n;T=G,R=J,_=re,L=n}}]},o=()=>{let g=d.createElement("div"),O=()=>{let w=n.r,z=n.l,W=d.createElement("div"),A=1;W.className="bars";for(let T of z){let R=T.t;R>A&&(A=R)}if(x.length=0,U.length=0,w){let T=d.createElement("a");T.className="row",T.tabIndex=0,W.appendChild(T);let R=d.createElement("div");R.className="name",T.appendChild(R);let _=d.createElement("div");_.className="size",T.appendChild(_),T.href="javascript:void 0",R.textContent="../",T.onclick=()=>{u(w),ve&&U.length>0&&U[0].focus()},T.onfocus=T.onmouseover=()=>a(w),T.onblur=T.onmouseout=()=>a(null),x.push(w),U.push(T)}for(let T of z){let R=T.e.slice(n.e.length),_=le(T.t),L=d.createElement("a");L.className="row",L.tabIndex=0,W.appendChild(L);let fe=/^[^/]*\/?/.exec(R)[0],oe=d.createElement("div");oe.className="name",oe.innerHTML=H(fe)+"<span>"+R.slice(fe.length)+"</span>",L.appendChild(oe);let ae=d.createElement("div");ae.className="size",L.appendChild(ae);let F=d.createElement("div"),G=Ae(T.e);F.className=T.t?"bar":"bar empty",F.style.background=G,F.style.width=100*T.t/A+"%",ae.appendChild(F);let J=d.createElement("div");J.className="last",J.textContent=ue===2?Fe(G,""):_,F.appendChild(J),L.href="javascript:void 0",L.onclick=re=>{re.preventDefault(),T.l.length>0?(u(T),ve&&U.length>0&&U[0].focus()):Se(e,T.e,T.t)},L.onfocus=L.onmouseover=()=>a(T),L.onblur=L.onmouseout=()=>a(null),x.push(T),U.push(L)}let V=d.createElement("div");V.className="dir",V.textContent="Directory: ";let ie=d.createElement("div");ie.className="segments",V.appendChild(ie);for(let T=n;T;T=T.r){let R=T.e||"/",_=d.createElement("a");T.r&&(R=R.slice(T.r.e.length)),_.textContent=R,T!==n&&(_.href="javascript:void 0",_.onclick=L=>{L.preventDefault(),u(T),ve&&U.length>0&&U[!x[0]&&U.length>1?1:0].focus()}),ie.insertBefore(_,ie.firstChild),n==s.a&&(_.tabIndex=-1,x.unshift(n),U.unshift(_))}g.innerHTML="",g.appendChild(V),g.appendChild(W)},x=[],U=[],he=n,pe=null,ee=null;return g.className="details",r.appendChild(g),O(),[O,()=>{if(he!==n&&(he=n,O()),pe!==i){pe=i,ee&&(ee.classList.remove("hover"),ee=null);for(let w=i;w;w=w.r){let z=x.indexOf(w);if(z>=0){ee=U[z],ee.classList.add("hover");break}}}}]},[m,p]=l(),[I,P]=o();return Ye(()=>{m(),I()}),t.id="sunburstPanel",t.innerHTML='<div class="summary"><p>This visualization shows how much space each input file takes up in the final bundle. Input files that take up 0 bytes have been completely eliminated by tree-shaking.</p></div>',t.appendChild(r),t};var ll=e=>{let t=e.outputs,r=0,s=0,n=[],i,u=l=>" \u2013 "+le(l),a=l=>{let o=l.o,m=[];for(let p in o)m.push(a(o[p]));return{n:l.n,e:l.e,m:u(l.t),t:l.t,l:m.sort(Ne)}};for(let l in t){let o=l.split("/");o.pop(),i=Be(o.join("/"),i)}for(let l in t){if(Ee(l))continue;let m={n:i?l.split("/").slice(i.length).join("/"):l,e:"",t:0,o:{}},p=t[l],I=p.inputs,P=p.bytes;for(let g in I){let O=Ie(m,Ce(g),I[g].bytesInOutput);O>s&&(s=O)}m.t=P,r+=P,n.push(a(m))}e:for(;;){let l;for(let o of n){let m=o.l;if(!m.length)continue;if(m.length>1||m[0].l.length!==1)break e;let p=m[0].n;if(l===void 0)l=p;else if(l!==p)break e}if(l===void 0)break;for(let o of n){let m=o.l;if(m.length){m=m[0].l;for(let p of m)p.n=l+p.n;o.l=m}}s--}for(let l of n){let o=0;for(let m of l.l)o+=m.t;o<l.t&&l.l.push({n:"(unassigned)",e:"",m:u(l.t-o),t:l.t-o,l:[]})}return n.sort(Ne),{a:{n:"",e:"",m:"",t:r,l:n},f:s+1}},zt=e=>{let t=ll(e),r=t.a.t,s=0,n=r,i=d.createElement("div"),u=d.createElement("main"),a=d.createElement("canvas"),l=a.getContext("2d"),o=0,m=0,p=0,I=0,P=1,g=null,O=null,x="",U="14px sans-serif",he={},pe="bold "+U,ee={},w=0,z=ee,W=h=>{O!==h&&(O=h,a.style.cursor=h&&!h.l.length?"pointer":"auto",h||oe(),_())},A=(h,b)=>{let E=h[b];return E===void 0&&(E=l.measureText(String.fromCharCode(b)).width,h[b]=E),E},V=()=>{let h=B.devicePixelRatio||1;o=i.clientWidth+2*50,m=t.f*24+1,p=o-1e3>>1,I=p+1e3,p<0&&(p=0),I>o&&(I=o),I-=p,P=r/I,a.style.width=o+"px",a.style.height=m+"px",u.style.height=m+"px",a.width=c.round(o*h),a.height=c.round(m*h),l.scale(h,h),R()},ie=(h,b)=>{let E=w,v=h.length,y=0;for(;y<v&&(E+=A(z,h.charCodeAt(y)),!(E>b));)y++;return h.slice(0,y)+"..."},T=(h,b,E,v,y)=>{let k=I/(n-s),M=p+(E-s)*k,f=h.t*k,C=M+f;if(C<v+1.5)return v;if(M+f<0||M>o)return C;let N=f<2?2:f,S=(M>0?M:0)+5,se=b+24/2,$="",D="",q,de=0,te=f+M-S,X=h.e?Ve(l,h.e,p-s*k,24,k*P):Le,me="black",ge=-1/0;y&1?(me=x,l.font=pe,z=he,w=3*A(z,46)):(l.fillStyle=X,l.fillRect(M,b,N,24),(y&2||O&&h.e===O.e)&&(l.fillStyle="rgba(255, 255, 255, 0.3)",l.fillRect(M,b,N,24),y|=2)),w<te&&($=h.n,q=l.measureText($).width,q<=te?de+=q:($=ie($,te),de=te),l.fillStyle=me,l.fillText($,S,se)),y&1&&(l.font=U,z=ee,w=3*A(z,46)),de+w<te&&(D=ue===2?Fe(X," \u2013 "):h.m,q=l.measureText(D).width,de+q>te&&(D=ie(D,te-de)),l.globalAlpha=.5,l.fillText(D,S+de,se),l.globalAlpha=1);for(let Te of h.l)ge=T(Te,b+24,E,ge,y&-2),E+=Te.t;return y&1||(l.strokeStyle="#222",l.strokeRect(M,b,N,24)),C},R=()=>{let h=getComputedStyle(d.body),b=0,E=-1/0;g=null,x=h.getPropertyValue("--fg-on"),l.clearRect(0,0,o,m),l.textBaseline="middle";for(let v of t.a.l)E=T(v,0,b,E,1),b+=v.t},_=()=>{g===null&&(g=Y(R))},L=d.createElement("div"),fe=(h,b,E)=>{L.style.display="block",L.style.left=h+"px",L.style.top=b+"px",L.innerHTML=E;let v=L.offsetWidth;for(let y=L;y;y=y.offsetParent)v+=y.offsetLeft;v>o&&(L.style.left=h+o-v+"px")},oe=()=>{L.style.display="none"},ae=h=>{let b=(M,f,C)=>{if(y>=C&&y<C+M.t){if(v>=f&&v<f+24&&M.e)return M;if(v>=f+24)for(let N of M.l){let S=b(N,f+24,C);if(S)return S;C+=N.t}}return null},E=h.pageX,v=h.pageY;for(let M=a;M;M=M.offsetParent)E-=M.offsetLeft,v-=M.offsetTop;let y=s+(n-s)/I*(E-p),k=0;for(let M of t.a.l){let f=b(M,0,k);if(f)return f;k+=M.t}return null},F=(h,b,E)=>{let v=s,y=n,k=0;if(E!==null){let M=v+(y-v)/I*(E-p),f=c.pow(1.01,b);v=M+(v-M)*f,y=M+(y-M)*f}else k=h*(y-v)/I;v+k<0?k=-v:y+k>r&&(k=r-y),v+=k,y+=k,v<0&&(v=0),y>r&&(y=r),(s!==v||n!==y)&&(s=v,n=y,_())},G=h=>{let b=ae(h);if(W(b),b){let E=b.e,v=E.length-b.n.length;E=H(E.slice(0,v))+"<b>"+H(E.slice(v))+"</b>",ue===2?E+=H(Fe(Ae(b.e)," \u2013 ")):E+=" \u2013 "+H(le(b.t)),fe(h.pageX,h.pageY+20,E)}else oe()},J=!1;a.onmousedown=h=>{if(J=!1,h.button!==2){let b=h.pageX,E=y=>{let k=y.pageX-b;!J&&c.abs(k)<3||(J=!0,F(-k,0,null),b=y.pageX)},v=()=>{d.removeEventListener("mousemove",E),d.removeEventListener("mouseup",v)};h.preventDefault(),d.addEventListener("mousemove",E),d.addEventListener("mouseup",v)}},a.onmousemove=h=>{G(h)},a.onmouseout=h=>{W(null)},a.onclick=h=>{if(J)return;let b=ae(h);W(b),b&&!b.l.length&&Se(e,b.e,b.t)},Ue(h=>{if(Wt())return;let b=h.deltaX,E=h.deltaY,v=h.ctrlKey||h.metaKey;(v||c.abs(b)>=c.abs(E))&&h.preventDefault(),F(b,E,v?h.pageX:null),G(h)}),V(),Promise.resolve().then(V),ze(R),Ye(R),je(V),i.id="flamePanel",i.innerHTML='<div class="summary"><p>This visualization shows which input files were placed into each output file in the bundle. Use the scroll wheel with the '+(yt?"command":"control")+" key to zoom in and out.</p></div>",L.className="tooltip",u.appendChild(a),i.appendChild(u),i.appendChild(L);let re=d.createElement("section");return re.appendChild(Oe),i.appendChild(re),i};var Gt,rl=e=>{let t=e.inputs,r={},s=[];for(let n in t){let i=t[n];for(let u of i.imports)if(u.original&&u.original[0]!=="."){let a=r[u.original]||(r[u.original]=[]);a.includes(u.path)||a.push(u.path)}}for(let n in r){let i=r[n];if(i.length>1){let u=d.createElement("div"),a=d.createElement("ul"),l,o;u.className="warning",u.innerHTML="The import path <code>"+H(n)+"</code> resolves to multiple files in the bundle:";for(let m of i)l=Be(m,l);for(let m of i){let p=m.split("/");l&&(p=p.slice(l.length)),o=Ct(p.join("/"),o)}for(let m of i.sort()){let p=m.split("/").map(H),I=d.createElement("li"),P='<pre><a href="javascript:void 0">',g="";l&&l.length&&(P+='<span class="dim">'+p.slice(0,l.length).join("/")+"/</span>",p=p.slice(l.length)),o&&o.length&&(g='<span class="dim">'+(p.length>o.length?"/":"")+p.slice(p.length-o.length).join("/")+"</span>",p.length-=o.length),I.innerHTML=P+"<b>"+p.join("/")+"</b>"+g+"</a></pre>",a.appendChild(I),I.querySelector("a").onclick=()=>{Se(e,m,null)}}u.appendChild(a),s.push(u)}}return s},Jt=e=>{if(Gt===e)return;Gt=e;let t=d.getElementById("warningsPanel"),r=rl(e),s=r.length;if(s){t.innerHTML='<div class="expand">\u26A0\uFE0F This bundle has <b><a href="javascript:void 0">'+s+" warning"+(s===1?"":"s")+"</a></b><span>.</span></div>";let n=t.querySelector("span"),i=d.createElement("div");i.className="content";for(let u of r)i.appendChild(u);t.appendChild(i),t.querySelector("a").onclick=()=>{i.style.display==="block"?(n.textContent=".",i.style.display="none"):(n.textContent=":",i.style.display="block")}}else t.innerHTML=""};var nl=d.getElementById("startPanel"),il=d.getElementById("resultsPanel"),mt=d.getElementById("chartPanel"),ct=d.getElementById("useSunburst"),ht=d.getElementById("useFlame"),Pe=0,ue=0,gt=e=>typeof e=="object"&&e!==null&&!(e instanceof Array),Ge=e=>{let t=JSON.parse(e),r=Lt(t),s=i=>{Pe!==i&&(Pe===1?ct.classList.remove("active"):Pe===2&&ht.classList.remove("active"),Pe=i,mt.innerHTML="",Pe===1?(mt.appendChild(jt(t)),ct.classList.add("active"),lt("chart","sunburst")):Pe===2&&(mt.appendChild(zt(t)),ht.classList.add("active"),lt("chart","flame")))},n=i=>{ue!==i&&(ue=i,Ht(t,ue))};if(!gt(t)||!gt(t.inputs)||!gt(t.outputs))throw new Error("Invalid metafile format");nl.style.display="none",il.style.display="block",ct.onclick=()=>s(1),ht.onclick=()=>s(2),Pe=0,ue=0,At(t,()=>n(ue===1?2:1)),Jt(t),_e(),s(tt("chart")==="flame"?2:1),n(1)},ol=d.documentElement.dataset,Xt=()=>{ol.theme=tt("theme")+"",Re&&Re()};Xt();B.addEventListener("storage",Xt);
fetch(location.href.replace(/html$/, 'json')).then(e=>e.text()).then(Ge);
})();
</script>
</body>
</html>