@mixer/webpack-bundle-compare
Version:
Tool to compare webpack bundle files
1 lines • 43.9 kB
JavaScript
(self.webpackChunk_mixer_webpack_bundle_compare=self.webpackChunk_mixer_webpack_bundle_compare||[]).push([[944],{7713:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var a=n(3645),l=n.n(a)()((function(e){return e[1]}));l.push([e.id,".o_7QpsX6zScM9Ib5fAV8e{font-size:0.9em;color:rgba(255,255,255,0.8)}.o_7QpsX6zScM9Ib5fAV8e .row{margin-top:16px}.o_7QpsX6zScM9Ib5fAV8e p{line-height:1.5em}.F0wEKMtYGFjui-Tf2d_jI{text-align:center;margin-top:16px;font-size:2.5em}.F0wEKMtYGFjui-Tf2d_jI a{margin-right:0.5em}\n",""]),l.locals={wrapper:"o_7QpsX6zScM9Ib5fAV8e",icons:"F0wEKMtYGFjui-Tf2d_jI"};const o=l},3866:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var a=n(3645),l=n.n(a)()((function(e){return e[1]}));l.push([e.id,"._1RF8RgmHzdf5vLVcmU6wAS{font-weight:bold;color:rgba(255,255,255,0.8);text-decoration:none;line-height:40px;display:flex;align-items:center}._1RF8RgmHzdf5vLVcmU6wAS+._1RF8RgmHzdf5vLVcmU6wAS{margin-left:32px}a._1RF8RgmHzdf5vLVcmU6wAS:hover{color:#fff}.JjZSpTAGBpE1CBZBGgULV{color:#36cdc4;font-size:1.5em;margin-right:0.4em}\n",""]),l.locals={item:"_1RF8RgmHzdf5vLVcmU6wAS",icon:"JjZSpTAGBpE1CBZBGgULV"};const o=l},3413:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var a=n(3645),l=n.n(a)()((function(e){return e[1]}));l.push([e.id,"._3SbJRVYQKWUaFFNlpKZvlg{margin:32px;padding:16px;background:rgba(0,0,0,0.4);border-radius:4px;box-shadow:0 10px 50px rgba(0,0,0,0.3)}.yHDqJcEauT2Z669g1QPmH{display:flex;align-items:center;border-bottom:1px solid rgba(255,255,255,0.1);padding-bottom:16px;margin-bottom:16px}\n",""]),l.locals={wrapper:"_3SbJRVYQKWUaFFNlpKZvlg",header:"yHDqJcEauT2Z669g1QPmH"};const o=l},4516:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var a=n(3645),l=n.n(a)()((function(e){return e[1]}));l.push([e.id,".i1URmO5nEjcNycE-0psoA{background:none;border:none;color:currentColor;padding:0;margin:0;cursor:pointer}._1IpVD_3kRItizaEm4gJN6t{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;overflow-y:auto}._293VanfQzhqrUcrTcapw03{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.3)}.gV4C8i0GiGJpuolT28Pvh{position:relative;z-index:1;max-width:640px;margin:50px;padding:50px;border-radius:4px;box-shadow:0 10px 50px rgba(0,0,0,0.3);background:linear-gradient(#5c2686, #1c0658)}.gV4C8i0GiGJpuolT28Pvh h2:first-child{margin-top:0}.gV4C8i0GiGJpuolT28Pvh p{line-height:1.7em}.gV4C8i0GiGJpuolT28Pvh p+p{margin-top:1em}.gV4C8i0GiGJpuolT28Pvh h3{margin:32px 0 16px}.gV4C8i0GiGJpuolT28Pvh li{margin-left:20px;line-height:1.7em}.gV4C8i0GiGJpuolT28Pvh li+li{margin-top:4px}.gV4C8i0GiGJpuolT28Pvh code{font-size:0.8em;background:rgba(0,0,0,0.5);border-radius:2px;padding:0.1em}\n",""]),l.locals={button:"i1URmO5nEjcNycE-0psoA",overlay:"_1IpVD_3kRItizaEm4gJN6t",backdrop:"_293VanfQzhqrUcrTcapw03",contents:"gV4C8i0GiGJpuolT28Pvh"};const o=l},9500:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var a=n(3645),l=n.n(a)()((function(e){return e[1]}));l.push([e.id,"._4aI7WrYiX9L4xhc-4QAEA{background:rgba(0,0,0,0.1);font-family:var(--font-family-mono)}._4aI7WrYiX9L4xhc-4QAEA+._4aI7WrYiX9L4xhc-4QAEA{margin-top:32px}.EeWB-rqnpgxh3noGTNzYh{font-size:0.9em;padding:8px;border-bottom:1px solid rgba(255,255,255,0.1)}.PW-PTt6-iLdtu96Qyzf8V{align-items:center;display:flex}._1wOZDJDtzwCrWDPExx0pH3{font-size:0.9em;margin-bottom:0.3em}._5wzmsy0UWr0OiGFHkIue7{padding:12px 8px}._5wzmsy0UWr0OiGFHkIue7:nth-child(odd){background-color:rgba(255,255,255,0.05)}._20D2e3D8pfvoN_yRxHDDHc,._1G_tYdI4g1MsLj2SFJ4EA{font-size:0.8em}._20D2e3D8pfvoN_yRxHDDHc em,._1G_tYdI4g1MsLj2SFJ4EA em{width:30px;display:inline-block;text-align:right;margin-right:1em;color:rgba(255,255,255,0.5);font-style:normal}._1G_tYdI4g1MsLj2SFJ4EA{margin-top:8px}._1G_tYdI4g1MsLj2SFJ4EA li{list-style-type:none}\n",""]),l.locals={importBox:"_4aI7WrYiX9L4xhc-4QAEA",identifier:"EeWB-rqnpgxh3noGTNzYh",title:"PW-PTt6-iLdtu96Qyzf8V",filename:"_1wOZDJDtzwCrWDPExx0pH3",reason:"_5wzmsy0UWr0OiGFHkIue7",fakeLine:"_20D2e3D8pfvoN_yRxHDDHc",issuer:"_1G_tYdI4g1MsLj2SFJ4EA"};const o=l},4731:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var a=n(3645),l=n.n(a)()((function(e){return e[1]}));l.push([e.id,"._3G-sNM9ODiaolf1Jo80eun{border:none !important;color:rgba(255,255,255,0.8)}._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTable_header,._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTable_hasBottomBorder{border-color:rgba(0,0,0,0.1)}._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTable_scrollbarSpacer{background:rgba(0,0,0,0.1)}._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTable_header,._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTable_header .public_fixedDataTableCell_main{background:none}._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTable_footer .public_fixedDataTableCell_main{background:#f6f7f8;border-color:rgba(0,0,0,0.1)}._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTable_horizontalScrollbar .public_Scrollbar_mainHorizontal,._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTableRow_main{background-color:rgba(0,0,0,0.1)}._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTableRow_main{cursor:pointer}._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTableRow_main:hover{background-color:rgba(255,255,255,0.05)}._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTableCell_main{background:none;border-color:rgba(0,0,0,0.3)}._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTableCell_highlighted,._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTableRow_highlighted,._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTableRow_highlighted .public_fixedDataTableCell_main{background:none}._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTableCell_cellContent{padding:12px;font-size:0.8em}._3G-sNM9ODiaolf1Jo80eun .public_fixedDataTable_header .public_fixedDataTableCell_main{font-family:var(--font-family-mono);color:#fff;text-transform:uppercase;font-weight:normal}._3G-sNM9ODiaolf1Jo80eun .public_Scrollbar_main,._3G-sNM9ODiaolf1Jo80eun .public_Scrollbar_mainOpaque:hover,._3G-sNM9ODiaolf1Jo80eun .public_Scrollbar_faceActive:after{border:none;background:rgba(0,0,0,0.1)}._3G-sNM9ODiaolf1Jo80eun .public_Scrollbar_face:after{background:rgba(255,255,255,0.3)}._3ELmNjM-HORdyRQB5Abnbp{color:rgba(255,255,255,0.3)}\n",""]),l.locals={plot:"_3G-sNM9ODiaolf1Jo80eun",muted:"_3ELmNjM-HORdyRQB5Abnbp"};const o=l},4191:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var a=n(3645),l=n.n(a)()((function(e){return e[1]}));l.push([e.id,"._1dN_IA6pxUXcgAYsaLHL9U{font-size:1.1em;line-height:1.5em;padding-left:32px;position:relative;padding-top:1em}._1dN_IA6pxUXcgAYsaLHL9U+._1dN_IA6pxUXcgAYsaLHL9U{margin-top:1em;border-top:1px solid rgba(255,255,255,0.1)}._1dN_IA6pxUXcgAYsaLHL9U small{font-size:0.7em;color:rgba(255,255,255,0.7);display:block;font-size:0.9em}._1gK7RCCRDJNz-XbduBU6iK{position:absolute;top:1em;left:0;font-size:1.5em}._3Qgt9-2JmO5Byj3FykqXLp ._1gK7RCCRDJNz-XbduBU6iK{color:#f4d676}.mOnJPkgGIacUgy0S5VKlp ._1gK7RCCRDJNz-XbduBU6iK{color:#36cdc4}\n",""]),l.locals={tip:"_1dN_IA6pxUXcgAYsaLHL9U",icon:"_1gK7RCCRDJNz-XbduBU6iK",suggestion:"_3Qgt9-2JmO5Byj3FykqXLp",awesome:"mOnJPkgGIacUgy0S5VKlp"};const o=l},1187:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var a=n(3645),l=n.n(a)()((function(e){return e[1]}));l.push([e.id,".sDV4TkxM7xe4854Mwi1Va{color:rgba(255,255,255,0.4);background:rgba(0,0,0,0.1);padding:8px;position:relative}.sDV4TkxM7xe4854Mwi1Va+.sDV4TkxM7xe4854Mwi1Va{margin-top:16px}.sDV4TkxM7xe4854Mwi1Va._3KCt30YkE-QqKWcCazL-1h{cursor:pointer}.sDV4TkxM7xe4854Mwi1Va._3KCt30YkE-QqKWcCazL-1h:hover{background:rgba(255,255,255,0.1)}._3NlsLLj_Fy27uOou6Nmsmf{position:absolute;top:8px;right:8px;font-size:24px}._2Z5yg_PFDqwRKyC1-dJv2w{color:#fff;display:block;text-transform:uppercase;font-family:var(--font-family-mono);font-size:0.8em}.hFKgjC93q7-I9fixMx9dR,._1cKfUvtyxdDzNsxz9LKdTr{display:block;font-weight:200;font-size:20px;margin-top:8px}._1cKfUvtyxdDzNsxz9LKdTr{cursor:pointer;display:flex}.hFKgjC93q7-I9fixMx9dR{font-size:40px}._3b52VNR9TzBpgCqohrvrhb{display:flex;flex-wrap:wrap;margin:-1rem -0.5rem}._3b52VNR9TzBpgCqohrvrhb .sDV4TkxM7xe4854Mwi1Va{flex-basis:100%;margin:1rem 0.5rem}@media only screen and (min-width: 48em){._3b52VNR9TzBpgCqohrvrhb .sDV4TkxM7xe4854Mwi1Va{flex-basis:calc(33% - 1rem)}}.-b12TMiOPDuMS50GaKO-T{border:0.5em solid transparent;border-bottom-color:currentColor;width:1px;height:1px;transform:scaleX(0.5) translateY(33%) rotate(180deg);display:inline-block}.-b12TMiOPDuMS50GaKO-T._2V_SkLhkY-O_CvUyzsw8dt{transform:scaleX(0.5) translateY(-10%) rotate(0deg)}._3MJgm9hQhheh3P85CTsP3{font-size:0.7em;color:#1c0658;border-radius:3px;display:flex;align-items:center;padding:4px}._3MJgm9hQhheh3P85CTsP3 svg{font-size:1.5em}._3MJgm9hQhheh3P85CTsP3.eBt69q8GU32n_-NESnwq-{color:#36cdc4}._3MJgm9hQhheh3P85CTsP3._3ejWXlFuGk7ltTVZ9Hd-zz{background:#ff1690}._3MJgm9hQhheh3P85CTsP3._3KOiZa7TPsni_gfydNQhGU{background:#f4d676}\n",""]),l.locals={panel:"sDV4TkxM7xe4854Mwi1Va",clickable:"_3KCt30YkE-QqKWcCazL-1h",hint:"_3NlsLLj_Fy27uOou6Nmsmf",title:"_2Z5yg_PFDqwRKyC1-dJv2w",value:"hFKgjC93q7-I9fixMx9dR",delta:"_1cKfUvtyxdDzNsxz9LKdTr",arrangement:"_3b52VNR9TzBpgCqohrvrhb",arrow:"-b12TMiOPDuMS50GaKO-T",up:"_2V_SkLhkY-O_CvUyzsw8dt",moduleType:"_3MJgm9hQhheh3P85CTsP3",shake:"eBt69q8GU32n_-NESnwq-",cjs:"_3ejWXlFuGk7ltTVZ9Hd-zz",mixed:"_3KOiZa7TPsni_gfydNQhGU"};const o=l},9762:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var a=n(3645),l=n.n(a)()((function(e){return e[1]}));l.push([e.id,".u6fAqiSPBIbzqUlRv7jnZ{text-align:center;padding:50px;color:rgba(255,255,255,0.3)}\n",""]),l.locals={placeholder:"u6fAqiSPBIbzqUlRv7jnZ"};const o=l},6944:(e,t,n)=>{"use strict";n.r(t),n.d(t,{default:()=>Oe});var a=n(4276),l=n(7294),o=n(4494),r=n(5977),s=n(6966),i=n(6755),c=n(9747),d=n(3379),u=n.n(d),m=n(9762);u()(m.Z,{insert:"head",singleton:!1});const h=m.Z.locals||{},p=e=>l.createElement("div",{className:h.placeholder},e.children);var f=n(3122),g=n(6560);const b=(0,r.EN)(class extends l.PureComponent{constructor(){super(...arguments),this.state=this.buildData(),this.onClick=e=>{const t=a.DS.decode(e),n=(0,c.hw)(t);this.props.history.push(n?(0,f.bE)(n):(0,f.nR)(t))}}render(){return this.state.nodes.length?l.createElement(g.gr,{edges:this.state.edges,nodes:this.state.nodes,rootNode:this.state.entries,width:"100%",height:.9*window.innerHeight,onClick:this.onClick}):l.createElement(p,null,"No changes made in this bundle.")}buildData(){const e=(0,c.Sq)(this.props.previous,this.props.stats,this.props.chunkId),t=Object.values(e);return(0,g.Ky)(e,Object.values(t).filter((e=>e.toSize!==e.fromSize)))}}),E=()=>l.createElement(l.Fragment,null,l.createElement("h2",null,"Tree Shaking"),l.createElement("p",null,"Tree shaking eliminates dead code by only importing the code you use from modules. You want to choose (and build) dependencies that can be tree shaken to avoid having to deliver more code. Google/Chrome"," ",l.createElement("a",{href:"https://developers.google.com/web/fundamentals/performance/optimizing-javascript/tree-shaking/",target:"_blank"},"has a great article")," ","pertaining to tree shaking in general, and the Webpack documentation publishes"," ",l.createElement("a",{href:"https://webpack.js.org/guides/tree-shaking/",target:"_blank"},"some further guidance"),"."),l.createElement("h3",null,"tl;dr"),l.createElement("ul",null,l.createElement("li",null,"If you import a module, check"," ",l.createElement("a",{href:"https://bundlephobia.com/",target:"_blank"},"on Bundlephobia")," ","to see if it's tree-shakable. Shakable modules will have a green leaf icon below their name."),l.createElement("li",null,"If you author a module, make sure you publish a build that uses ES modules. Also, add the"," ",l.createElement("code",null,"sideEffects: false")," flag into your ",l.createElement("code",null,"package.json"),"."))),v=()=>l.createElement(l.Fragment,null,l.createElement("p",null,"Some code, such as polyfills, has a side-effect on the page when imported. Modules that have side-effects can't be tree-shaken as effectively, because the compiler can usually not 'prove' that doing so is safe."),l.createElement("p",null,"Modules which are side-effect free should be marked as such by adding the"," ",l.createElement("code",null,"sideEffects: false")," flag to their ",l.createElement("code",null,"package.json"),". See the"," ",l.createElement("a",{href:"https://webpack.js.org/guides/tree-shaking#mark-the-file-as-side-effect-free",target:"_blank"},"Webpack documentation")," ","for more information.")),y=()=>l.createElement(l.Fragment,null,l.createElement("h2",null,"Entrypoints"),l.createElement("p",null,"An entrypoint is the first JavaScript that's loaded when a user navigates to your website. This is the bundle that needs to be downloaded before any of your own code in Webpack actually runs. You still might need to load more data, such as a route, before you show anything meaningful. You should try to keep your entrypoint size as small as possible to reduce your time to"," ",l.createElement("a",{href:"https://developers.google.com/web/tools/lighthouse/audits/first-meaningful-paint",target:"_blank"},"time to first meaningful paint"),".")),k=()=>l.createElement(l.Fragment,null,l.createElement("h2",null,"Chunks and Sizes"),l.createElement("p",null,"A chunk is one bundle of code downloaded by webpack. You should make use of the available"," ",l.createElement("a",{href:"https://webpack.js.org/guides/lazy-loading/",target:"_blank"},"lazy loading")," ","tools available to you--such as"," ",l.createElement("a",{href:"https://reactjs.org/docs/code-splitting.html",target:"_blank"},"React.lazy"),", for instance--in order to have small, modular bundles. Loading only the code you need keeps your website fast and responsive. The"," ",l.createElement("a",{href:"https://developers.google.com/web/updates/2017/04/devtools-release-notes#coverage",target:"_blank"},"Chrome code coverage tool")," ","can help you find sections of your code which are good candidates for code splitting.")),_=()=>l.createElement(l.Fragment,null,l.createElement("h2",null,"Total Modules"),l.createElement("p",null,"The total modules is a count of the number of source files that Webpack read in your build. It does not directly have an effect on your output, but is a rough measure of complexity and monolithism.")),x=()=>l.createElement(l.Fragment,null,l.createElement("h2",null,"Unique Entrypoints"),l.createElement("p",null,"This is the number of different files that your code requires from the module. Usually you want to only import the file by its entrypoint, and allow tree shaking to prune unneeded code. What you should pay careful attention to here is making sure that you don't accidentally include multiple versions of the same dependency. This can easily happen if you have a dependency depends on a different version of this module that another one.")),w=()=>l.createElement(l.Fragment,null,l.createElement("h2",null,"Dependent Modules"),l.createElement("p",null,"This is the number of files, in your code or other dependency, that depend on this module. This number lets you easily see if you added or reduced coupling on this dependency.")),N=()=>l.createElement(l.Fragment,null,l.createElement("h2",null,"Total Module Size"),l.createElement("p",null,"This is how much filesize this module contributes to your code. This may differ from the Bundlephobia number shown on the page, for a few reasons:",l.createElement("ol",null,l.createElement("li",null,"The number here takes into account your unique tree-shaking graph."),l.createElement("li",null,"If you import a submodule from this dependency, it will not appear in Bundlephobia's analysis."),l.createElement("li",null,"Bundlephobia may not include certain processing that your custom webpack configuration applies.")),l.createElement("p",null,"The number shown here is the accurate, precise filesize that this dependency contributes to your bundle.")));var z=n(5108),S=(n(854),n(6116)),T=n(4731);u()(T.Z,{insert:"head",singleton:!1});const M=T.Z.locals||{};var C=function(e,t){var n={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var l=0;for(a=Object.getOwnPropertySymbols(e);l<a.length;l++)t.indexOf(a[l])<0&&Object.prototype.propertyIsEnumerable.call(e,a[l])&&(n[a[l]]=e[a[l]])}return n};const D=(0,r.EN)(class extends l.PureComponent{constructor(){super(...arguments),this.state={diffs:this.orderDiff(-2),order:-2,width:500},this.containerRef=l.createRef(),this.resize=()=>{this.setState({width:this.containerRef.current.clientWidth})},this.getRowClassName=e=>{const{fromSize:t,toSize:n}=this.state.diffs[e];return t===n?M.muted:null},this.diffCell=e=>{const{rowIndex:t}=e,n=C(e,["rowIndex"]),a=this.state.diffs[t];return l.createElement(z.Cell,Object.assign({},n,{height:40}),(0,f.dj)(a.fromSize,a.toSize,i),` (${(0,f.Co)(a.fromSize,a.toSize)})`)},this.totalHeader=()=>l.createElement(z.Cell,{height:40},l.createElement("a",{onClick:this.toggleOrderByTotal},"Total Size",-1===this.state.order&&l.createElement(S.mLR,null),1===this.state.order&&l.createElement(S.KKI,null))),this.diffHeader=()=>l.createElement(z.Cell,null,l.createElement("a",{onClick:this.toggleOrderByDiff},"Size Difference",-2===this.state.order&&l.createElement(S.mLR,null),2===this.state.order&&l.createElement(S.KKI,null))),this.nameCell=e=>{const{rowIndex:t}=e,n=C(e,["rowIndex"]);return l.createElement(z.Cell,Object.assign({},n),(0,c.Xw)(this.state.diffs[t].name))},this.totalSizeCell=e=>{const{rowIndex:t}=e,n=C(e,["rowIndex"]);return l.createElement(z.Cell,Object.assign({},n),i(this.state.diffs[t].toSize))},this.toggleOrderByDiff=()=>{const e=2!==Math.abs(this.state.order)?-2:-1*this.state.order;this.setState({order:e,diffs:this.orderDiff(e,this.state.diffs)})},this.toggleOrderByTotal=()=>{const e=1!==Math.abs(this.state.order)?-1:-1*this.state.order;this.setState({order:e,diffs:this.orderDiff(e,this.state.diffs)})},this.onRowClick=(e,t)=>{const n=this.state.diffs[t],a=(0,c.hw)(n.name);this.props.history.push(a?(0,f.bE)(a):(0,f.nR)(n.name))}}componentDidMount(){setTimeout(this.resize,10)}componentDidUpdate(e){e.last!==this.props.last&&this.setState({diffs:this.orderDiff(this.state.order)})}render(){return l.createElement("div",{ref:this.containerRef},l.createElement(z.Table,{rowHeight:32,width:this.state.width,maxHeight:700,headerHeight:40,rowsCount:this.state.diffs.length,className:M.plot,onRowClick:this.onRowClick,rowClassNameGetter:this.getRowClassName},l.createElement(z.Column,{cell:this.nameCell,width:100,flexGrow:1,header:"Module Name"}),l.createElement(z.Column,{cell:this.totalSizeCell,width:150,header:this.totalHeader}),l.createElement(z.Column,{cell:this.diffCell,width:180,header:this.diffHeader})))}orderDiff(e,t=Object.values((0,c.Sq)(this.props.first,this.props.last,this.props.inChunk))){const n=e<0?-1:1;return 1===e||-1===e?(t.sort(((e,t)=>(e.toSize-t.toSize)*n)),t):(t.sort(((e,t)=>{const a=e.toSize-e.fromSize,l=t.toSize-t.fromSize;return 0===a?1:0===l?-1:(a-l)*n})),t)}});var O=n(3935),V=n(4516);u()(V.Z,{insert:"head",singleton:!1});const j=V.Z.locals||{};class G extends l.PureComponent{constructor(){super(...arguments),this.state={open:!1},this.open=()=>{this.setState({open:!0})},this.close=()=>{this.setState({open:!1})}}render(){return l.createElement(l.Fragment,null,l.createElement("button",{onClick:this.open,className:(0,f.Sh)(j.button,this.props.className)},l.createElement(S.Osq,null)),this.state.open&&O.createPortal(l.createElement("div",{className:j.overlay},l.createElement("div",{className:j.backdrop,onClick:this.close}),l.createElement("div",{className:j.contents},l.createElement(this.props.hint,null))),document.body))}}var I=n(1187);u()(I.Z,{insert:"head",singleton:!1});const P=I.Z.locals||{},R=({onClick:e,value:t,footer:n,arrow:a,title:o,color:r,hint:s})=>l.createElement("div",{className:(0,f.Sh)(e&&P.clickable,P.panel),onClick:e},l.createElement("span",{className:P.title},o,":"),s&&l.createElement(G,{hint:s,className:P.hint}),l.createElement("span",{className:P.value,style:{color:r}},t,void 0!==a&&l.createElement("div",{className:(0,f.Sh)(P.arrow,0===a&&P.up)})),n);class J extends l.PureComponent{constructor(){super(...arguments),this.state={percent:!0},this.toggleMode=()=>{this.setState({percent:!this.state.percent})}}render(){const{oldValue:e,newValue:t,className:n,formatter:a}=this.props;return void 0===e?null:l.createElement("span",{className:n,onClick:this.toggleMode},this.state.percent?(0,f.Co)(e,t):(0,f.dj)(e,t,a))}}const U=({value:e,oldValue:t,title:n,formatter:a,hint:o,color:r,moreIsBetter:s})=>l.createElement(R,{title:n,color:r||A(e,t,s),hint:o,footer:l.createElement(J,{newValue:e,oldValue:t,className:P.delta,formatter:a}),value:(0,f.Bw)(e,a)}),A=(e,t,n)=>void 0===t?f.$_.blue:(n&&([t,e]=[e,t]),e<=t?f.$_.blue:e/t<1.02?f.$_.yellow:f.$_.pink),L=(e,t)=>{var n;if(!e)return 0;if(void 0===t)return e.totalSize;let a=0;for(const l of e.modules)(null===(n=l.chunks)||void 0===n?void 0:n.includes(t))&&(a+=l.size||0);return a},B=(0,r.EN)((({comparison:e,inChunk:t,history:n})=>{const a=L(e.old,t),o=L(e.new,t);return 0===a&&0===o?null:l.createElement(R,{title:e.name,value:i(o),color:o>a?f.$_.yellow:f.$_.blue,onClick:()=>n.push((0,f.bE)(e.name)),footer:l.createElement("span",{className:P.delta},e.old?e.new?l.createElement(J,{oldValue:a,newValue:o,formatter:i}):`Deleted (-${i(a)}`:"New (+100%)",l.createElement("span",{style:{flex:1}}),e.new&&l.createElement(F,{type:e.new.importType}))})})),F=({type:e})=>4&e&&2&e?l.createElement("span",{className:(0,f.Sh)(P.moduleType,P.mixed)},"Mixed Tree-Shaking"):2&e?l.createElement("span",{className:(0,f.Sh)(P.moduleType,P.shake)},l.createElement(S.QFv,null),"Tree-Shaken"):4&e?l.createElement("span",{className:(0,f.Sh)(P.moduleType,P.cjs)},l.createElement(S.N9K,null),"Not Tree-Shaken"):null,Y=e=>l.createElement("div",{className:P.arrangement},e.children),W=({first:e,last:t,chunk:n})=>{const a=e.chunks.find((e=>e.id===n)),o=t.chunks.find((e=>e.id===n)),r=(0,c.Ct)(e,t);return l.createElement(l.Fragment,null,l.createElement("div",{className:"row",style:{padding:1}},l.createElement("div",{className:"col-xs-12 col-sm-6"},l.createElement("h2",null,"Chunk Stats"),l.createElement(Y,null,l.createElement(U,{title:"Total Size",value:o?o.size:0,oldValue:a?a.size:0,formatter:i}),l.createElement(U,{title:"Node Modules",value:(0,c.W2)(t,n),oldValue:(0,c.W2)(e,n)}),l.createElement(U,{title:"Node Modules",value:(0,c.W2)(t,n),oldValue:(0,c.W2)(e,n)}),l.createElement(U,{title:"Node Module Size",value:(0,c.PF)(t,n),oldValue:(0,c.PF)(e,n),formatter:i}),l.createElement(U,{title:"Tree-Shaken Node Modules",hint:E,value:(0,c.d5)(t,n),oldValue:(0,c.d5)(e,n),formatter:f.T3}),l.createElement(U,{title:"Node Module Count",value:(0,c.pi)(t,n),oldValue:(0,c.pi)(e,n)})),l.createElement("h2",null,"Node Modules",l.createElement("small",null,"Click on a module to view more information about it.")),l.createElement(Y,null,r.sort(((e,t)=>(t.new?t.new.totalSize:0)-(e.new?e.new.totalSize:0))).map((e=>l.createElement(B,{comparison:e,key:e.name,inChunk:n})))),0===r.length&&l.createElement(p,null,"Huzzah! You have no dependencies!")),l.createElement("div",{className:"col-xs-12 col-sm-6"},l.createElement("h2",null,"Module List"),l.createElement(D,{first:e,last:t,inChunk:n}))),l.createElement("h2",null,"Bundle Tree",l.createElement("small",null,"Only changed files, and their parents, are displayed.")),l.createElement(b,{previous:e,stats:t,chunkId:n}))};var Z=n(7484),q=n(3727),K=n(3866);u()(K.Z,{insert:"head",singleton:!1});const H=K.Z.locals||{},$=e=>{const t=l.createElement(l.Fragment,null,l.createElement(e.icon,{className:H.icon})," ",e.children);return"string"==typeof e.href?l.createElement(q.rU,{to:e.href,className:H.item},t):l.createElement("span",{className:H.item,onClick:e.href,style:{cursor:e.href?"pointer":void 0}},t)},Q=({first:e,last:t})=>{const n=e.builtAt,a=t.builtAt;if(!n||!a)return null;let o=Z(n).format("YYYY-MM-DD"),r=Z(a).format("YYYY-MM-DD");return o===r&&(o=Z(n).format("YYYY-MM-DD HH:mm"),r=Z(a).format("HH:mm")),l.createElement($,{icon:S.B6n},"Built ",o," ",l.createElement(S.fNt,null)," ",r)},X=({last:e})=>{var t,n,a;return l.createElement($,{icon:S.SVk,href:(null===(t=e.warnings)||void 0===t?void 0:t.length)?"/dashboard/output":void 0},null!==(a=null===(n=e.warnings)||void 0===n?void 0:n.length)&&void 0!==a?a:0," Warnings")},ee=({last:e})=>{var t,n,a;return l.createElement($,{icon:S.abH,href:(null===(t=e.errors)||void 0===t?void 0:t.length)?"/dashboard/output":void 0},null!==(a=null===(n=e.errors)||void 0===n?void 0:n.length)&&void 0!==a?a:0," Errors")},te=(0,r.EN)((e=>l.createElement($,{icon:S.u1R,href:()=>e.history.goBack()},"Back")));var ne=n(979),ae=n(3368),le=n(7713);u()(le.Z,{insert:"head",singleton:!1});const oe=le.Z.locals||{};var re=n(3046);const se=e=>e?"Yes":"No",ie=({value:e,title:t,hint:n,goodValue:a=!0,formatter:o=se})=>l.createElement(R,{title:t,hint:n,color:!!e===a?f.$_.blue:f.$_.pink,value:o(e)});var ce=n(5501);class de extends l.PureComponent{componentDidMount(){(0,ne.VQ)(this.props.stats)&&this.props.retrieve(this.props.name)}componentDidUpdate(e){this.props.name!==e.name&&(0,ne.VQ)(this.props.stats)&&this.props.retrieve(this.props.name)}render(){const e=this.props.stats;switch(e.state){case ne.sM.Errored:return 404===e.error.statusCode?l.createElement(p,null,"This package does not appear to be published on the npm registry."):l.createElement(re.D,{errors:e.error});case ne.sM.Succeeded:return l.createElement("div",{className:oe.wrapper},l.createElement("p",null,"The following information was retrieved from the latest version of this package. You may be using an older version of the package in your build--Webpack stats do not tell us your package version."," ",l.createElement("a",{href:`https://bundlephobia.com/result?p=${this.props.name}`,target:"_blank"},"View this package on Bundlephobia")," ","for more information."),l.createElement("div",{className:"row"},l.createElement("div",{className:"col-xs-6"},l.createElement(R,{value:e.value.version,color:f.$_.blue,title:"Latest Version"})),l.createElement("div",{className:"col-xs-6"},l.createElement(U,{value:e.value.dependencyCount,title:"Dependencies"}))),l.createElement("div",{className:"row"},l.createElement("div",{className:"col-xs-6"},l.createElement(U,{value:e.value.size,title:"Minified Sized",formatter:i})),l.createElement("div",{className:"col-xs-6"},l.createElement(U,{value:e.value.gzip,title:"Gzipped Sized",formatter:i}))),l.createElement("div",{className:"row"},l.createElement("div",{className:"col-xs-6"},l.createElement(ie,{value:e.value.hasJSModule||e.value.hasJSNext,title:"Tree-Shakable",hint:E})),l.createElement("div",{className:"col-xs-6"},l.createElement(ie,{value:!e.value.hasSideEffects,title:"Side-Effect Free",hint:v}))),l.createElement("div",{className:oe.icons},e.value.repository&&l.createElement("a",{href:e.value.repository,target:"_blank"},l.createElement(S.JOq,null)),l.createElement("a",{href:`https://www.npmjs.com/package/${this.props.name}`,target:"_blank"},l.createElement(S.u06,null))));default:return l.createElement(ce.W,null)}}}const ue=(0,o.$j)(((e,{name:t})=>({stats:(0,s.lj)(e,t)})),(e=>({retrieve(t){e(ae.pn.request({name:t}))}})))(de),me=(e,t)=>(0,r.EN)(class extends l.PureComponent{constructor(){super(...arguments),this.state=this.buildData(),this.onClick=e=>{const t=a.DS.decode(e),n=(0,c.hw)(t);this.props.history.push(n?(0,f.bE)(n):(0,f.nR)(t))}}componentDidUpdate(t){this.props.stats===t.stats&&this.props.chunkId==this.props.chunkId&&e(this.props).map((e=>e.identifier)).join(",")===e(t).map((e=>e.identifier)).join(",")||this.setState(this.buildData())}render(){return l.createElement(g.gr,{edges:this.state.edges,nodes:this.state.nodes,rootNode:this.state.entries,width:"100%",height:.9*window.innerHeight,onClick:this.onClick})}buildData(){const n=e(this.props),l=(0,c.Sq)(this.props.previous,this.props.stats,this.props.chunkId),{nodes:o,edges:r}=(0,g.Ky)(l,n.map((e=>l[(0,c.BA)(e.name)])).filter((e=>!!e)));for(const e of r)[e.data.source,e.data.target]=[e.data.target,e.data.source];o.unshift({data:{id:"index",label:t(this.props),fontColor:"#fff",bgColor:f.$_.blue,width:20,height:20}});for(const e of n){if(!e.name)continue;const t=a.DS.encodeURI(e.name);r.push({data:{id:`${t}toIndex`,source:t,target:"index"}})}return{nodes:o,edges:r,entries:["index"]}}}),he=me((e=>(0,c.A$)(e.stats,e.name)),(e=>e.name)),pe=me((e=>e.root.name?(0,c.Wl)(e.stats,e.root.name):[]),(e=>(0,c.Xw)(e.root.name)));class fe extends l.PureComponent{constructor(){super(...arguments),this.state={limit:Math.min(this.props.defaultDisplay||100,this.props.count)},this.showMore=()=>{this.setState({limit:Math.min(this.props.count,this.state.limit+(this.props.defaultDisplay||100))})}}render(){const e=[];for(let t=0;t<this.state.limit;t++)e.push(this.props.children(t));return l.createElement(l.Fragment,null,e,this.state.limit<this.props.count&&l.createElement("a",{onClick:this.showMore},"Show More (",this.props.count-this.state.limit," left)"))}}var ge=n(9500);u()(ge.Z,{insert:"head",singleton:!1});const be=ge.Z.locals||{},Ee=({targets:e})=>0===e.length?l.createElement(p,null,"This module is not imported in the lastest build."):l.createElement(fe,{count:e.length},(t=>{var n,a;const o=e[t],r=(0,c.Bd)(o);return l.createElement("div",{key:t,className:be.importBox},l.createElement("div",{className:be.title},o.name," in chunk"," ",null!==(a=null===(n=(0,c.nx)(o).chunks)||void 0===n?void 0:n.join(", "))&&void 0!==a?a:"<anonymous>",l.createElement("span",{style:{flex:1}}),l.createElement(F,{type:(0,c.DQ)(o)})),l.createElement(fe,{count:r.length},(e=>l.createElement(ye,{key:e,reason:r[e]}))))})),ve=({targets:e})=>0===e.length?l.createElement(p,null,"This module is not imported in the lastest build."):l.createElement(fe,{count:e.length},(t=>{var n,a;const o=e[t];return o.issuerPath&&l.createElement("div",{key:t,className:be.importBox},l.createElement("div",{className:be.title},o.name," in chunk"," ",null!==(a=null===(n=(0,c.nx)(o).chunks)||void 0===n?void 0:n.join(", "))&&void 0!==a?a:"<anonymous>",l.createElement("span",{style:{flex:1}}),l.createElement(F,{type:(0,c.DQ)(o)})),l.createElement("ol",{className:be.issuer},o.issuerPath.map(((e,t)=>l.createElement("li",{key:t},l.createElement("em",null,t+1,".")," ",e.name)))))})),ye=({reason:e})=>{const t=e.userRequest?(0,c.Xw)(e.userRequest):e.moduleName;return l.createElement("div",{className:be.reason},l.createElement("div",{className:be.filename},e.module),l.createElement("div",{className:be.fakeLine},l.createElement("em",null,e.loc?e.loc.split(":")[0]:"?"),e.type&&e.type.includes("harmony")?`import "${t}"`:`require("${t}")`))},ke=({oldTargets:e,newTargets:t})=>l.createElement(Y,null,l.createElement(U,{title:"Total Size",hint:N,value:t.reduce(((e,t)=>e+(t.size||0)),0),oldValue:e.reduce(((e,t)=>e+(t.size||0)),0),formatter:i}),l.createElement(U,{title:"Unique Entrypoints",hint:x,value:t.length,oldValue:e.length,color:t.length>0?f.$_.pink:void 0}),l.createElement(U,{title:"Dependent Modules",hint:w,value:t.reduce(((e,t)=>e+(0,c.Bd)(t).length),0),oldValue:e.reduce(((e,t)=>e+(0,c.Bd)(t).length),0)})),_e=({first:e,last:t,name:n})=>{const a=(0,c.A$)(e,n),o=(0,c.A$)(t,n);return l.createElement(l.Fragment,null,l.createElement("div",{className:"row",style:{padding:1}},l.createElement("div",{className:"col-xs-12 col-sm-8"},l.createElement(ke,{oldTargets:a,newTargets:o}),l.createElement("h2",null,'Imports of "',n,'"'),l.createElement(Ee,{targets:o})),l.createElement("div",{className:"col-xs-12 col-sm-4"},l.createElement("h2",null,"Bundlephobia Stats"),l.createElement(ue,{name:n}),l.createElement("h2",null,"Issuer Tree",l.createElement("small",null,"The shortest from the entrypoint to this module")),l.createElement(ve,{targets:o}))),l.createElement("h2",null,"Import Tree",l.createElement("small",null,"A graph of all files that depend on the module.")),l.createElement(he,{previous:e,stats:t,name:n}))},xe=(0,r.EN)(class extends l.PureComponent{constructor(){super(...arguments),this.state=this.buildData(),this.onClick=e=>this.props.history.push(`/dashboard/chunk/${e}`)}render(){return l.createElement(g.gr,{edges:this.state.edges,nodes:this.state.nodes,rootNode:this.state.entries,width:"100%",height:.9*window.innerHeight,onClick:this.onClick})}buildData(){var e;const{stats:t,maxBubbleArea:n=150,minBubbleArea:a=30}=this.props,l=t.chunks,o=l.reduce(((e,t)=>Math.max(e,t.size)),0),r=[],s=l.map((e=>{e.entry&&r.push(String(e.id));const t=e.size/o,l=Math.max(a,n*t),s=this.props.previous.chunks.find((t=>t.id===e.id)),i=e.names&&e.names.length>0?e.names[0]:`Chunk ${e.id}`;return{data:(0,g.$I)({id:String(e.id),chunkId:e.id,shortLabel:""+e.id,label:i,fromSize:s?s.size:0,toSize:e.size,area:l})}})),i=[];for(const t of l)for(const n of null!==(e=t.parents)&&void 0!==e?e:[])i.push({data:{id:`edge${n}to${t.id}`,source:String(t.id),target:String(n)}});return{nodes:s,edges:i,entries:r}}});var we=n(4191);u()(we.Z,{insert:"head",singleton:!1});const Ne=we.Z.locals||{},ze=({first:e,last:t})=>l.createElement(l.Fragment,null,function(e,t){const n=(0,c.PF)(e),a=(0,c.PF)(t);return a>n+2048?l.createElement("div",{className:(0,f.Sh)(Ne.tip,Ne.suggestion)},l.createElement(S.Osq,{className:Ne.icon}),"Try to use smaller node modules, or eliminate ones you don't need."," ",l.createElement("a",{href:"https://bundlephobia.com/",target:"_blank",rel:"nofollow noopener"},"BundlePhobia")," ","can help you find smaller modules.",l.createElement("small",null,"The size of your node modules grew from ",i(n)," to"," ",i(a))):a<n-2048?l.createElement("div",{className:(0,f.Sh)(Ne.tip,Ne.awesome)},"You dropped ",i(n-a)," from your node modules size!",l.createElement("small",null,"Way to go!")):null}(e,t),function(e){const t=(0,c.Ud)(e),n=(0,c.mL)(e),a=n>t/2;return(a||n>524288)&&t>131072?l.createElement("div",{className:(0,f.Sh)(Ne.tip,Ne.suggestion)},l.createElement(S.Osq,{className:Ne.icon}),"Your entrypoint size is pretty big. Investigate code splitting and lazy loading to import only the code you need.",l.createElement("small",null,"Your entrypoint"," ",a?`contains the majority (${i(n)}) of your code.`:`is fairly large (${i(n)}).`)):n<t/5?l.createElement("div",{className:(0,f.Sh)(Ne.tip,Ne.awesome)},l.createElement(S.ZZh,{className:Ne.icon}),"Your code is split up well, your entrypoint is ",(0,f.T3)(n/t)," of your total code size.",l.createElement("small",null,"Way to go!")):null}(t),function(e){const t=(0,c.d5)(e);if(!(t>.8))return l.createElement("div",{className:(0,f.Sh)(Ne.tip,Ne.suggestion)},l.createElement(S.Osq,{className:Ne.icon}),"Some of your modules aren't tree shaken. Choose ones that can be tree-shaken to help reduce your bundle size.",l.createElement("small",null,(0,f.T3)(1-t)," of your dependencies aren't tree shaken."))}(t)),Se=({first:e,last:t})=>l.createElement(l.Fragment,null,l.createElement("div",{className:"row",style:{padding:1}},l.createElement("div",{className:"col-xs-12 col-sm-6"},l.createElement("h2",null,"Suggestions"),l.createElement(ze,{first:e,last:t}),l.createElement("h2",{style:{marginTop:64}},"Stats"),l.createElement(Y,null,l.createElement(U,{title:"Total Size",value:(0,c.Ud)(t),oldValue:(0,c.Ud)(e),formatter:i}),l.createElement(U,{title:"Download Time (3 Mbps)",value:(0,c.Ud)(t)/448e3*1e3,oldValue:(0,c.Ud)(e)/448e3*1e3,formatter:f.LU}),l.createElement(U,{title:"Avg. Chunk Size",value:(0,c.N6)(t),oldValue:(0,c.N6)(e),hint:k,formatter:i}),l.createElement(U,{title:"Entrypoint Size",hint:y,value:(0,c.mL)(t),oldValue:(0,c.mL)(e),formatter:i}),l.createElement(U,{title:"Total Modules",hint:_,value:(0,c.W2)(t),oldValue:(0,c.W2)(e)}),l.createElement(U,{title:"Node Module Size",value:(0,c.PF)(t),oldValue:(0,c.PF)(e),formatter:i}),l.createElement(U,{title:"Tree-Shaken Node Modules",hint:E,value:(0,c.d5)(t),oldValue:(0,c.d5)(e),formatter:f.T3}),l.createElement(U,{title:"Node Module Count",value:(0,c.pi)(t),oldValue:(0,c.pi)(e)}),l.createElement(U,{title:"Build Time",value:t.time,oldValue:e.time,formatter:f.LU}))),l.createElement("div",{className:"col-xs-12 col-sm-6"},l.createElement("h2",null,"Module List"),l.createElement(D,{first:e,last:t}))),l.createElement("h2",null,"Chunk Graph",l.createElement("small",null,"Larger chunks are shown in red, smaller ones in green. Click on a chunk to drill down.")),l.createElement(xe,{stats:t,previous:e})),Te=({first:e,last:t,name:n})=>{var a;const o=(0,c.mZ)(e)[n],r=(0,c.mZ)(t)[n],s=r||o;if(!s)return null;const d=(0,c.Wl)(e,n),u=(0,c.Wl)(t,n);return l.createElement(l.Fragment,null,l.createElement("div",{className:"row",style:{padding:1}},l.createElement("div",{className:"col-xs-12 col-sm-8"},l.createElement(Y,null,l.createElement(U,{title:"Total Size",value:null!==(a=null==r?void 0:r.size)&&void 0!==a?a:0,oldValue:o?o.size:0,formatter:i}),l.createElement(U,{title:"Dependent Modules",hint:w,value:u.length,oldValue:d.length}),l.createElement(U,{title:"Exports Used",value:r&&r.usedExports?r.usedExports.length:0,oldValue:o&&r.usedExports?o.usedExports.length:0})),l.createElement("h2",null,'Imports of "',(0,c.Xw)(s.name),'"'),l.createElement(Ee,{targets:u})),l.createElement("div",{className:"col-xs-12 col-sm-4"},l.createElement("h2",null,"Issuer Tree",l.createElement("small",null,"The shortest from the entrypoint to this module")),l.createElement(ve,{targets:u}))),l.createElement("h2",null,"Import Tree",l.createElement("small",null,"A graph of all files that depend on the module.")),l.createElement(pe,{previous:e,stats:t,root:s}))};var Me=n(3413);u()(Me.Z,{insert:"head",singleton:!1});const Ce=Me.Z.locals||{};class De extends l.PureComponent{constructor(){super(...arguments),this.renderOverview=()=>l.createElement(Se,{first:this.first,last:this.last}),this.renderChunkPage=({match:e})=>e&&l.createElement(W,{chunk:Number(e.params.chunkId),first:this.first,last:this.last}),this.renderNodeModule=({match:e})=>e&&l.createElement(_e,{name:a.DS.decode(e.params.encodedModule),first:this.first,last:this.last}),this.renderGenericModule=({match:e})=>e&&l.createElement(Te,{name:a.DS.decode(e.params.encodedModule),first:this.first,last:this.last})}get first(){return this.props.stats[0]}get last(){return this.props.stats[this.props.stats.length-1]}render(){const{first:e,last:t}=this;return e?l.createElement("div",{className:Ce.wrapper},l.createElement("div",{className:Ce.header},l.createElement(Q,{first:e,last:t}),l.createElement(ee,{last:t}),l.createElement(X,{last:t}),l.createElement("div",{style:{flex:1}}),l.createElement(te,null)),l.createElement(r.AW,{path:"/dashboard",exact:!0,component:this.renderOverview}),l.createElement(r.AW,{path:"/dashboard/chunk/:chunkId",exact:!0,component:this.renderChunkPage}),l.createElement(r.AW,{path:"/dashboard/nodemodule/:encodedModule",exact:!0,component:this.renderNodeModule}),l.createElement(r.AW,{path:"/dashboard/ownmodule/:encodedModule",exact:!0,component:this.renderGenericModule})):l.createElement(r.l_,{to:"/"})}}const Oe=(0,o.$j)((e=>({stats:(0,s.$u)(e)})))(De)},6560:(e,t,n)=>{"use strict";n.d(t,{Tt:()=>c,$I:()=>d,Ky:()=>u,gr:()=>h});var a=n(6755),l=n(4276),o=n(7294),r=n(9747),s=n(5501),i=n(3122);const c=(e,t)=>{const n=new Set;for(const t of e)n.add(t.data.id);const a=[];for(const e of t)n.has(e.data.source)&&n.has(e.data.target)&&a.push(e);return a},d=e=>{var{fromSize:t,toSize:n,area:l}=e,o=function(e,t){var n={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var l=0;for(a=Object.getOwnPropertySymbols(e);l<a.length;l++)t.indexOf(a[l])<0&&Object.prototype.propertyIsEnumerable.call(e,a[l])&&(n[a[l]]=e[a[l]])}return n}(e,["fromSize","toSize","area"]);const r=t<n?0:t>n?110:55,s=40+Math.min(60,Math.abs(n-t)/(n||1)*100);return Object.assign(Object.assign({},o),{label:`${o.label} (${a(n)}), ${(0,i.Co)(t,n)}`,fontColor:t!==n?"#fff":"#666",bgColor:t!==n?`hsl(${r}, ${s}%, 50%)`:"#666",width:Math.round(2*Math.sqrt(l/Math.PI)),height:Math.round(2*Math.sqrt(l/Math.PI))})},u=(e,t)=>{const n=Object.values(e).reduce(((e,t)=>Math.max(e,t.toSize)),0),a=[],{nodes:o,edges:s}=(({roots:e,getReasons:t,createNode:n,maxDepth:a=1/0,limit:o=1e3})=>{const r=e.map((e=>({node:e,depth:0}))),s=[],i=new Set(e.map((e=>e.name))),d=[];let u=!1;for(;r.length>0;){const{node:e,depth:c}=r.pop();if(c>a){u=!0;break}if(0==--o){u=!0;break}const m=l.DS.encodeURI(e.name);for(const n of t(e)){const e=l.DS.encodeURI(n.name);i.has(n.name)||(i.add(n.name),r.push({node:n,depth:c+1})),d.push({data:{id:`edge${m}to${e}`,source:m,target:e}})}s.push({data:Object.assign(Object.assign({},n(e,m)),{depth:c})})}return s.sort(((e,t)=>e.data.depth-t.data.depth)),{nodes:s,edges:u?c(s,d):d}})({roots:t,getReasons(t){const n=[];for(const o of[t.old,t.new])if(o)for(const s of(0,r.Bd)(o)){const o=e[(0,r.BA)(s.name||s.moduleName)];o&&n.push(o),s.type&&s.type.includes("entry")&&a.push(l.DS.encodeURI(t.name))}return n},createNode(e,t){const a=e.toSize/n,l=Math.max(30,150*a);return d({id:t,label:(0,r.Xw)(e.name),area:l,fromSize:e.fromSize,toSize:e.toSize})}});return{nodes:o,edges:s,entries:a}},m=o.lazy((()=>Promise.all([n.e(218),n.e(998)]).then(n.bind(n,6998)))),h=e=>o.createElement(o.Suspense,{fallback:o.createElement(s.W,null)},o.createElement(m,Object.assign({},e)))},9747:(e,t,n)=>{"use strict";n.d(t,{Xw:()=>l,BA:()=>o,Ud:()=>s,mL:()=>i,hw:()=>c,nx:()=>u,mZ:()=>h,DQ:()=>p,Sq:()=>b,Ct:()=>E,PF:()=>v,pi:()=>y,d5:()=>k,W2:()=>_,N6:()=>x,Bd:()=>w,A$:()=>N,Wl:()=>z});const a=/\/|\\/,l=e=>{if(!e)return"";const t=e.lastIndexOf("!");return-1===t?e:e.slice(t+1)},o=e=>e?e.replace(/ \+ [0-9]+ modules$/,""):"",r=e=>{const t=new WeakMap,n=e.length;return function(){let a=t;for(let e=0;e<n-1;e++){const t=arguments[e];if(a.has(t))a=a.get(t);else{const e=new Map;a.set(t,e),a=e}}const l=arguments[n-1];if(!a.has(l)){const t=e.apply(this,arguments);return a.set(l,t),t}return a.get(l)}},s=r((e=>e.chunks.reduce(((e,t)=>e+t.size),0))),i=r((e=>e.chunks.filter((e=>e.entry)).reduce(((e,t)=>e+t.size),0))),c=e=>{const t=l(e).split(a);for(let e=t.length-1;e>=0;e--){if("node_modules"!==t[e])continue;let n=t[e+1];return"@"===n[0]&&(n+="/"+t[e+2]),n}return null},d=new WeakMap,u=e=>d.get(e)||e,m=r(((e,t)=>{var n;const a=[];if(!e.modules)return a;for(const l of e.modules)if(void 0===t||(null===(n=l.chunks)||void 0===n?void 0:n.includes(t)))if(l.modules)for(const e of l.modules)a.push(e),d.set(e,l);else a.push(l);return a})),h=r(((e,t)=>{const n={};for(const a of m(e,t))n[o(a.name)]=a;return n})),p=e=>{let t=0;for(const n of w(e))n.type&&(t|=n.type.includes("cjs")?4:n.type.includes("harmony")?2:0);return t},f=r(((e,t)=>{const n={};for(const a of m(e,t)){const e=c(a.identifier);if(!e)continue;const t=p(a),l=n[e];l?(l.totalSize+=a.size||0,l.importType|=t,l.modules.push(a)):n[e]={name:e,totalSize:a.size||0,modules:[a],importType:t}}return n})),g=e=>e.includes("style-loader")||e.includes("css-loader")?1:e.startsWith("external ")?2:e.includes("node_modules")?3:0,b=(e,t,n)=>{const a=m(e,n),l=m(t,n),r={};for(const e of a){if(!e.identifier)continue;const t=o(e.name);r[t]={name:t,type:g(e.identifier),nodeModule:c(e.identifier)||void 0,toSize:0,fromSize:e.size||0,old:e}}for(const e of l){if(!e.identifier)continue;const t=o(e.name);r[t]?(r[t].new=e,r[t].toSize=e.size||0):r[t]={name:t,type:g(e.identifier),nodeModule:c(e.identifier)||void 0,fromSize:0,toSize:e.size||0,new:e}}return r},E=(e,t,n)=>{const a=f(e,n),l=f(t,n),o={};for(const e of Object.keys(a))o[e]={name:e,old:a[e]};for(const e of Object.keys(l))o[e]?o[e].new=l[e]:o[e]={name:e,new:a[e]};return Object.values(o)},v=r(((e,t)=>{let n=0;const a=f(e,t);for(const e of Object.keys(a))n+=a[e].totalSize;return n})),y=(e,t)=>Object.keys(f(e,t)).length,k=r(((e,t)=>{const n=Object.values(f(e,t));if(0===n.length)return 1;let a=0;for(const{importType:e}of n)2&e&&!(4&e)&&a++;return a/n.length})),_=(e,t)=>m(e,t).length,x=e=>{let t=0;for(const n of e.chunks)t+=n.size;return t/e.chunks.length},w=e=>e.reasons,N=(e,t)=>e.modules.filter((e=>e.name&&c(e.name)===t)),z=(e,t)=>{const n=h(e),a=n[t];return a?w(a).map((e=>n[e.moduleName])).filter(Boolean):[]}}}]);