https://www.debugbear.com/cdn/chunk-webp-to-jpeg.d2ca821c0c440bce698f.js

1"use strict";(("undefined"==typeof window?self:window).webpackChunkdebugbear_gae=("undefined"==typeof window?self:window).webpackChunkdebugbear_gae||[]).push([[3052],{89072(e,t,r){r.d(t,{O:()=>m}),r(25440),r(62953),r(3296),r(27208),r(48408);var i=r(94430),o=r(52300),s=r(72737),a=r(11178),l=r(41802),n=r(96540),d=r(74848);function c(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var i,o,s,a,l=[],n=!0,d=!1;try{if(s=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;n=!1}else for(;!(n=(i=s.call(r)).done)&&(l.push(i.value),l.length!==t);n=!0);}catch(e){d=!0,o=e}finally{try{if(!n&&null!=r.return&&(a=r.return(),Object(a)!==a))return}finally{if(d)throw o}}return l}}(e,t)||function(e,t){if(e){if("string"==typeof e)return u(e,t);var r={}.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?u(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function u(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,i=Array(t);r<t;r++)i[r]=e[r];return i}function h(e){let t=e.label,r=e.value,i=e.backgroundColor,o=void 0===i?"#f3f4f6":i,s=e.valueColor;return(0,d.jsxs)("div",{style:{padding:16,backgroundColor:o,borderRadius:8,flex:1,minWidth:150},children:[(0,d.jsx)("div",{style:{fontSize:13,color:"#6b7280"},children:t}),(0,d.jsx)("div",{style:{fontSize:20,fontWeight:600,color:s},children:r})]})}function m(e){var t,r;let u=e.config;const m=c((0,n.useState)(null),2),p=m[0],f=m[1],g=c((0,n.useState)(null),2),x=g[0],b=g[1],y=c((0,n.useState)(null),2),v=y[0],j=y[1],w=c((0,n.useState)(null),2),S=w[0],W=w[1],C=c((0,n.useState)(!1),2),k=C[0],P=C[1],z=c((0,n.useState)(null!==(t=u.defaultQuality)&&void 0!==t?t:.9),2),N=z[0],R=z[1],T=c((0,n.useState)(null),2),E=T[0],F=T[1],I=c((0,n.useState)(!1),2),U=I[0],L=I[1],O=(0,n.useRef)(null);(0,n.useEffect)(()=>{if(v){const e=URL.createObjectURL(v);return W(e),()=>URL.revokeObjectURL(e)}W(null)},[v]);const A=e=>{if(!e.type.startsWith("image/"))return void alert("Please select an image file");f(e),F(e.size),j(null);const t=new FileReader;t.onload=e=>{var t;const r=null===(t=e.target)||void 0===t?void 0:t.result;b(r),G(r,N)},t.readAsDataURL(e)},G=(e,t)=>{if(!O.current)return;P(!0);const r=new Image;r.onload=()=>{const e=O.current;e.width=r.width,e.height=r.height,e.getContext("2d").drawImage(r,0,0),e.toBlob(e=>{e&&j(e),P(!1)},u.outputFormat,t)},r.src=e},B=e=>{x&&G(x,e)},J=null!==(r=null==v?void 0:v.size)&&void 0!==r?r:null,D=E&&J?(100*(1-J/E)).toFixed(1):null;return(0,d.jsx)(a.K7,{isFullWidthWithoutSidebar:!0,header:(0,d.jsx)(i.V,{breadcrumbs:[{title:"Tools",href:"/tools"},{title:u.title}]}),children:(0,d.jsxs)("div",{style:{maxWidth:"100%",width:900,margin:"auto"},children:[(0,d.jsx)("h1",{style:{marginBottom:8,fontWeight:500},children:u.title}),(0,d.jsx)("p",{style:{color:"#6b7280",marginBottom:24},children:u.description}),(0,d.jsxs)("div",{onDrop:e=>{var t;e.preventDefault(),L(!1);const r=null===(t=e.dataTransfer.files)||void 0===t?void 0:t[0];r&&A(r)},onDragOver:e=>{e.preventDefault(),L(!0)},onDragLeave:e=>{e.preventDefault(),L(!1)},style:{border:"2px dashed "+(U?"#2563eb":"#d1d5db"),borderRadius:8,padding:64,textAlign:"center",backgroundColor:U?"#eff6ff":"#f9fafb",transition:"border-color 0.15s, background-color 0.15s"},children:[(0,d.jsx)("input",{type:"file",accept:"image/*",onChange:e=>{var t;const r=null===(t=e.target.files)||void 0===t?void 0:t[0];r&&A(r)},style:{display:"none"},id:"file-input"}),(0,d.jsx)("label",{htmlFor:"file-input",style:{cursor:"pointer",display:"inline-block",padding:"10px 20px",backgroundColor:"#2563eb",color:"#fff",borderRadius:6,fontWeight:500,marginBottom:0},children:"Select Image"}),(0,d.jsx)("p",{style:{marginTop:16,color:"#9ca3af",fontSize:14,marginBottom:0},children:"Or drag and drop an image here"}),p&&(0,d.jsxs)("p",{style:{marginTop:8,color:"#374151"},children:["Selected: ",p.name]})]}),v&&(0,d.jsxs)("div",{style:{marginBottom:24,marginTop:16},children:[(0,d.jsxs)("div",{style:{display:"flex",alignItems:"flex-end",justifyContent:"space-between",marginBottom:16,flexWrap:"wrap",gap:16},children:[(0,d.jsxs)("button",{onClick:()=>

1{if(!v||!p)return;const e=URL.createObjectURL(v),t=document.createElement("a");t.href=e;const r=p.name.replace(/\.[^/.]+$/,"");t.download=`${r}.${u.outputExtension}`,document.body.appendChild(t),t.click(),document.body.removeChild(t),URL.revokeObjectURL(e)},style:{padding:"10px 20px",backgroundColor:"#2563eb",color:"#fff",border:"none",borderRadius:6,fontWeight:500,cursor:"pointer"},children:["Download ",u.outputLabel]}),u.showQualitySlider&&(0,d.jsxs)("div",{style:{textAlign:"right"},children:[(0,d.jsxs)("label",{style:{display:"block",marginBottom:8,fontWeight:500},children:["Quality: ",Math.round(100*N),"%",k&&" (converting...)"]}),(0,d.jsx)("input",{type:"range",min:"0.05",max:"1",step:"0.05",value:N,onChange:e=>R(parseFloat(e.target.value)),onMouseUp:e=>B(parseFloat(e.target.value)),onTouchEnd:e=>B(parseFloat(e.target.value)),style:{width:300}})]})]}),(0,d.jsxs)("div",{style:{display:"flex",gap:16,flexWrap:"wrap"},children:[(0,d.jsx)(h,{label:"Original Size",value:E?(0,l.z3)(E):"-"}),(0,d.jsx)(h,{label:`${u.outputLabel} Size`,value:J?(0,l.z3)(J):"-"}),(0,d.jsx)(h,{label:D&&parseFloat(D)<0?"Size Increase":"Savings",value:D?`${Math.abs(parseFloat(D))}%`:"-",backgroundColor:D&&parseFloat(D)>0?"#dcfce7":"#fef3c7",valueColor:D&&parseFloat(D)>0?"#059669":"#d97706"})]})]}),S&&(0,d.jsx)("div",{style:{marginTop:24},children:(0,d.jsx)("img",{src:S,alt:"Converted preview",style:{maxWidth:"100%",maxHeight:400,border:"1px solid #e5e7eb",borderRadius:8}})}),u.faqItems&&(0,d.jsx)(o.$,{items:u.faqItems}),(0,d.jsxs)("div",{style:{marginTop:32},children:[(0,d.jsx)("h2",{style:{fontSize:18,fontWeight:500,marginBottom:16},children:"Learn more about image optimization"}),(0,d.jsx)("iframe",{width:"560",height:"315",src:"https://www.youtube-nocookie.com/embed/ExFVIQkyFxE?si=bhVA5-pHCwigE4Zj",title:"YouTube video player",frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",referrerPolicy:"strict-origin-when-cross-origin",allowFullScreen:!0,style:{maxWidth:"100%",borderRadius:8}})]}),(0,d.jsx)(s.U,{}),(0,d.jsx)("canvas",{ref:O,style:{display:"none"}})]})})}},75386(e,t,r){r.r(t),r.d(t,{WebpToJpeg:()=>s});var i=r(89072),o=r(74848);function s(){return(0,o.jsx)(i.O,{config:{title:"WebP to JPEG Converter",description:"Convert WebP images to JPEG directly in your browser.",outputFormat:"image/jpeg",outputExtension:"jpg",outputLabel:"JPEG",showQualitySlider:!0,defaultQuality:.9,faqItems:[{title:"When should I convert WebP to JPEG?",text:"JPEG is useful when you need to share images with software or platforms that don't support WebP, such as older image editors, email clients, or certain content management systems."},{title:"Does converting from WebP to JPEG affect quality?",text:"There can be some quality loss since JPEG uses lossy compression. Using a higher quality setting (85-95%) keeps the output visually close to the original while still producing a compatible file."},{title:"Is my image uploaded to a server?",text:"No. The entire conversion process happens locally in your browser. No data is sent over the network."},{title:"What happens to transparent areas?",text:"JPEG does not support transparency. Any transparent regions in the WebP source will appear as black in the converted JPEG file."},{title:"How do I choose the right quality level?",text:"For most photos, a quality of 85-90% offers a good balance between file size and visual fidelity. Lower values (60-75%) work well for thumbnails or previews where small artifacts are less noticeable."}]}})}},52300(e,t,r){r.d(t,{$:()=>s});var i=r(29262),o=r(74848);function s(e){let t=e.items;return t&&0!==t.length?(0,o.jsx)("div",{className:"mt-5",style:{maxWidth:1e3},children:t.map((e,t)=>(0,o.jsxs)("div",{className:"mb-4",children:[(0,o.jsx)("h2",{className:"h5",children:e.title}),(0,o.jsx)(i.UP,{text:e.text})]},t))}):null}},72737(e,t,r){r.d(t,{U:()=>c});var i=r(47166),o=r(90317),s=r(10242),a=r(77678),l=r(59880),n=r(32304),d=r(74848);function c(){const e=[{href:"/test/website-speed",title:"Website Speed Test",imagePath:"oneOffTests/ogImage-new.png"},{href:"/html-size-analyzer",title:"HTML Size Analyzer",imagePath:"html-size-analyzer-updated.png"},{href:"/site-speed-chrome-extension",title:"Site Speed Extension",imagePath:"ogImage/chrome-extension-new.png"},{href:"/resource-hint-validator",title:"Resource Hint Validator",imagePath:"resourceHints/og-image.png"},{href:"/test/ttfb",title:"TTFB Test",imagePath:"free-tools/ttfb-test.png"},{href:"/test/noscript",title:"NoScript Test",imagePath:"free-tools/noscript-test.png"},{href:"/json-size-analyzer",title:"JSON Size Analyzer",imagePath:"free-tools/json-size-analyzer.png"}].filter(e=>!location.href.includes(e.href)).slice(0,6),t={border:"1px solid #eee",borderRadius:4,boxShadow:"0 0 10px rgba(0,0,0,0.1)"};return(0,d.jsxs)("div",{children:[(0,d.jsxs)("div",{className:"mt-3 p-3 border-color-eee",style:{maxWidth:900,...t},children:[(0,d.jsx)("h3",{children:"Optimize Website Performance"}),(0,d.jsx)("div",{className:"row",children:(0,d.jsxs)("div",{className:"col-md-12",children:[(0,d.jsxs)("p",{children:["DebugBear is a web performance monitoring tool that helps you"," ",(0,d.jsx)("strong",{children:"keep your website fast and deliver a great user experience"}),"."]}),(0,d.jsxs)("div",{className:"row",children:[(0,d.jsxs)("div",{className:"col-md-6",children:[["Identify slow pages on your website","Improve page speed and Core Web Vitals","Get alerted to regressions"].map(e=>(0,d.jsxs)("div",{className:"d-flex align-items-center mb-1",children:[(0,d.jsx)("div",{className:"d-flex",children:(0,d.jsx)(o.P,{className:"mr-2",style:{color:"#28a745"}})}),(0,d.jsx)("div",{children:e})]},e)),(0,d.jsxs)("div",{children:[(0,d.jsx)("p",{className:"mt-3 mb-2",children:"Get Comprehensive Performance Insights:"}),(0,d.jsx)("div",{children:[{tile:"Synthetic monitoring",icon:l.c,tooltip:"Run scheduled performance tests to track page speed and Google Lighthouse scores over time.",href:"/synthetic-website-monitoring"},{tile:"Google CrUX data",icon:i.K,tooltip:"View the real user metrics from Google Chrome User Experience Report (CrUX) that impact SEO.",href:"/google-crux-monitoring"}

1,{tile:"Real user monitoring (RUM)",icon:a.k,tooltip:"Collect real user performance data to understand how your site performs for actual visitors.",href:"/real-user-monitoring"}].map(e=>{let t=e.tile,r=e.icon,i=e.tooltip,o=e.href;return(0,d.jsxs)("div",{className:"d-flex align-items-center mb-1",children:[(0,d.jsx)("div",{className:"d-flex mr-2",children:(0,d.jsx)(r,{})}),(0,d.jsxs)("div",{children:[t," ",(0,d.jsx)(n.c,{content:i,href:o})]})]},t)})})]}),(0,d.jsx)("div",{className:"mt-3",children:(0,d.jsxs)("a",{href:"/signup?utm_campaign=free-tools-cta",className:"btn btn-primary d-inline-flex align-items-center",style:{fontWeight:"500"},onClick:()=>{window.plausible("Click Free Tools Signup CTA")},target:"_blank",rel:"noreferrer",children:[(0,d.jsx)(s.A,{size:12}),(0,d.jsx)("div",{className:"ml-2",children:"Start Free Trial"})]})})]}),(0,d.jsx)("div",{className:"col-md-6",children:(0,d.jsx)("img",{style:{maxWidth:"100%",borderRadius:4,boxShadow:"0 0 10px rgba(0,0,0,0.2)"},src:"https://www.debugbear.com/dimg/f66a60a5cc2c3273ed6c080a00970e66.png"})})]})]})})]}),(0,d.jsxs)("div",{style:{maxWidth:900,...t},className:"p-3 border-color-eee mt-3",children:[(0,d.jsx)("h3",{className:"mb-0",children:"More Free Tools"}),(0,d.jsx)("div",{className:"row",children:e.map(e=>(0,d.jsx)("div",{className:"col-md-4 mt-3",children:(0,d.jsxs)("a",{href:e.href,children:[(0,d.jsx)("img",{src:`https://dbb.imgix.net/${e.imagePath}?q=100&height=261`,style:{width:"100%",borderRadius:4,boxShadow:"0 0 10px rgba(0,0,0,0.2)"}}),(0,d.jsx)("h4",{className:"mt-3 mb-0",style:{fontSize:18},children:e.title})]})},e.title))})]})]})}}}]);