1import{s as ll,n as Ye}from"../chunks/B2QSKqcC.js";import{S as il,i as nl,e as t,n as cl,f as e,g as M,h as l,j as o,k as a,p as de,l as i,s as d,q as ml,o as Re,r as xl,u as Cl,d as Tl,t as vl,a as hl,m as yl,c as Il,b as bl,w as Ol,x as jl,v as _l,C as Ml}from"../chunks/CPrDi1L-.js";import{e as $e}from"../chunks/-gASlQSi.js";import{P as zl}from"../chunks/Dl-2XSp9.js";/* empty css */function Ll(H,p,x){const v=H.slice();return v[1]=p[x],v}function wl(H){let p,x,v=H[1]+"",c,L;return{c(){p=i("li"),x=i("a"),c=Cl(v),this.h()},l(C){p=l(C,"LI",{});var y=de(p);x=l(y,"A",{href:!0});var w=de(x);c=xl(w,v),w.forEach(t),y.forEach(t),this.h()},h(){M(x,"href",L=H[1])},m(C,y){e(C,p,y),Re(p,x),Re(x,c)},p(C,y){y&1&&v!==(v=C[1]+"")&&ml(c,v),y&1&&L!==(L=C[1])&&M(x,"href",L)},d(C){C&&t(p)}}}function Ul(H){let p,x="HTTP Compression in 2026",v,c,L="HTTP compression reduces the size of text-based resources (HTML, CSS, JavaScript, JSON, SVG) transferred between servers and browsers. The two dominant algorithms are Gzip (the established default since the late 1990s) and Brotli (Google's newer alternative, standardised in 2015). Both are supported by every modern browser.",C,y,w="Gzip: The Established Standard",vt,k,re="Gzip uses the Deflate algorithm (a combination of LZ77 and Huffman coding). It has been the web's default compression since HTTP/1.1 formalised the <code>Content-Encoding: gzip</code> header.",ct,et,ue="Characteristics",mt,U,fe="<li>Universal support â every browser, proxy, and CDN handles Gzip</li> <li>Fast compression at typical server settings (level 6 is the common default)</li> <li>Compression levels 1â9 (higher = smaller output, slower encoding)</li> <li>Mature tooling and near-zero configuration required on all web servers</li>",xt,g,pe="Brotli: Better Ratios, Modern Design",Ct,B,ve="Brotli was developed by Google and published as RFC 7932 in 2016. It includes a built-in static dictionary of common web content (HTML tags, CSS properties, JavaScript keywords), which gives it a significant advantage over Gzip for typical web resources.",_t,N,he="Characteristics",Tt,lt,ce="<li>15â25 % smaller output than Gzip at comparable quality settings</li> <li>Compression levels 0â11 (levels 10â11 are very slow and intended for pre-compression)</li> <li>Built-in dictionary tuned for web content delivers outsized gains on HTML, CSS, and JS</li> <li>Supported in all modern browsers (Chrome, Firefox, Safari, Edge) over HTTPS</li> <li>Decompression speed is comparable to Gzip</li>",yt,q,me="Performance Comparison",bt,it,xe="<thead><tr><th>Metric</th> <th>Gzip (level 6)</th> <th>Brotli (level 4)</th> <th>Brotli (level 11)</th></tr></thead> <tbody><tr><td>Compression ratio (typical HTML)</td><td>~5.5Ã</td><td>~6.3Ã</td><td>~7.1Ã</td></tr> <tr><td>Compression speed</td><td>Fast</td><td>Comparable</td><td>Very slow</td></tr> <tr><td>Decompression speed</td><td>Fast</td><td>Fast</td><td>Fast</td></tr> <tr><td>Browser support</td><td>Universal</td><td>All modern (HTTPS)</td><td>All modern (HTTPS)</td></tr> <tr><td>CPU cost (server, real-time)</td><td>Low</td><td>Moderate</td><td>High</td></tr></tbody>",Ht,A,Ce="The key insight: Brotli at level 4â5 compresses better than Gzip at level 9 while being roughly as fast. Brotli at level 11 produces the smallest files but is impractical for on-the-fly compression.",Mt,W,_e="Server Configuration",Lt,D,Te="Nginx",wt,nt,ye=`<code># Gzip (typically in nginx.conf) 2gzip on; 3gzip_types text/plain text/css application/json application/javascript text/xml; 4gzip_comp_level 6; 5 6# Brotli (requires ngx_brotli module) 7brotli on; 8brotli_types text/plain text/css application/json application/javascript text/xml; 9brotli_comp_level 4;</code>`,St,I,be="Apache",Pt,st,He=`<code># Gzip 10LoadModule deflate_module modules/mod_deflate.so 11AddOutputFilterByType DEFLATE text/html text/css application/javascript application/json 12 13# Brotli (Apache 2.4.26+) 14LoadModule brotli_module modules/mod_brotli.so 15AddOutputFilterByType BROTLI_COMPRESS text/html text/css application/javascript application/json</code>`,kt,O,Me="Cloudflare",qt,ot,Le="Cloudflare automatically applies Brotli compression to eligible responses when the browser sends <code>Accept-Encoding: br</code>. No server-side configuration is needed.",Ft,F,we="Practical Strategy",Et,Y,Se="Pre-compression (Recommended for Static Sites)",gt,at,Pe="For static sites and build-time assets, pre-compress files at the highest level and serve the pre-compressed versions:",At,dt,ke=`<code># Pre-compress with Brotli level 11 at build time 16find ./dist -type f \\( -name "*.html"
16 -o -name "*.css" -o -name "*.js" -o -name "*.json" -o -name "*.svg" \\) \\ 17 -exec brotli --best --force {} \\;</code>`,It,R,qe="Configure your web server or CDN to serve <code>.br</code> files when the browser supports Brotli, falling back to Gzip or uncompressed.",Ot,$,Fe="Dynamic Compression",jt,G,Ee="For dynamically generated content (API responses, server-rendered HTML), use Brotli at level 4â5 for a good balance of speed and ratio, or Gzip at level 6 if CPU overhead is a concern.",zt,J,ge="When to Use Which",Ut,E,Ae="Use Brotli when:",Bt,X,Ie="<li>You are serving content over HTTPS (Brotli requires it)</li> <li>You can pre-compress at build time (use level 11)</li> <li>You want the smallest possible transfer sizes</li> <li>Your CDN supports Brotli (most do: Cloudflare, Fastly, AWS CloudFront)</li>",Nt,V,Oe="Use Gzip when:",Wt,K,je="<li>You need to support very old clients or proxies</li> <li>You are serving over plain HTTP (some implementations only use Brotli over HTTPS)</li> <li>Server CPU is constrained and you cannot pre-compress</li> <li>As a fallback for clients that do not advertise Brotli support</li>",Dt,j,ze="Frequently Asked Questions",Yt,rt,Ue="Should I use both Gzip and Brotli?",Rt,ut,Be="Yes. Serve Brotli to browsers that support it and fall back to Gzip for those that do not. Most CDNs and web servers handle this negotiation automatically based on the <code>Accept-Encoding</code> header.",$t,Q,Ne="Does Brotli work with HTTP/2 and HTTP/3?",Gt,Z,We="Yes. Compression is independent of the HTTP version. Brotli works identically over HTTP/1.1, HTTP/2, and HTTP/3.",Jt,tt,De="Is Zstandard coming to HTTP?",Xt,z,Zt="There is ongoing work to add Zstandard as a <code>Content-Encoding</code> option, but browser support remains experimental. For web content, Brotli is the practical choice for the foreseeable future.",pt,r,_="Related Resources",S,u,T=$e(H[0].relatedLinks),P=[];for(let f=0;f<T.length;f+=1)P[f]=wl(Ll(H,T,f));return{c(){p=i("h2"),p.textContent=x,v=d(),c=i("p"),c.textContent=L,C=d(),y=i("h2"),y.textContent=w,vt=d(),k=i("p"),k.innerHTML=re,ct=d(),et=i("h3"),et.textContent=ue,mt=d(),U=i("ul"),U.innerHTML=fe,xt=d(),g=i("h2"),g.textContent=pe,Ct=d(),B=i("p"),B.textContent=ve,_t=d(),N=i("h3"),N.textContent=he,Tt=d(),lt=i("ul"),lt.innerHTML=ce,yt=d(),q=i("h2"),q.textContent=me,bt=d(),it=i("table"),it.innerHTML=xe,Ht=d(),A=i("p"),A.textContent=Ce,Mt=d(),W=i("h2"),W.textContent=_e,Lt=d(),D=i("h3"),D.textContent=Te,wt=d(),nt=i("pre"),nt.innerHTML=ye,St=d(),I=i("h3"),I.textContent=be,Pt=d(),st=i("pre"),st.innerHTML=He,kt=d(),O=i("h3"),O.textContent=Me,qt=d(),ot=i("p"),ot.innerHTML=Le,Ft=d(),F=i("h2"),F.textContent=we,Et=d(),Y=i("h3"),Y.textContent=Se,gt=d(),at=i("p"),at.textContent=Pe,At=d(),dt=i("pre"),dt.innerHTML=ke,It=d(),R=i("p"),R.innerHTML=qe,Ot=d(),$=i("h3"),$.textContent=Fe,jt=d(),G=i("p"),G.textContent=Ee,zt=d(),J=i("h2"),J.textContent=ge,Ut=d(),E=i("h3"),E.textContent=Ae,Bt=d(),X=i("ul"),X.innerHTML=Ie,Nt=d(),V=i("h3"),V.textContent=Oe,Wt=d(),K=i("ul"),K.innerHTML=je,Dt=d(),j=i("h2"),j.textContent=ze,Yt=d(),rt=i("h3"),rt.textContent=Ue,Rt=d(),ut=i("p"),ut.innerHTML=Be,$t=d(),Q=i("h3"),Q.textContent=Ne,Gt=d(),Z=i("p"),Z.textContent=We,Jt=d(),tt=i("h3"),tt.textContent=De,Xt=d(),z=i("p"),z.innerHTML=Zt,pt=d(),r=i("h2"),r.textContent=_,S=d(),u=i("ul");for(let f=0;f<P.length;f+=1)P[f].c();this.h()},l(f){p=l(f,"H2",{id:!0,"data-svelte-h":!0}),o(p)!=="svelte-1eqtwd8"&&(p.textContent=x),v=a(f),c=l(f,"P",{"data-svelte-h":!0}),o(c)!=="svelte-r418mp"&&(c.textContent=L),C=a(f),y=l(f,"H2",{id:!0,"data-svelte-h":!0}),o(y)!=="svelte-cowd4a"&&(y.textContent=w),vt=a(f),k=l(f,"P",{"data-svelte-h":!0}),o(k)!=="svelte-1sbw25l"&&(k.innerHTML=re),ct=a(f),et=l(f,"H3",{"data-svelte-h":!0}),o(et)!=="svelte-1culzmw"&&(et.textContent=ue),mt=a(f),U=l(f,"UL",{"data-svelte-h":!0}),o(U)!=="svelte-17kya7z"&&(U.innerHTML=fe),xt=a(f),g=l(f,"H2",{id:!0,"data-svelte-h":!0}),o(g)!=="svelte-147u7o5"&&(g.textContent=pe),Ct=a(f),B=l(f,"P",{"data-svelte-h":!0}),o(B)!=="svelte-1i9f6od"&&(B.textContent=ve),_t=a(f),N=l(f,"H3",{"data-svelte-h":!0}),o(N)!=="svelte-1culzmw"&&(N.textContent=he),Tt=a(f),lt=l(f,"UL",{"data-svelte-h":!0}),o(lt)!=="svelte-nl9fjr"&&(lt.innerHTML=ce),yt=a(f),q=l(f,"H2",{id:!0,"data-svelte-h":!0}),o(q)!=="svelte-18mu10k"&&(q.textContent=me),bt=a(f),it=l(f,"TABLE",{"data-svelte-h":!0}),o(it)!=="svelte-uvnlym"&&(it.innerHTML=xe),Ht=a(f),A=l(f,"P",{"data-svelte-h":!0}),o(A)!=="svelte-6fd1hz"&&(A.textContent=Ce),Mt=a(f),W=l(f,"H2",{id:!0,"data-svelte-h":!0}),o(W)!=="svelte-114t5kd"&&(W.textContent=_e),Lt=a(f),D=l(f,"H3",{"data-svelte-h":!0}),o(D)!=="svelte-1taxkp6"&&(D.textContent=Te),wt=a(f),nt=l(f,"PRE",{"data-svelte-h":!0}),o(nt)!=="svelte-770d5x"&&(nt.innerHTML=ye),St=a(f),I=l(f,"H3",{"data-svelte-h":!0}),o(I)!=="svelte-kjakd6"&&(I.textContent=be),Pt=a(f),st=l(f,"PRE",{"data-svelte-h":!0}),o(st)!=="svelte-qfcbqj"&&(st.innerHTML=He),kt=a(f),O=l(f,"H3",{"data-svelte-h":!0}),o(O)!=="svelte-6s0cbn"&&(O.textContent=Me),qt=a(f),ot=l(f,"P",{"data-svelte-h":!0}),o(ot)!=="svelte-zej0co"&&(ot.innerHTML=Le),Ft=a(f),F=l(f,"H2",{id:!0,"data-svelte-h":!0}),o(F)!=="svelte-b2xmq3"&&(F.textContent=we),Et=a(f),Y=l(f,"H3",{"data-svelte-h":!0}),o(Y)!=="svelte-1ut5hiv"&&(Y.textContent=Se),gt=a(f),at=l(f,"P",{"data-svelte-h":!0}),o(at)!=="svelte-q5kvn7"&&(at.textContent=Pe),At=a(f),dt=l(f,"PRE",{"data-svelte-h":!0}),o(dt)!=="svelte-gmf8cx"&&(dt.innerHTML=ke),It=a(f),R=l(f,"P",{"data-svelte-h":!0}),o(R)!=="svelte-uaacan"&&(R.innerHTML=qe),Ot=a(f),$=l(f,"H3",{"data-svelte-h":!0}),o($)!=="svelte-upi9gf"&&($.textContent=Fe),jt=a(f),G=l(f,"P",{"data-svelte-h":!0}),o(G)!=="svelte-8a6b5q"&&(G.textContent=Ee),zt=a(f),J=l(f,"H2",{id:!0,"data-svelte-h":!0}),o(J)!=="svelte-1xjbaul"&&(J.textContent=ge),Ut=a(f),E=l(f,"H3",{"data-svelte-h":!0}),o(E)!=="svelte-ip0ptz"&&(E.textContent=Ae),Bt=a(f),X=l(f,"UL",{"data-svelte-h":!0}),o(X)!=="svelte-1lro1dd"&&(X.innerHTML=Ie),Nt=a(f),V=l(f,"H3",{"data-svelte-h":!0}),o(V)!=="svelte-1cpermf"&&(V.textContent=Oe),Wt=a(f),K=l(f,"UL",{"data-svelte-h":!0}),o(K)!=="svelte-17pzb8p"&&(K.innerHTML=je),Dt=a(f),j=l(f,"H2",{id:!0,"data-svelte-h":!0}),o(j)!=="svelte-hvsc9m"&&(j.textContent=ze),Yt=a(f),rt=l(f,"H3",{"data-svelte-h":!0}),o(rt)!=="svelte-1r7hr9q"&&(rt.textContent=Ue),Rt=a(f),ut=l(f,"P",{"data-svelte-h":!0}),o(ut)!=="svelte-1b6fzpn"&&(ut.innerHTML=Be),$t=a(f),Q=l(f,"H3",{"data-svelte-h":!0}),o(Q)!=="svelte-1i23ib"&&(Q.textContent=Ne),Gt=a(f),Z=l(f,"P",{"data-svelte-h":!0}),o(Z)!=="svelte-bolnm6"&&(Z.textContent=We),Jt=a(f),tt=l(f,"H3",{"data-svelte-h":!0}),o(tt)!=="svelte-qya4yy"&&(tt.textContent=De),Xt=a(f),z=l(f,"P",{"data-svelte-h":!0}),o(z)!=="svelte-3n67gl"&&(z.innerHTML=Zt),pt=a(f),r=l(f,"H2",{id:!0,"data-svelte-h":!0}),o(r)!=="svelte-15a7nw5"&&(r.textContent=_),S=a(f),u=l(f,"UL",{});var b=de(u);for(let ht=0;ht<P.length;ht+=1)P[ht].l(b);b.forEach(t),this.h()},h(){M(p,"id","overview"),M(y,"id","gzip"),M(g,"id","brotli"),M(q,"id","comparison"),M(W,"id","server-config"),M(F,"id","strategy"),M(J,"id","when-to-use"),M(j,"id","faq"),M(r,"id","related")},m(f,b){e(f,p,b),e(f,v,b),e(f,c,b),e(f,C,b),e(f,y,b),e(f,vt,b),e(f,k,b),e(f,ct,b),e(f,et,b),e(f,mt,b),e(f,U,b),e(f,xt,b),e(f,g,b),e(f,Ct,b),e(f,B,b),e(f,_t,b),e(f,N,b),e(f,Tt,b),e(f,lt,b),e(f,yt,b),e(f,q,b),e(f,bt,b),e(f,it,b),e(f,Ht,b),e(f,A,b),e(f,Mt,b),e(f,W,b),e(f,Lt,b),e(f,D,b),e(f,wt,b),e(f,nt,b),e(f,St,b),e(f,I,b),e(f,Pt,b),e(f,st,b),e(f,kt,b),e(f,O,b),e(f,qt,b),e(f,ot,b),e(f,Ft,b),e(f,F,b),e(f,Et,b),e(f,Y,b),e(f,gt,b),e(f,at,b),e(f,At,b),e(f,dt,b),e(f,It,b),e(f,R,b),e(f,Ot,b),e(f,$,b),e(f,jt,b),e(f,G,b),e(f,zt,b),e(f,J,b),e(f,Ut,b),e(f,E,b),e(f,Bt,b),e(f,X,b),e(f,Nt,b),e(f,V,b),e(f,Wt,b),e(f,K,b),e(f,Dt,b),e(f,j,b),e(f,Yt,b),e(f,rt,b),e(f,Rt,b),e(f,ut,b),e(f,$t,b),e(f,Q,b),e(f,Gt,b),e(f,Z,b),e(f,Jt,b),e(f,tt,b),e(f,Xt,b),e(f,z,b),e(f,pt,b),e(f,r,b),e(f,S,b),e(f,u,b);for(let ht=0;ht<P.length;ht+=1)P[ht]&&P[ht].m(u,null)},p(f,[b]){if(b&1){T=$e(f[0].relatedLinks);let ht;for(ht=0;ht<T.length;ht+=1){const Qt=Ll(f,T,ht);P[ht]?P[ht].p(Qt,b):(P[ht]=wl(Qt),P[ht].c(),P[ht].m(u,null))}for(;ht<P.length;ht+=1)P[ht].d(1);P.length=T.length}},i:Ye,o:Ye,d(f){f&&(t(p),t(v),t(c),t(C),t(y),t(vt),t(k),t(ct),t(et),t(mt),t(U),t(xt),t(g),t(Ct),t(B),t(_t),t(N),t(Tt),t(lt),t(yt),t(q),t(bt),t(it),t(Ht),t(A),t(Mt),t(W),t(Lt),t(D),t(wt),t(nt),t(St),t(I),t(Pt),t(st),t(kt),t(O),t(qt),t(ot),t(Ft),t(F),t(Et),t(Y),t(gt),t(at),t(At),t(dt),t(It),t(R),t(Ot),t($),t(jt),t(G),t(zt),t(J),t(Ut),t(E),t(Bt),t(X),t(Nt),t(V),t(Wt),t(K),t(Dt),t(j),t(Yt),t(rt),t(Rt),t(ut),t($t),t(Q),t(Gt),t(Z),t(Jt),t(tt),t(Xt),t(z),t(pt),t(r),t(S),t(u)),cl(P,f)}}}function Bl(H,p,x){let{article:v}=p;return H.$$set=c=>{"article"in c&&x(0,v=c.article)},[v]}
17class Nl extends il{constructor(p){super(),nl(this,p,Bl,Ul,ll,{article:0})}}const Wl=Object.freeze(Object.defineProperty({__proto__:null,default:Nl},Symbol.toStringTag,{value:"Module"}));function Sl(H,p,x){const v=H.slice();return v[1]=p[x],v}function Pl(H){let p,x,v=H[1]+"",c,L;return{c(){p=i("li"),x=i("a"),c=Cl(v),this.h()},l(C){p=l(C,"LI",{});var y=de(p);x=l(y,"A",{href:!0});var w=de(x);c=xl(w,v),w.forEach(t),y.forEach(t),this.h()},h(){M(x,"href",L=H[1])},m(C,y){e(C,p,y),Re(p,x),Re(x,c)},p(C,y){y&1&&v!==(v=C[1]+"")&&ml(c,v),y&1&&L!==(L=C[1])&&M(x,"href",L)},d(C){C&&t(p)}}}function Dl(H){let p,x="HTML File Extensions and Versions",v,c,L="HTML files on the web use a handful of file extensions: <code>.html</code>, <code>.htm</code>, <code>.xhtml</code>, and occasionally <code>.shtml</code>. The most common â and the only one you should use for new projects â is <code>.html</code>. But the story of how we got here involves the evolution from HTML to XHTML and finally to HTML5 (now simply called "HTML").",C,y,w=".html vs .htm",vt,k,re="The <code>.htm</code> extension exists because of a limitation in early operating systems. MS-DOS and Windows 3.x restricted file extensions to three characters (the 8.3 filename convention). Web servers on those systems used <code>.htm</code> because <code>.html</code> was not possible.",ct,et,ue="Today there is no functional difference between <code>.html</code> and <code>.htm</code>. Both are served with the MIME type <code>text/html</code>. However, <code>.html</code> is the standard and should be used for all new files.",mt,U,fe="A Brief History of HTML Versions",xt,g,pe="<thead><tr><th>Version</th> <th>Year</th> <th>Key Features</th></tr></thead> <tbody><tr><td>HTML 1.0</td><td>1993</td><td>Basic tags: headings, paragraphs, links, lists</td></tr> <tr><td>HTML 2.0</td><td>1995</td><td>Forms, tables (RFC 1866)</td></tr> <tr><td>HTML 3.2</td><td>1997</td><td>Applets, text flow around images, tables for layout</td></tr> <tr><td>HTML 4.01</td><td>1999</td><td>
17CSS support, frames, scripting improvements</td></tr> <tr><td>XHTML 1.0</td><td>2000</td><td>HTML reformulated as XML</td></tr> <tr><td>HTML5</td><td>2014</td><td>Semantic elements, canvas, video, audio, local storage</td></tr> <tr><td>HTML (Living)</td><td>2019â</td><td>Continuously updated specification</td></tr></tbody>",Ct,B,ve="The XHTML Detour",_t,N,he="In the early 2000s, the W3C pushed XHTML as the future of the web. XHTML reformulated HTML as strict XML, meaning:",Tt,lt,ce="<li>All tags must be closed (<code><br /></code> instead of <code><br></code>)</li> <li>All tag names and attributes must be lowercase</li> <li>Attribute values must be quoted</li> <li>Documents must be well-formed XML</li>",yt,q,me="XHTML files used the <code>.xhtml</code> extension and were served as <code>application/xhtml+xml</code>. In practice, most developers served XHTML as <code>text/html</code>, which meant browsers parsed it as HTML anyway â defeating the purpose.",bt,it,xe="XHTML 2.0 was abandoned in 2009 when it became clear the web community preferred the pragmatic approach of HTML5 over XML strictness.",Ht,A,Ce="HTML5 and the Living Standard",Mt,W,_e="HTML5 was developed by the WHATWG (Web Hypertext Application Technology Working Group) as a practical response to XHTML's strict approach. Key additions:",Lt,D,Te="<li><strong>Semantic elements</strong>: <code><article></code>, <code><section></code>, <code><nav></code>, <code><header></code>, <code><footer></code>, <code><main></code>, <code><aside></code></li> <li><strong>Multimedia</strong>: <code><video></code> and <code><audio></code> without plugins</li> <li><strong>Graphics</strong>: <code><canvas></code> for 2D drawing, plus SVG inline support</li> <li><strong>Forms</strong>: New input types (date, email, range, colour), validation attributes</li> <li><strong>APIs</strong>: Web Storage, Web Workers, Geolocation, History, Drag and Drop</li> <li><strong>Simplified doctype</strong>: <code><!DOCTYPE html></code></li>",wt,nt,ye='Since 2019, the specification is maintained as a "Living Standard" â there will be no HTML6. The spec is continuously updated, and new features are added incrementally.',St,I,be="The DOCTYPE Declaration",Pt,st,He="The doctype tells browsers which rendering mode to use:",kt,O,Me=`<code><!-- HTML5 / Living Standard --> 18<!DOCTYPE html> 19 20<!-- HTML 4.01 Strict --> 21<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 22 "http://www.w3.org/TR/html4/strict.dtd"> 23 24<!-- XHTML 1.0 Strict --> 25<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 26 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"></code>`,qt,ot,Le="Always use <code><!DOCTYPE html></code>. This triggers standards mode in all browsers and is the shortest valid doctype.",Ft,F,we=".shtml: Server-Side Includes",Et,Y,Se="The <code>.shtml</code> extension was used with Apache's Server-Side Includes (SSI) feature. When a server encountered a <code>.shtml</code> file, it would process SSI directives like:",gt,at,Pe="<code><!--#include virtual="/header.html" --></code>",At,dt,ke="This was an early form of templating. SSI has been superseded by server-side languages (PHP, Node.js, Python) and static site generators. You should not use <code>.shtml</code> in new projects.",It,R,qe="Modern Frameworks and Extensions",Ot,$,Fe="Many frameworks use custom extensions that compile to HTML:",jt,G,Ee="<thead><tr><th>Extension</th> <th>Framework</th> <th>Notes</th></tr></thead> <tbody><tr><td>.svelte</td><td>Svelte / SvelteKit</td><td>Component files with HTML, CSS, and JS in one file</td></tr> <tr><td>.jsx / .tsx</td><td>React</td><td>JavaScript/TypeScript with HTML-like JSX syntax</td></tr> <tr><td>.vue</td><td>Vue.js</td><td>Single-file components</td></tr> <tr><td>.astro</td><td>Astro</td><td>Island architecture components</td></tr> <tr><td>.blade.php</td><td>Laravel</td><td>PHP templating engine</td></tr> <tr><td>.ejs</td><td>Express.js</td><td>Embedded JavaScript templates</td></tr> <tr><td>.njk</td><td>Nunjucks</td><td>Mozilla's templating language</td></tr></tbody>",zt,J,ge="All of these ultimately produce <code>.html</code> output that browsers consume.",Ut,E,Ae="Best Practices for 2026",Bt,X,Ie="<li>Use <code>.html</code> as your file extension (not <code>.htm</code> or <code>.xhtml</code>)</li> <li>Use <code><!DOCTYPE html></code> â always</li> <li>Include <code><html lang="en"></code> (or appropriate language code)</li> <li>Use semantic elements for document structure</li> <li>Set <code><meta charset="utf-8"></code> as the first element in <code><head></code></li> <li>Set <code><meta name="viewport" content="width=device-width, initial-scale=1"></code> for responsive design</li>",Nt,V,Oe="Frequently Asked Questions",Wt,K,je="Is HTML5 still the right term?",Dt,j,ze='Technically, the specification is now just called "HTML" (the WHATWG Living Standard). However, "HTML5" is still widely understood and often used to distinguish modern HTML from HTML 4.01. Both terms refer to the same thing in practice.',Yt,rt,Ue="Can I use .html for XHTML content?",Rt,ut,Be
26="Yes, but there is no benefit. If you serve XHTML as <code>text/html</code>, browsers parse it as HTML anyway. If you serve it as <code>application/xhtml+xml</code>, a single well-formedness error will cause the page to fail entirely. Use standard HTML.",$t,Q,Ne="Does the file extension affect SEO?",Gt,Z,We="No. Search engines care about content, structure, and metadata â not file extensions. Many modern sites use no file extensions in URLs at all (e.g., <code>/about</code> instead of <code>/about.html</code>).",Jt,tt,De="Related Resources",Xt,z,Zt=$e(H[0].relatedLinks),pt=[];for(let r=0;r<Zt.length;r+=1)pt[r]=Pl(Sl(H,Zt,r));return{c(){p=i("h2"),p.textContent=x,v=d(),c=i("p"),c.innerHTML=L,C=d(),y=i("h2"),y.textContent=w,vt=d(),k=i("p"),k.innerHTML=re,ct=d(),et=i("p"),et.innerHTML=ue,mt=d(),U=i("h2"),U.textContent=fe,xt=d(),g=i("table"),g.innerHTML=pe,Ct=d(),B=i("h2"),B.textContent=ve,_t=d(),N=i("p"),N.textContent=he,Tt=d(),lt=i("ul"),lt.innerHTML=ce,yt=d(),q=i("p"),q.innerHTML=me,bt=d(),it=i("p"),it.textContent=xe,Ht=d(),A=i("h2"),A.textContent=Ce,Mt=d(),W=i("p"),W.textContent=_e,Lt=d(),D=i("ul"),D.innerHTML=Te,wt=d(),nt=i("p"),nt.textContent=ye,St=d(),I=i("h2"),I.textContent=be,Pt=d(),st=i("p"),st.textContent=He,kt=d(),O=i("pre"),O.innerHTML=Me,qt=d(),ot=i("p"),ot.innerHTML=Le,Ft=d(),F=i("h2"),F.textContent=we,Et=d(),Y=i("p"),Y.innerHTML=Se,gt=d(),at=i("pre"),at.innerHTML=Pe,At=d(),dt=i("p"),dt.innerHTML=ke,It=d(),R=i("h2"),R.textContent=qe,Ot=d(),$=i("p"),$.textContent=Fe,jt=d(),G=i("table"),G.innerHTML=Ee,zt=d(),J=i("p"),J.innerHTML=ge,Ut=d(),E=i("h2"),E.textContent=Ae,Bt=d(),X=i("ul"),X.innerHTML=Ie,Nt=d(),V=i("h2"),V.textContent=Oe,Wt=d(),K=i("h3"),K.textContent=je,Dt=d(),j=i("p"),j.textContent=ze,Yt=d(),rt=i("h3"),rt.textContent=Ue,Rt=d(),ut=i("p"),ut.innerHTML=Be,$t=d(),Q=i("h3"),Q.textContent=Ne,Gt=d(),Z=i("p"),Z.innerHTML=We,Jt=d(),tt=i("h2"),tt.textContent=De,Xt=d(),z=i("ul");for(let r=0;r<pt.length;r+=1)pt[r].c();this.h()},l(r){p=l(r,"H2",{id:!0,"data-svelte-h":!0}),o(p)!=="svelte-1sylr1y"&&(p.textContent=x),v=a(r),c=l(r,"P",{"data-svelte-h":!0}),o(c)!=="svelte-ykvh20"&&(c.innerHTML=L),C=a(r),y=l(r,"H2",{id:!0,"data-svelte-h":!0}),o(y)!=="svelte-1k1e9xa"&&(y.textContent=w),vt=a(r),k=l(r,"P",{"data-svelte-h":!0}),o(k)!=="svelte-u3vxsg"&&(k.innerHTML=re),ct=a(r),et=l(r,"P",{"data-svelte-h":!0}),o(et)!=="svelte-gzks15"&&(et.innerHTML=ue),mt=a(r),U=l(r,"H2",{id:!0,"data-svelte-h":!0}),o(U)!=="svelte-74ajck"&&(U.textContent=fe),xt=a(r),g=l(r,"TABLE",{"data-svelte-h":!0}),o(g)!=="svelte-zhbfqj"&&(g.innerHTML=pe),Ct=a(r),B=l(r,"H2",{id:!0,"data-svelte-h":!0}),o(B)!=="svelte-1vtsvvg"&&(B.textContent=ve),_t=a(r),N=l(r,"P",{"data-svelte-h":!0}),o(N)!=="svelte-49q38j"&&(N.textContent=he),Tt=a(r),lt=l(r,"UL",{"data-svelte-h":!0}),o(lt)!=="svelte-vm89q4"&&(lt.innerHTML=ce),yt=a(r),q=l(r,"P",{"data-svelte-h":!0}),o(q)!=="svelte-1mdez9g"&&(q.innerHTML=me),bt=a(r),it=l(r,"P",{"data-svelte-h":!0}),o(it)!=="svelte-13i77k9"&&(it.textContent=xe),Ht=a(r),A=l(r,"H2",{id:!0,"data-svelte-h":!0}),o(A)!=="svelte-1rs94te"&&(A.textContent=Ce),Mt=a(r),W=l(r,"P",{"data-svelte-h":!0}),o(W)!=="svelte-q5rjfx"&&(W.textContent=_e),Lt=a(r),D=l(r,"UL",{"data-svelte-h":!0}),o(D)!=="svelte-12gkbj6"&&(D.innerHTML=Te),wt=a(r),nt=l(r,"P",{"data-svelte-h":!0}),o(nt)!=="svelte-1wuaqnk"&&(nt.textContent=ye),St=a(r),I=l(r,"H2",{id:!0,"data-svelte-h":!0}
26),o(I)!=="svelte-1hdwzyh"&&(I.textContent=be),Pt=a(r),st=l(r,"P",{"data-svelte-h":!0}),o(st)!=="svelte-1c0tc6y"&&(st.textContent=He),kt=a(r),O=l(r,"PRE",{"data-svelte-h":!0}),o(O)!=="svelte-18s6cb5"&&(O.innerHTML=Me),qt=a(r),ot=l(r,"P",{"data-svelte-h":!0}),o(ot)!=="svelte-19snb1x"&&(ot.innerHTML=Le),Ft=a(r),F=l(r,"H2",{id:!0,"data-svelte-h":!0}),o(F)!=="svelte-1mc2nks"&&(F.textContent=we),Et=a(r),Y=l(r,"P",{"data-svelte-h":!0}),o(Y)!=="svelte-ndhokm"&&(Y.innerHTML=Se),gt=a(r),at=l(r,"PRE",{"data-svelte-h":!0}),o(at)!=="svelte-mykvgb"&&(at.innerHTML=Pe),At=a(r),dt=l(r,"P",{"data-svelte-h":!0}),o(dt)!=="svelte-q59nqd"&&(dt.innerHTML=ke),It=a(r),R=l(r,"H2",{id:!0,"data-svelte-h":!0}),o(R)!=="svelte-8re0sc"&&(R.textContent=qe),Ot=a(r),$=l(r,"P",{"data-svelte-h":!0}),o($)!=="svelte-t6wwjc"&&($.textContent=Fe),jt=a(r),G=l(r,"TABLE",{"data-svelte-h":!0}),o(G)!=="svelte-ta0dha"&&(G.innerHTML=Ee),zt=a(r),J=l(r,"P",{"data-svelte-h":!0}),o(J)!=="svelte-1ph58hg"&&(J.innerHTML=ge),Ut=a(r),E=l(r,"H2",{id:!0,"data-svelte-h":!0}),o(E)!=="svelte-1vu88n2"&&(E.textContent=Ae),Bt=a(r),X=l(r,"UL",{"data-svelte-h":!0}),o(X)!=="svelte-twt2xp"&&(X.innerHTML=Ie),Nt=a(r),V=l(r,"H2",{id:!0,"data-svelte-h":!0}),o(V)!=="svelte-hvsc9m"&&(V.textContent=Oe),Wt=a(r),K=l(r,"H3",{"data-svelte-h":!0}),o(K)!=="svelte-4404ao"&&(K.textContent=je),Dt=a(r),j=l(r,"P",{"data-svelte-h":!0}),o(j)!=="svelte-li8e2x"&&(j.textContent=ze),Yt=a(r),rt=l(r,"H3",{"data-svelte-h":!0}),o(rt)!=="svelte-1tkay0b"&&(rt.textContent=Ue),Rt=a(r),ut=l(r,"P",{"data-svelte-h":!0}),o(ut)!=="svelte-g2z8pd"&&(ut.innerHTML=Be),$t=a(r),Q=l(r,"H3",{"data-svelte-h":!0}),o(Q)!=="svelte-1fxeeb2"&&(Q.textContent=Ne),Gt=a(r),Z=l(r,"P",{"data-svelte-h":!0}),o(Z)!=="svelte-wg0479"&&(Z.innerHTML=We),Jt=a(r),tt=l(r,"H2",{id:!0,"data-svelte-h":!0}),o(tt)!=="svelte-15a7nw5"&&(tt.textContent=De),Xt=a(r),z=l(r,"UL",{});var _=de(z);for(let S=0;S<pt.length;S+=1)pt[S].l(_);_.forEach(t),this.h()},h(){M(p,"id","overview"),M(y,"id","html-vs-htm"),M(U,"id","html-history"),M(B,"id","xhtml"),M(A,"id","html5"),M(I,"id","doctype"),M(F,"id","shtml"),M(R,"id","modern-frameworks"),M(E,"id","best-practices"),M(V,"id","faq"),M(tt,"id","related")},m(r,_){e(r,p,_),e(r,v,_),e(r,c,_),e(r,C,_),e(r,y,_),e(r,vt,_),e(r,k,_),e(r,ct,_),e(r,et,_),e(r,mt,_),e(r,U,_),e(r,xt,_),e(r,g,_),e(r,Ct,_),e(r,B,_),e(r,_t,_),e(r,N,_),e(r,Tt,_),e(r,lt,_),e(r,yt,_),e(r,q,_),e(r,bt,_),e(r,it,_),e(r,Ht,_),e(r,A,_),e(r,Mt,_),e(r,W,_),e(r,Lt,_),e(r,D,_),e(r,wt,_),e(r,nt,_),e(r,St,_),e(r,I,_),e(r,Pt,_),e(r,st,_),e(r,kt,_),e(r,O,_),e(r,qt,_),e(r,ot,_),e(r,Ft,_),e(r,F,_),e(r,Et,_),e(r,Y,_),e(r,gt,_),e(r,at,_),e(r,At,_),e(r,dt,_),e(r,It,_),e(r,R,_),e(r,Ot,_),e(r,$,_),e(r,jt,_),e(r,G,_),e(r,zt,_),e(r,J,_),e(r,Ut,_),e(r,E,_),e(r,Bt,_),e(r,X,_),e(r,Nt,_),e(r,V,_),e(r,Wt,_),e(r,K,_),e(r,Dt,_),e(r,j,_),e(r,Yt,_),e(r,rt,_),e(r,Rt,_),e(r,ut,_),e(r,$t,_),e(r,Q,_),e(r,Gt,_),e(r,Z,_),e(r,Jt,_),e(r,tt,_),e(r,Xt,_),e(r,z,_);for(let S=0;S<pt.length;S+=1)pt[S]&&pt[S].m(z,null)},p(r,[_]){if(_&1){Zt=$e(r[0].relatedLinks);let S;for(S=0;S<Zt.length;S+=1){const u=Sl(r,Zt,S);pt[S]?pt[S].p(u,_):(pt[S]=Pl(u),pt[S].c(),pt[S].m(z,null))}for(;S<pt.length;S+=1)pt[S].d(1);pt.length=Zt.length}},i:Ye,o:Ye,d(r){r&&(t(p),t(v),t(c),t(C),t(y),t(vt),t(k),t(ct),t(et),t(mt),t(U),t(xt),t(g),t(Ct),t(B),t(_t),t(N),t(Tt),t(lt),t(yt),t(q),t(bt),t(it),t(Ht),t(A),t(Mt),t(W),t(Lt),t(D),t(wt),t(nt),t(St),t(I),t(Pt),t(st),t(kt),t(O),t(qt),t(ot),t(Ft),t(F),t(Et),t(Y),t(gt),t(at),t(At),t(dt),t(It),t(R),t(Ot),t($),t(jt),t(G),t(zt),t(J),t(Ut),t(E),t(Bt),t(X),t(Nt),t(V),t(Wt),t(K),t(Dt),t(j),t(Yt),t(rt),t(Rt),t(ut),t($t),t(Q),t(Gt),t(Z),t(Jt),t(tt),t(Xt),t(z)),cl(pt,r)}}}function Yl(H,p,x){let{article:v}=p;return H.$$set=c=>{"article"in c&&x(0,v=c.article)},[v]}class Rl extends il{constructor(p){super(),nl(this,p,Yl,Dl,ll,{article:0})}}const $l=Object.freeze(Object.defineProperty({__proto__:null,default:Rl},Symbol.toStringTag,{value:"Module"}));function kl(H,p,x){const v=H.slice();return v[1]=p[x],v}function ql(H){let p,x,v=H[1]+"",c,L;return{c(){p=i("li"),x=i("a"),c=Cl(v),this.h()},l(C){p=l(C,"LI",{});var y=de(p);x=l(y,"A",{href:!0});var w=de(x);
26c=xl(w,v),w.forEach(t),y.forEach(t),this.h()},h(){M(x,"href",L=H[1])},m(C,y){e(C,p,y),Re(p,x),Re(x,c)},p(C,y){y&1&&v!==(v=C[1]+"")&&ml(c,v),y&1&&L!==(L=C[1])&&M(x,"href",L)},d(C){C&&t(p)}}}function Gl(H){let p,x="Structured Data Formats Compared",v,c,L="JSON, XML, and YAML are the three most common text-based data serialisation formats in software development. Each has distinct strengths: JSON dominates web APIs, XML remains essential in enterprise systems and document markup, and YAML is the standard for configuration files in DevOps and cloud infrastructure.",C,y,w="JSON: JavaScript Object Notation",vt,k,re="JSON was formalised by Douglas Crockford in 2001 as a lightweight subset of JavaScript's object literal syntax. It has become the default data interchange format for web APIs.",ct,et,ue="Syntax",mt,U,fe=`<code>{ 27 "name": "Colin Mackay", 28 "age": 42, 29 "active": true, 30 "languages": ["TypeScript", "Python", "C#"], 31 "address": { 32 "city": "Edinburgh", 33 "country": "UK" 34 } 35}</code>`,xt,g,pe="Characteristics",Ct,B,ve="<li>Six data types: string, number, boolean, null, object, array</li> <li>No comments allowed (by specification)</li> <li>Keys must be quoted strings</li> <li>Trailing commas are not permitted</li> <li>Native parsing in all browsers and most languages</li> <li>Compact â minimal syntax overhead</li>",_t,N,he="Common uses",Tt,lt,ce="<li>REST and GraphQL API responses</li> <li>Package manifests (package.json, composer.json)</li> <li>Configuration (tsconfig.json, .eslintrc.json)</li> <li>NoSQL databases (MongoDB, CouchDB)</li>",yt,q,me="XML: Extensible Markup Language",bt,it,xe="XML was standardised by the W3C in 1998 as a general-purpose markup language. It is self-describing, extensible, and supports schemas, namespaces, and transformations.",Ht,A,Ce="Syntax",Mt,W,_e=`<code><?xml version="1.0" encoding="UTF-8"?> 36<person> 37 <name>Colin Mackay</name> 38 <age>42</age> 39 <active>true</active> 40 <languages> 41 <language>TypeScript</language> 42 <language>Python</language> 43 <language>C#</language> 44 </languages> 45 <address> 46 <city>Edinburgh</city> 47 <country>UK</country> 48 </address> 49</person></code>`,Lt,D,Te="Characteristics",wt,nt,ye="<li>Tag-based syntax with opening and closing tags</li> <li>Supports attributes and nested elements</li> <li>Comments allowed: <code><!-- comment --></code></li> <li>Schema validation (XSD, DTD, RelaxNG)</li> <li>Namespaces for avoiding name conflicts</li> <li>XSLT for transformations, XPath for querying</li> <li>Verbose â significantly larger than equivalent JSON or YAML</li>",St,I,be="Common uses",Pt,st,He="<li>SOAP web services</li> <li>RSS and Atom feeds</li> <li>SVG images, XHTML documents</li> <li>Office documents (OOXML: .docx, .xlsx, .pptx are ZIP archives of XML)</li> <li>Android layouts, Maven/Gradle build files</li> <li>Sitemaps (sitemap.xml)</li>",kt,O,Me="YAML: YAML Ain't Markup Language",qt,ot,Le="YAML was first released in 2001 as a human-friendly data serialisation format. It uses indentation for structure (similar to Python) and has become the standard for configuration in DevOps tools.",Ft,F,we="Syntax",Et,Y,Se=`<code>name: Colin Mackay 50age: 42 51active: true 52languages: 53 - TypeScript 54 - Python 55 - C# 56address: 57 city: Edinburgh 58 country: UK</code>`,gt,at,Pe="Characteristics",At,dt,ke="<li>Indentation-based (spaces only â tabs are not allowed)</li> <li>Comments allowed: <code># comment</code></li> <li>Supports anchors and aliases for reusable nodes</li> <li>Multi-line strings with <code>|</code> (literal block) or <code>></code> (folded block)</li> <li>Type inference (bare <code>true</code>, <code>42</code>, <code>null</code> are typed automatically)</li> <li>Superset of JSON â valid JSON is valid YAML</li> <li>Multiple documents in one file using <code>---</code> separator</li>",It,R,qe="Common uses",Ot,$,Fe="<li>CI/CD pipelines (GitHub Actions, GitLab CI, Azure Pipelines)</li> <li>Container orchestration (Docker Compose, Kubernetes manifests)</li> <li>
58Infrastructure as code (Ansible, CloudFormation)</li> <li>Static site generators (Hugo, Jekyll front matter)</li>",jt,G,Ee="Head-to-Head Comparison",zt,J,ge="<thead><tr><th>Feature</th> <th>JSON</th> <th>XML</th> <th>YAML</th></tr></thead> <tbody><tr><td>Human readability</td><td>Good</td><td>Moderate</td><td>Excellent</td></tr> <tr><td>Verbosity</td><td>Low</td><td>High</td><td>Very low</td></tr> <tr><td>Comments</td><td>No</td><td>Yes</td><td>Yes</td></tr> <tr><td>Schema validation</td><td>JSON Schema</td><td>XSD, DTD, RelaxNG</td><td>JSON Schema (via conversion)</td></tr> <tr><td>Data types</td><td>6 types</td><td>Text only (schema-defined)</td><td>Auto-typed</td></tr> <tr><td>Parsing speed</td><td>Fast</td><td>Moderate</td><td>Slow</td></tr> <tr><td>Whitespace sensitivity</td><td>No</td><td>No</td><td>Yes (indentation)</td></tr> <tr><td>Browser native support</td><td>Yes (JSON.parse)</td><td>Yes (DOMParser)</td><td>No</td></tr> <tr><td>Binary data</td><td>Base64 encoded</td><td>Base64 or CDATA</td><td>Base64 encoded</td></tr> <tr><td>File extensions</td><td>.json</td><td>.xml</td><td>.yaml, .yml</td></tr></tbody>",Ut,E,Ae="File Size Comparison",Bt,X,Ie="Representing the same data structure, typical size ratios:",Nt,V,Oe="<li><strong>JSON</strong>: Baseline (1Ã)</li> <li><strong>YAML</strong>: ~0.8Ã (slightly smaller due to no braces or quotes on keys)</li> <li><strong>XML</strong>: ~1.5â2Ã (opening and closing tags add overhead)</li>",Wt,K,je="After gzip/Brotli compression, the differences shrink significantly because repetitive tag structures compress well.",Dt,j,ze="YAML Gotchas",Yt,rt,Ue="YAML's type inference can cause unexpected behaviour:",Rt,ut,Be="<li><code>no</code> and <code>off</code> are parsed as boolean <code>false</code> (in YAML 1.1)</li> <li><code>3.10</code> may be parsed as <code>3.1</code> (float, not string "3.10")</li> <li>Norway's country code <code>NO</code> becomes <code>false</code></li> <li>Unquoted strings that look like numbers, booleans, or dates are auto-typed</li>",$t,Q,Ne="YAML 1.2 (2009) reduced some of these issues, but not all parsers use 1.2 by default. When in doubt, quote your values.",Gt,Z,We="When to Use Each Format",Jt,tt,De="Choose JSON when:",Xt,z,Zt="<li>Building web APIs or communicating between services</li> <li>Storing data in NoSQL databases</li> <li>Working in JavaScript/TypeScript ecosystems</li> <li>You need fast parsing and broad language support</li>",pt,r,_="Choose XML when:",S,u,T="<li>Working with SOAP services or legacy enterprise systems</li> <li>You need document-oriented markup (mixed content with text and elements)</li> <li>Schema validation is critical</li> <li>Using RSS/Atom feeds or sitemaps</li>",P,f,b="Choose YAML when:",ht,Qt,sl="<li>Writing configuration files for DevOps tools</li> <li>Human readability and editability are the priority</li> <li>Working with CI/CD pipelines or Kubernetes</li> <li>You need comments in your configuration</li>",Ge,te,ol="Frequently Asked Questions",Je,ie,al="Is JSON5 a good alternative to JSON?",Xe,ne,dl="JSON5 adds comments, trailing commas, and unquoted keys to JSON. It is useful for configuration files but is not suitable for APIs â there is no browser-native parser. Consider using JSONC (JSON with Comments) in VS Code or YAML for configuration needs.",Ve,se,rl="Is TOML better than YAML for configuration?",Ke,oe,ul="TOML (Tom's Obvious Minimal Language) avoids YAML's whitespace sensitivity and type inference gotchas. It is used by Rust (Cargo.toml) and Python (pyproject.toml). For simple configuration, TOML is often clearer. For deeply nested structures, YAML may be more readable.",Qe,ae,fl="Can I convert between formats?",Ze,ee,pl="Yes. Most data can be round-tripped between JSON, XML, and YAML, though XML attributes and mixed content do not map cleanly to JSON or YAML. Tools like <code>yq</code>, <code>jq</code>, and <code>xmlstarlet</code> handle conversions on the command line.",tl,le,el="Related Resources",Vt,n,h=$e(H[0].relatedLinks),ft=[];for(let s=0;s<h.length;s+=1)ft[s]=ql(kl(H,h,s));return{c(){p=i("h2"),p.textContent=x,v=d(),c=i("p"),c.textContent=L,C=d(),y=i("h2"),y.textContent=w,vt=d(),k=i("p"),k.textContent=re,ct=d(),et=i("h3"),et.textContent=ue,mt=d(),U=i("pre"),U.innerHTML=fe,xt=d(),g=i("h3"),g.textContent=pe,Ct=d(),B=i("ul"),B.innerHTML=ve,_t=d(),N=i("h3"),N.textContent=he,Tt=d(),lt=i("ul"),lt.innerHTML=ce,yt=d(),q=i("h2"),q.textContent=me,bt=
58d(),it=i("p"),it.textContent=xe,Ht=d(),A=i("h3"),A.textContent=Ce,Mt=d(),W=i("pre"),W.innerHTML=_e,Lt=d(),D=i("h3"),D.textContent=Te,wt=d(),nt=i("ul"),nt.innerHTML=ye,St=d(),I=i("h3"),I.textContent=be,Pt=d(),st=i("ul"),st.innerHTML=He,kt=d(),O=i("h2"),O.textContent=Me,qt=d(),ot=i("p"),ot.textContent=Le,Ft=d(),F=i("h3"),F.textContent=we,Et=d(),Y=i("pre"),Y.innerHTML=Se,gt=d(),at=i("h3"),at.textContent=Pe,At=d(),dt=i("ul"),dt.innerHTML=ke,It=d(),R=i("h3"),R.textContent=qe,Ot=d(),$=i("ul"),$.innerHTML=Fe,jt=d(),G=i("h2"),G.textContent=Ee,zt=d(),J=i("table"),J.innerHTML=ge,Ut=d(),E=i("h2"),E.textContent=Ae,Bt=d(),X=i("p"),X.textContent=Ie,Nt=d(),V=i("ul"),V.innerHTML=Oe,Wt=d(),K=i("p"),K.textContent=je,Dt=d(),j=i("h2"),j.textContent=ze,Yt=d(),rt=i("p"),rt.textContent=Ue,Rt=d(),ut=i("ul"),ut.innerHTML=Be,$t=d(),Q=i("p"),Q.textContent=Ne,Gt=d(),Z=i("h2"),Z.textContent=We,Jt=d(),tt=i("h3"),tt.textContent=De,Xt=d(),z=i("ul"),z.innerHTML=Zt,pt=d(),r=i("h3"),r.textContent=_,S=d(),u=i("ul"),u.innerHTML=T,P=d(),f=i("h3"),f.textContent=b,ht=d(),Qt=i("ul"),Qt.innerHTML=sl,Ge=d(),te=i("h2"),te.textContent=ol,Je=d(),ie=i("h3"),ie.textContent=al,Xe=d(),ne=i("p"),ne.textContent=dl,Ve=d(),se=i("h3"),se.textContent=rl,Ke=d(),oe=i("p"),oe.textContent=ul,Qe=d(),ae=i("h3"),ae.textContent=fl,Ze=d(),ee=i("p"),ee.innerHTML=pl,tl=d(),le=i("h2"),le.textContent=el,Vt=d(),n=i("ul");for(let s=0;s<ft.length;s+=1)ft[s].c();this.h()},l(s){p=l(s,"H2",{id:!0,"data-svelte-h":!0}),o(p)!=="svelte-1kyptab"&&(p.textContent=x),v=a(s),c=l(s,"P",{"data-svelte-h":!0}),o(c)!=="svelte-4w8gec"&&(c.textContent=L),C=a(s),y=l(s,"H2",{id:!0,"data-svelte-h":!0}),o(y)!=="svelte-112jnz0"&&(y.textContent=w),vt=a(s),k=l(s,"P",{"data-svelte-h":!0}),o(k)!=="svelte-hn58qv"&&(k.textContent=re),ct=a(s),et=l(s,"H3",{"data-svelte-h":!0}),o(et)!=="svelte-fg98mb"&&(et.textContent=ue),mt=a(s),U=l(s,"PRE",{"data-svelte-h":!0}),o(U)!=="svelte-1pa6bfl"&&(U.innerHTML=fe),xt=a(s),g=l(s,"H3",{"data-svelte-h":!0}),o(g)!=="svelte-1culzmw"&&(g.textContent=pe),Ct=a(s),B=l(s,"UL",{"data-svelte-h":!0}),o(B)!=="svelte-19dfysd"&&(B.innerHTML=ve),_t=a(s),N=l(s,"H3",{"data-svelte-h":!0}),o(N)!=="svelte-1dkrhlj"&&(N.textContent=he),Tt=a(s),lt=l(s,"UL",{"data-svelte-h":!0}),o(lt)!=="svelte-1uc12n"&&(lt.innerHTML=ce),yt=a(s),q=l(s,"H2",{id:!0,"data-svelte-h":!0}),o(q)!=="svelte-29n4pd"&&(q.textContent=me),bt=a(s),it=l(s,"P",{"data-svelte-h":!0}),o(it)!=="svelte-1yywxym"&&(it.textContent=xe),Ht=a(s),A=l(s,"H3",{"data-svelte-h":!0}),o(A)!=="svelte-fg98mb"&&(A.textContent=Ce),Mt=a(s),W=l(s,"PRE",{"data-svelte-h":!0}),o(W)!=="svelte-vwby2q"&&(W.innerHTML=_e),Lt=a(s),D=l(s,"H3",{"data-svelte-h":!0}),o(D)!=="svelte-1culzmw"&&(D.textContent=Te),wt=a(s),nt=l(s,"UL",{"data-svelte-h":!0}),o(nt)!=="svelte-1bjmsdh"&&(nt.innerHTML=ye),St=a(s),I=l(s,"H3",{"data-svelte-h":!0}),o(I)!=="svelte-1dkrhlj"&&(I.textContent=be),Pt=a(s),st=l(s,"UL",{"data-svelte-h":!0}),o(st)!=="svelte-1goqjxv"&&(st.innerHTML=He),kt=a(s),O=l(s,"H2",{id:!0,"data-svelte-h":!0}),o(O)!=="svelte-1o7jd2u"&&(O.textContent=Me),qt=a(s),ot=l(s,"P",{"data-svelte-h":!0}),o(ot)!=="svelte-331tyq"&&(ot.textContent=Le),Ft=a(s),F=l(s,"H3",{"data-svelte-h":!0}),o(F)!=="svelte-fg98mb"&&(F.textContent=we),Et=a(s),Y=l(s,"PRE",{"data-svelte-h":!0}),o(Y)!=="svelte-jb9e7y"&&(Y.innerHTML=Se),gt=a(s),at=l(s,"H3",{"data-svelte-h":!0}),o(at)!=="svelte-1culzmw"&&(at.textContent=Pe),At=a(s),dt=l(s,"UL",{"data-svelte-h":!0}),o(dt)!=="svelte-1jm1wi5"&&(dt.innerHTML=ke),It=a(s),R=l(s,"H3",{"data-svelte-h":!0}),o(R)!=="svelte-1dkrhlj"&&(R.textContent=qe),Ot=a(s),$=l(s,"UL",{"data-svelte-h":!0}),o($)!=="svelte-1b7q3sb"&&($.innerHTML=Fe),jt=a(s),G=l(s,"H2",{id:!0,"data-svelte-h":!0}),o(G)!=="svelte-1l5fo8x"&&(G.textContent=Ee),zt=a(s),J=l(s,"TABLE",{"data-svelte-h":!0}),o(J)!=="svelte-1al1x5l"&&(J.innerHTML=ge),Ut=a(s),E=l(s,"H2",{id:!0,"data-svelte-h":!0}),o(E)!=="svelte-1fmgw49"&&(E.textContent=Ae),Bt=a(s),X=l(s,"P",{"data-svelte-h":!0}),o(X)!=="svelte-ebfg9h"&&(X.textContent=Ie),Nt=a(s),V=l(s,"UL",{"data-svelte-h":!0}),o(V)!=="svelte-dzu8al"&&(V.innerHTML=Oe),Wt=a(s),K=l(s,"P",{"data-svelte-h":!0}),o(K)!=="svelte-1r2dc2g"&&(K.textContent=je),Dt=a(s),j=l(s,"H2",{id:!0,"data-svelte-h":!0}),o(j)!=="svelte-1bp0nan"&&(j.textContent=ze),Yt=a(s),rt=l(s,"P",{"data-svelte-h":!0}),o(rt)!=="svelte-1wlzp4f"&&(rt.textContent=Ue),Rt=a(s),ut=l(s,"UL",{"data-svelte-h":!0}),o(ut)!=="svelte-wryz35"&&(ut.innerHTML=Be),$t=a(s),Q=l(s,"P",{"data-svelte-h":!0}),o(Q)!=="svelte-a6p0nt"&&(Q.textContent=Ne),Gt=a(s),Z=l(s,"H2",{id:!0,"data-svelte-h":!0}),o(Z)!=="svelte-24ru0o"&&(Z.textContent=We),Jt=a(s),tt=l(s,"H3",{"data-svelte-h":!0}),o(tt)!=="svelte-1ci7h77"&&(tt.textContent=De),Xt=a(s),z=l(s,"UL",{"data-svelte-h":!0}),o(z)!=="svelte-1gli2h9"&&(z.innerHTML=Zt),pt=a(s),r=l(s,"H3",{"data-svelte-h":!0}),o(r)!=="svelte-dfjgj2"&&(r.textContent=_),S=a(s),u=l(s,"UL",{"data-svelte-h":!0}),o(u)!=="svelte-tnh07r"&&(u.innerHTML=T),P=a(s),f=l(s,"H3",{"data-svelte-h":!0}),o(f)!=="svelte-95dqgs"&&(f.textContent=b),ht=a(s),Qt=l(s,"UL",{"data-svelte-h":!0}),o(Qt)!=="svelte-krvkyd"&&(Qt.innerHTML=sl),Ge=a(s),te=l(s,"H2",{id:!0,"data-svelte-h":!0}),o(te)!=="svelte-hvsc9m"&&(te.textContent=ol),Je=a(s),ie=l(s,"H3",{"data-svelte-h":!0}),o(ie)!=="svelte-9xkszm"&&(ie.textContent=al),Xe=a(s),ne=l(s,"P",{"data-svelte-h":!0}),o(ne)!=="svelte-w4q9s0"&&(ne.textContent=dl),Ve=a(s),se=l(s,"H3",{"data-svelte-h":!0}),o(se)!=="svelte-49kzhc"&&(se.textContent=rl),Ke=a(s),oe=l(s,"P",{"data-svelte-h":!0}),o(oe)!=="svelte-1i6qdsb"&&(oe.textContent=ul),Qe=a(s),ae=l(s,"H3",{"data-svelte-h":!0}),o(ae)!=="svelte-zamy63"&&(ae.textContent=fl),Ze=a(s),ee=l(s,"P",{"data-svelte-h":!0}),o(ee)!=="svelte-n10nm7"&&(ee.innerHTML=pl),tl=a(s),le=l(s,"H2",{id:!0,"data-svelte-h":!0}),o(le)!=="svelte-15a7nw5"&&(le.textContent=el),Vt=a(s),n=l(s,"UL",{});var m=de(n);for(let Kt=0;Kt<ft.length;Kt+=1)ft[Kt].l(m);m.forEach(t),this.h()},h(){M(p,"id","overview"),M(y,"id","json"),M(q,"id","xml"),M(O,"id","yaml"),M(G,"id","comparison"),M(E,"id","size-comparison"),M(j,"id","yaml-gotchas"),M(Z,"id","when-to-use"),M(te,"id","faq"),M(le,"id","related")},m(s,m){e(s,p,m),e(s,v,m),e(s,c,m),e(s,C,m),e(s,y,m),e(s,vt,m),e(s,k,m),e(s,ct,m),e(s,et,m),e(s,mt,m),e(s,U,m),e(s,xt,m),e(s,g,m),e(s,Ct,m),e(s,B,m),e(s,_t,m),e(s,N,m),e(s,Tt,m),e(s,lt,m),e(s,yt,m),e(s,q,m),e(s,bt,m),e(s,it,m),e(s,Ht,m),e(s,A,m),e(s,Mt,m),e(s,W,m),e(s,Lt,m),e(s,D,m),e(s,wt,m),e(s,nt,m),e(s,St,m),e(s,I,m),e(s,Pt,m),e(s,st,m),e(s,kt,m),e(s,O,m),e(s,qt,m),e(s,ot,m),e(s,Ft,m),e(s,F,m),e(s,Et,m),e(s,Y,m),e(s,gt,m),e(s,at,m),e(s,At,m),e(s,dt,m),e(s,It,m),e(s,R,m),e(s,Ot,m),e(s,$,m),e(s,jt,m),e(s,G,m),e(s,zt,m),e(s,J,m),e(s,Ut,m),e(s,E,m),e(s,Bt,m),e(s,X,m),e(s,Nt,m),e(s,V,m),e(s,Wt,m),e(s,K,m),e(s,Dt,m),e(s,j,m),e(s,Yt,m),e(s,rt,m),e(s,Rt,m),e(s,ut,m),e(s,$t,m),e(s,Q,m),e(s,Gt,m),e(s,Z,m),e(s,Jt,m),e(s,tt,m),e(s,Xt,m),e(s,z,m),e(s,pt,m),e(s,r,m),e(s,S,m),e(s,u,m),e(s,P,m),e(s,f,m),e(s,ht,m),e(s,Qt,m),e(s,Ge,m),e(s,te,m),e(s,Je,m),e(s,ie,m),e(s,Xe,m),e(s,ne,m),e(s,Ve,m),e(s,se,m),e(s,Ke,m),e(s,oe,m),e(s,Qe,m),e(s,ae,m),e(s,Ze,m),e(s,ee,m),e(s,tl,m),e(s,le,m),e(s,Vt,m),e(s,n,m);for(let Kt=0;Kt<ft.length;Kt+=1)ft[Kt]&&ft[Kt].m(n,null)},p(s,[m]){if(m&1){h=$e(s[0].relatedLinks);let Kt;for(Kt=0;Kt<h.length;Kt+=1){const Hl=kl(s,h,Kt);ft[Kt]?ft[Kt].p(Hl,m):(ft[Kt]=ql(Hl),ft[Kt].c(),ft[Kt].m(n,null))}for(;Kt<ft.length;Kt+=1)ft[Kt].d(1);ft.length=h.length}}
58,i:Ye,o:Ye,d(s){s&&(t(p),t(v),t(c),t(C),t(y),t(vt),t(k),t(ct),t(et),t(mt),t(U),t(xt),t(g),t(Ct),t(B),t(_t),t(N),t(Tt),t(lt),t(yt),t(q),t(bt),t(it),t(Ht),t(A),t(Mt),t(W),t(Lt),t(D),t(wt),t(nt),t(St),t(I),t(Pt),t(st),t(kt),t(O),t(qt),t(ot),t(Ft),t(F),t(Et),t(Y),t(gt),t(at),t(At),t(dt),t(It),t(R),t(Ot),t($),t(jt),t(G),t(zt),t(J),t(Ut),t(E),t(Bt),t(X),t(Nt),t(V),t(Wt),t(K),t(Dt),t(j),t(Yt),t(rt),t(Rt),t(ut),t($t),t(Q),t(Gt),t(Z),t(Jt),t(tt),t(Xt),t(z),t(pt),t(r),t(S),t(u),t(P),t(f),t(ht),t(Qt),t(Ge),t(te),t(Je),t(ie),t(Xe),t(ne),t(Ve),t(se),t(Ke),t(oe),t(Qe),t(ae),t(Ze),t(ee),t(tl),t(le),t(Vt),t(n)),cl(ft,s)}}}function Jl(H,p,x){let{article:v}=p;return H.$$set=c=>{"article"in c&&x(0,v=c.article)},[v]}class Xl extends il{constructor(p){super(),nl(this,p,Jl,Gl,ll,{article:0})}}const Vl=Object.freeze(Object.defineProperty({__proto__:null,default:Xl},Symbol.toStringTag,{value:"Module"}));function Fl(H,p,x){const v=H.slice();return v[1]=p[x],v}function El(H){let p,x,v=H[1]+"",c,L;return{c(){p=i("li"),x=i("a"),c=Cl(v),this.h()},l(C){p=l(C,"LI",{});var y=de(p);x=l(y,"A",{href:!0});var w=de(x);
58c=xl(w,v),w.forEach(t),y.forEach(t),this.h()},h(){M(x,"href",L=H[1])},m(C,y){e(C,p,y),Re(p,x),Re(x,c)},p(C,y){y&1&&v!==(v=C[1]+"")&&ml(c,v),y&1&&L!==(L=C[1])&&M(x,"href",L)},d(C){C&&t(p)}}}function Kl(H){let p,x="How MIME Types and File Extensions Work Together",v,c,L="When a web server delivers a file, it doesn't rely on the file extension to tell the browser what the content is. Instead, it sends a <code>Content-Type</code> header containing a MIME type (Multipurpose Internet Mail Extensions). The browser uses this MIME type â not the extension â to decide how to process the response.",C,y,w="File extensions are a convenience for humans and operating systems. MIME types are the mechanism the web actually uses.",vt,k,re="Anatomy of a MIME Type",ct,et,ue="A MIME type has two parts separated by a slash: a <strong>type</strong> and a <strong>subtype</strong>.",mt,U,fe="<code>type/subtype</code>",xt,g,pe="Common top-level types:",Ct,B,ve="<thead><tr><th>Type</th> <th>Description</th> <th>Examples</th></tr></thead> <tbody><tr><td>text</td><td>Human-readable text</td><td>text/html, text/css, text/plain</td></tr> <tr><td>image</td><td>Image data</td><td>image/png, image/jpeg, image/webp</td></tr> <tr><td>audio</td><td>Audio data</td><td>audio/mpeg, audio/ogg, audio/flac</td></tr> <tr><td>video</td><td>Video data</td><td>video/mp4, video/webm</td></tr> <tr><td>application</td><td>Binary data or structured formats</td><td>application/json, application/pdf, application/zip</td></tr> <tr><td>font</td><td>Font data</td><td>font/woff2, font/woff, font/ttf</td></tr> <tr><td>multipart</td><td>Multi-part messages</td><td>multipart/form-data</td></tr></tbody>",_t,N,he="Extension-to-MIME Mapping",Tt,lt,ce="Web servers maintain a mapping from file extensions to MIME types. When a request arrives for <code>/report.pdf</code>, the server looks up <code>.pdf</code> and returns <code>Content-Type: application/pdf</code>.",yt,q,me="Common mappings:",bt,it,xe="<thead><tr><th>Extension</th> <th>MIME Type</th></tr></thead> <tbody><tr><td>.html</td><td>text/html</td></tr> <tr><td>.css</td><td>text/css</td></tr> <tr><td>.js</td><td>text/javascript</td></tr> <tr><td>.json</td><td>application/json</td></tr> <tr><td>.png</td><td>image/png</td></tr> <tr><td>.jpg / .jpeg</td><td>image/jpeg</td></tr> <tr><td>.webp</td><td>image/webp</td></tr> <tr><td>.avif</td><td>image/avif</td></tr> <tr><td>.svg</td><td>image/svg+xml</td></tr> <tr><td>.mp4</td><td>video/mp4</td></tr> <tr><td>.webm</td><td>video/webm</td></tr> <tr><td>.woff2</td><td>font/woff2</td></tr> <tr><td>.pdf</td><td>application/pdf</td></tr> <tr><td>.zip</td><td>application/zip</td></tr></tbody>",Ht,A,Ce="The Content-Type Header",Mt,W,_e="The <code>Content-Type</code> header may include additional parameters. The most common is <code>charset</code> for text types:",Lt,D,Te=`<code>Content-Type: text/html; charset=utf-8 59Content-Type: application/json; charset=utf-8 60Content-Type: image/png</code>`,wt,nt,ye="Binary formats (images, audio, video, fonts) do not need a charset parameter.",St,I,be="MIME Sniffing",Pt,st,He="Browsers can attempt to detect content type by examining the file contents â a practice called MIME sniffing. This is a security risk: an attacker could upload a file with a <code>.jpg</code> extension that actually contains HTML with JavaScript.",kt,O,Me="To prevent MIME sniffing, set this header:",qt,ot,Le="<code>X-Content-Type-Options: nosniff</code>",Ft,F,we="With <code>nosniff</code> set, browsers will only use the declared MIME type. This is a standard security header and should be set on all responses.",Et,Y,Se="Common Mistakes",gt,at,Pe="Wrong MIME type for JavaScript",At,dt,ke="The correct MIME type for JavaScript is <code>text/javascript</code>. While <code>application/javascript</code> was used historically, the IETF deprecated it in 2022 (RFC 9239). Some servers still default to <code>application/x-javascript</code> â this is non-standard.",It,R,qe="Missing MIME types for modern formats",Ot,$,Fe="Servers may not recognise newer extensions like <code>.avif</code>, <code>.woff2</code>, or <code>.webp</code>. If your server returns <code>application/octet-stream</code> for these files, browsers cannot handle them correctly. Check your server configuration or CDN settings.",jt,G,Ee="SVG served as text/xml",zt,J,ge="SVG files should be served as <code>image/svg+xml</code>, not <code>text/xml</code> or <code>application/xml</code>. The wrong type can affect how browsers render the image and may trigger security restrictions.",Ut,E,Ae="Server Configuration Examples",Bt,X,Ie="Nginx",Nt,V,Oe=`<code># /etc/nginx/mime.types additions 61types { 62 image/avif avif; 63 font/woff2 woff2; 64 font/woff woff; 65 application/manifest+json webmanifest; 66}</code>`,Wt,K,je="Apache (.htaccess)",Dt,j,ze=`<code>AddType image/avif .avif 67AddType font/woff2 .woff2 68AddType font/woff .woff 69AddType application/manifest+json .webmanifest</code>
69`,Yt,rt,Ue="Cloudflare Pages",Rt,ut,Be="Cloudflare Pages handles MIME types automatically for most formats. Custom types can be set via <code>_headers</code> file or Worker middleware.",$t,Q,Ne="MIME Types in Form Submissions",Gt,Z,We="HTML forms use MIME types for the <code>enctype</code> attribute:",Jt,tt,De="<li><code>application/x-www-form-urlencoded</code> â default, encodes form data as key=value pairs</li> <li><code>multipart/form-data</code> â required for file uploads, sends each field as a separate part</li> <li><code>text/plain</code> â rarely used, sends data with minimal encoding</li>",Xt,z,Zt="Content Negotiation in APIs",pt,r,_="REST APIs use MIME types for content negotiation. The client sends an <code>Accept</code> header listing preferred types, and the server responds with a matching <code>Content-Type</code>:",S,u,T=`<code># Client requests JSON 70Accept: application/json 71 72# Server responds 73Content-Type: application/json; charset=utf-8</code>`,P,f,b="For APIs that support multiple formats (JSON, XML, CSV), the server inspects the <code>Accept</code> header and returns the most appropriate format.",ht,Qt,sl="Frequently Asked Questions",Ge,te,ol="What happens if the MIME type is wrong?",Je,ie,al="Browsers may refuse to process the file. For example, a CSS file served as <code>text/plain</code> will not be applied as a stylesheet. A JavaScript file with the wrong type will not execute in strict mode.",Xe,ne,dl="Where does the MIME type database come from?",Ve,se,rl='The Internet Assigned Numbers Authority (IANA) maintains the official registry at <a href="https://www.iana.org/assignments/media-types/">iana.org/assignments/media-types</a>. Server software includes its own mapping files (e.g., Nginx's <code>mime.types</code>).',Ke,oe,ul="What is application/octet-stream?",Qe,ae,fl='It is the generic binary MIME type. It means "unknown binary data". Browsers will typically offer to download files with this type rather than display them. If you see this type for files that should be displayed (images, fonts), your server configuration needs updating.',Ze,ee,pl="Related Resources",tl,le,el=$e(H[0].relatedLinks),Vt=[];for(let n=0;n<el.length;n+=1)Vt[n]=El(Fl(H,el,n));return{c(){p=i("h2"),p.textContent=x,v=d(),c=i("p"),c.innerHTML=L,C=d(),y=i("p"),y.textContent=w,vt=d(),k=i("h2"),k.textContent=re,ct=d(),et=i("p"),et.innerHTML=ue,mt=d(),U=i("pre"),U.innerHTML=fe,xt=d(),g=i("p"),g.textContent=pe,Ct=d(),B=i("table"),B.innerHTML=ve,_t=d(),N=i("h2"),N.textContent=he,Tt=d(),lt=i("p"),lt.innerHTML=ce,yt=d(),q=i("p"),q.textContent=me,bt=d(),it=i("table"),it.innerHTML=xe,Ht=d(),A=i("h2"),A.textContent=Ce,Mt=d(),W=i("p"),W.innerHTML=_e,Lt=d(),D=i("pre"),D.innerHTML=Te,wt=d(),nt=i("p"),nt.textContent=ye,St=d(),I=i("h2"),I.textContent=be,Pt=d(),st=i("p"),st.innerHTML=He,kt=d(),O=i("p"),O.textContent=Me,qt=d(),ot=i("pre"),ot.innerHTML=Le,Ft=d(),F=i("p"),F.innerHTML=we,Et=d(),Y=i("h2"),Y.textContent=Se,gt=d(),at=i("h3"),at.textContent=Pe,At=d(),dt=i("p"),dt.innerHTML=ke,It=d(),R=i("h3"),R.textContent=qe,Ot=d(),$=i("p"),$.innerHTML=Fe,jt=d(),G=i("h3"),G.textContent=Ee,zt=d(),J=i("p"),J.innerHTML=ge,Ut=d(),E=i("h2"),E.textContent=Ae,Bt=d(),X=i("h3"),X.textContent=Ie,Nt=d(),V=i("pre"),V.innerHTML=Oe,Wt=d(),K=i("h3"),K.textContent=je,Dt=d(),j=i("pre"),j.innerHTML=ze,Yt=d(),rt=i("h3"),rt.textContent=Ue,Rt=d(),ut=i("p"),ut.innerHTML=Be,$t=d(),Q=i("h2"),Q.textContent=Ne,Gt=d(),Z=i("p"),Z.innerHTML=We,Jt=d(),tt=i("ul"),tt.innerHTML=De,Xt=d(),z=i("h2"),z.textContent=Zt,pt=d(),r=i("p"),r.innerHTML=_,S=d(),u=i("pre"),u.innerHTML=T,P=d(),f=i("p"),f.innerHTML=b,ht=d(),Qt=i("h2"),Qt.textContent=sl,Ge=d(),te=i("h3"),te.textContent=ol,Je=d(),ie=i("p"),ie.innerHTML=al,Xe=d(),ne=i("h3"),ne.textContent=dl,Ve=d(),se=i("p"),se.innerHTML=rl,Ke=d(),oe=i("h3"),oe.textContent=ul,Qe=d(),ae=i("p"),ae.textContent=fl,Ze=d(),ee=i("h2"),ee.textContent=pl,tl=d(),le=i("ul");for(let n=0;n<Vt.length;n+=1)Vt[n].c();this.h()},l(n){p=l(n,"H2",{id:!0,"data-svelte-h":!0}),o(p)!=="svelte-lqb5y"&&(p.textContent=x),v=a(n),c=l(n,"P",{"data-svelte-h":!0}),o(c)!=="svelte-3q9k43"&&(c.innerHTML=L),C=a(n),y=l(n,"P",{"data-svelte-h":!0}
73),o(y)!=="svelte-b6tg7y"&&(y.textContent=w),vt=a(n),k=l(n,"H2",{id:!0,"data-svelte-h":!0}),o(k)!=="svelte-1712jny"&&(k.textContent=re),ct=a(n),et=l(n,"P",{"data-svelte-h":!0}),o(et)!=="svelte-1u5tk5e"&&(et.innerHTML=ue),mt=a(n),U=l(n,"PRE",{"data-svelte-h":!0}),o(U)!=="svelte-1j9iasw"&&(U.innerHTML=fe),xt=a(n),g=l(n,"P",{"data-svelte-h":!0}),o(g)!=="svelte-kcnu9a"&&(g.textContent=pe),Ct=a(n),B=l(n,"TABLE",{"data-svelte-h":!0}),o(B)!=="svelte-1j819tm"&&(B.innerHTML=ve),_t=a(n),N=l(n,"H2",{id:!0,"data-svelte-h":!0}),o(N)!=="svelte-19idi3q"&&(N.textContent=he),Tt=a(n),lt=l(n,"P",{"data-svelte-h":!0}),o(lt)!=="svelte-ms2htb"&&(lt.innerHTML=ce),yt=a(n),q=l(n,"P",{"data-svelte-h":!0}),o(q)!=="svelte-19zqwu6"&&(q.textContent=me),bt=a(n),it=l(n,"TABLE",{"data-svelte-h":!0}),o(it)!=="svelte-107ihh"&&(it.innerHTML=xe),Ht=a(n),A=l(n,"H2",{id:!0,"data-svelte-h":!0}),o(A)!=="svelte-418dhq"&&(A.textContent=Ce),Mt=a(n),W=l(n,"P",{"data-svelte-h":!0}),o(W)!=="svelte-7sbdhq"&&(W.innerHTML=_e),Lt=a(n),D=l(n,"PRE",{"data-svelte-h":!0}),o(D)!=="svelte-10eq7dm"&&(D.innerHTML=Te),wt=a(n),nt=l(n,"P",{"data-svelte-h":!0}),o(nt)!=="svelte-zde1ef"&&(nt.textContent=ye),St=a(n),I=l(n,"H2",{id:!0,"data-svelte-h":!0}),o(I)!=="svelte-fk57pj"&&(I.textContent=be),Pt=a(n),st=l(n,"P",{"data-svelte-h":!0}),o(st)!=="svelte-ontvti"&&(st.innerHTML=He),kt=a(n),O=l(n,"P",{"data-svelte-h":!0}),o(O)!=="svelte-10gl7pa"&&(O.textContent=Me),qt=a(n),ot=l(n,"PRE",{"data-svelte-h":!0}),o(ot)!=="svelte-shhxe6"&&(ot.innerHTML=Le),Ft=a(n),F=l(n,"P",{"data-svelte-h":!0}),o(F)!=="svelte-1tudpl"&&(F.innerHTML=we),Et=a(n),Y=l(n,"H2",{id:!0,"data-svelte-h":!0}),o(Y)!=="svelte-1gze817"&&(Y.textContent=Se),gt=a(n),at=l(n,"H3",{"data-svelte-h":!0}),o(at)!=="svelte-d6its9"&&(at.textContent=Pe),At=a(n),dt=l(n,"P",{"data-svelte-h":!0}),o(dt)!=="svelte-oynx8q"&&(dt.innerHTML=ke),It=a(n),R=l(n,"H3",{"data-svelte-h":!0}),o(R)!=="svelte-pt2nkl"&&(R.textContent=qe),Ot=a(n),$=l(n,"P",{"data-svelte-h":!0}),o($)!=="svelte-19yjmti"&&($.innerHTML=Fe),jt=a(n),G=l(n,"H3",{"data-svelte-h":!0}),o(G)!=="svelte-19ax3zu"&&(G.textContent=Ee),zt=a(n),J=l(n,"P",{"data-svelte-h":!0}),o(J)!=="svelte-9w9w03"&&(J.innerHTML=ge),Ut=a(n),E=l(n,"H2",{id:!0,"data-svelte-h":!0}),o(E)!=="svelte-1tqawwm"&&(E.textContent=Ae),Bt=a(n),X=l(n,"H3",{"data-svelte-h":!0}),o(X)!=="svelte-1taxkp6"&&(X.textContent=Ie),Nt=a(n),V=l(n,"PRE",{"data-svelte-h":!0}),o(V)!=="svelte-1g2um3c"&&(V.innerHTML=Oe),Wt=a(n),K=l(n,"H3",{"data-svelte-h":!0}),o(K)!=="svelte-nv6cyx"&&(K.textContent=je),Dt=a(n),j=l(n,"PRE",{"data-svelte-h":!0}),o(j)!=="svelte-eudnlv"&&(j.innerHTML=ze),Yt=a(n),rt=l(n,"H3",{"data-svelte-h":!0}),o(rt)!=="svelte-1vf98p7"&&(rt.textContent=Ue),Rt=a(n),ut=l(n,"P",{"data-svelte-h":!0}),o(ut)!=="svelte-1wi3c2c"&&(ut.innerHTML=Be),$t=a(n),Q=l(n,"H2",{id:!0,"data-svelte-h":!0}),o(Q)!=="svelte-kniupl"&&(Q.textContent=Ne),Gt=a(n),Z=l(n,"P",{"data-svelte-h":!0}),o(Z)!=="svelte-kidlnt"&&(Z.innerHTML=We),Jt=a(n),tt=l(n,"UL",{"data-svelte-h":!0}),o(tt)!=="svelte-18elg9l"&&(tt.innerHTML=De),Xt=a(n),z=l(n,"H2",{id:!0,"data-svelte-h":!0}),o(z)!=="svelte-ckqguq"&&(z.textContent=Zt),pt=a(n),r=l(n,"P",{"data-svelte-h":!0}),o(r)!=="svelte-xx2o9q"&&(r.innerHTML=_),S=a(n),u=l(n,"PRE",{"data-svelte-h":!0}),o(u)!=="svelte-zqarzh"&&(u.innerHTML=T),P=a(n),f=l(n,"P",{"data-svelte-h":!0}),o(f)!=="svelte-y0hjd4"&&(f.innerHTML=b),ht=a(n),Qt=l(n,"H2",{id:!0,"data-svelte-h":!0}),o(Qt)!=="svelte-hvsc9m"&&(Qt.textContent=sl),Ge=a(n),te=l(n,"H3",{"data-svelte-h":!0}),o(te)!=="svelte-15jw05z"&&(te.textContent=ol),Je=a(n),ie=l(n,"P",{"data-svelte-h":!0}),o(ie)!=="svelte-534257"&&(ie.innerHTML=al),Xe=a(n),ne=l(n,"H3",{"data-svelte-h":!0}),o(ne)!=="svelte-1rmez5x"&&(ne.textContent=dl),Ve=a(n),se=l(n,"P",{"data-svelte-h":!0}),o(se)!=="svelte-rn33a8"&&(se.innerHTML=rl),Ke=a(n),oe=l(n,"H3",{"data-svelte-h":!0}),o(oe)!=="svelte-96428y"&&(oe.textContent=ul),Qe=a(n),ae=l(n,"P",{"data-svelte-h":!0}),o(ae)!=="svelte-1c96wbw"&&(ae.textContent=fl),Ze=a(n),ee=l(n,"H2",{id:!0,"data-svelte-h":!0}),o(ee)!=="svelte-15a7nw5"&&(ee.textContent=pl),tl=a(n),le=l(n,"UL",{});var h=de(le);for(let ft=0;ft<Vt.length;ft+=1)Vt[ft].l(h);h.forEach(t),this.h()},h(){M(p,"id","overview"),M(k,"id","anatomy"),M(N,"id","extension-mapping"),M(A,"id","content-type-header"),M(I,"id","mime-sniffing"),M(Y,"id","common-mistakes"),M(E,"id","server-config"),M(Q,"id","multipart-forms"),M(z,"id","api-content-negotiation"),M(Qt,"id","faq"),M(ee,"id","related")},m(n,h){e(n,p,h),e(n,v,h),e(n,c,h),e(n,C,h),e(n,y,h),e(n,vt,h),e(n,k,h),e(n,ct,h),e(n,et,h),e(n,mt,h),e(n,U,h),e(n,xt,h),e(n,g,h),e(n,Ct,h),e(n,B,h),e(n,_t,h),e(n,N,h),e(n,Tt,h),e(n,lt,h),e(n,yt,h),e(n,q,h),e(n,bt,h),e(n,it,h),e(n,Ht,h),e(n,A,h),e(n,Mt,h),e(n,W,h),e(n,Lt,h),e(n,D,h),e(n,wt,h),e(n,nt,h),e(n,St,h),e(n,I,h),e(n,Pt,h),e(n,st,h),e(n,kt,h),e(n,O,h),e(n,qt,h),e(n,ot,h),e(n,Ft,h),e(n,F,h),e(n,Et,h),e(n,Y,h),e(n,gt,h),e(n,at,h),e(n,At,h),e(n,dt,h),e(n,It,h),e(n,R,h),e(n,Ot,h),e(n,$,h),e(n,jt,h),e(n,G,h),e(n,zt,h),e(n,J,h),e(n,Ut,h),e(n,E,h),e(n,Bt,h),e(n,X,h),e(n,Nt,h),e(n,V,h),e(n,Wt,h),e(n,K,h),e(n,Dt,h),e(n,j,h),e(n,Yt,h),e(n,rt,h),e(n,Rt,h),e(n,ut,h),e(n,$t,h),e(n,Q,h),e(n,Gt,h),e(n,Z,h),e(n,Jt,h),e(n,tt,h),e(n,Xt,h),e(n,z,h),e(n,pt,h),e(n,r,h),e(n,S,h),e(n,u,h),e(n,P,h),e(n,f,h),e(n,ht,h),e(n,Qt,h),e(n,Ge,h),e(n,te,h),e(n,Je,h),e(n,ie,h),e(n,Xe,h),e(n,ne,h),e(n,Ve,h),e(n,se,h),e(n,Ke,h),e(n,oe,h),e(n,Qe,h),e(n,ae,h),e(n,Ze,h),e(n,ee,h),e(n,tl,h),e(n,le,h);for(let ft=0;ft<Vt.length;ft+=1)Vt[ft]&&Vt[ft].m(le,null)},p(n,[h]){if(h&1){el=$e(n[0].relatedLinks);let ft;for(ft=0;ft<el.length;ft+=1){const s=Fl(n,el,ft);Vt[ft]?Vt[ft].p(s,h):(Vt[ft]=El(s),Vt[ft].c(),Vt[ft].m(le,null))}for(;ft<Vt.length;ft+=1)Vt[ft].d(1);Vt.length=el.length}},i:Ye,o:Ye,d(n){n&&(t(p),t(v),t(c),t(C),t(y),t(vt),t(k),t(ct),t(et),t(mt),t(U),t(xt),t(g),t(Ct),t(B),t(_t),t(N),t(Tt),t(lt),t(yt),t(q),t(bt),t(it),t(Ht),t(A),t(Mt),t(W),t(Lt),t(D),t(wt),t(nt),t(St),t(I),t(Pt),t(st),t(kt),t(O),t(qt),t(ot),t(Ft),t(F),t(Et),t(Y),t(gt),t(at),t(At),t(dt),t(It),t(R),t(Ot),t($),t(jt),t(G),t(zt),t(J),t(Ut),t(E),t(Bt),t(X),t(Nt),t(V),t(Wt),t(K),t(Dt),t(j),t(Yt),t(rt),t(Rt),t(ut),t($t),t(Q),t(Gt),t(Z),t(Jt),t(tt),t(Xt),t(z),t(pt),t(r),t(S),t(u),t(P),t(f),t(ht),t(Qt),t(Ge),t(te),t(Je),t(ie),t(Xe),t(ne),t(Ve),t(se),t(Ke),t(oe),t(Qe),t(ae),t(Ze),t(ee),t(tl),t(le)),cl(Vt,n)}}}function Ql(H,p,x){let{article:v}=p;return H.$$set=c=>{"article"in c&&x(0,v=c.article)},[v]}class Zl extends il{constructor(p){super(),nl(this,p,Ql,Kl,ll,{article:0})}}const ti=Object.freeze(Object.defineProperty({__proto__:null,default:Zl},Symbol.toStringTag,{value:"Module"}));function gl(H,p,x){const v=H.slice();return v[1]=p[x],v}function Al(H){let p,x,v=H[1]+"",c,L;
73return{c(){p=i("li"),x=i("a"),c=Cl(v),this.h()},l(C){p=l(C,"LI",{});var y=de(p);x=l(y,"A",{href:!0});var w=de(x);c=xl(w,v),w.forEach(t),y.forEach(t),this.h()},h(){M(x,"href",L=H[1])},m(C,y){e(C,p,y),Re(p,x),Re(x,c)},p(C,y){y&1&&v!==(v=C[1]+"")&&ml(c,v),y&1&&L!==(L=C[1])&&M(x,"href",L)},d(C){C&&t(p)}}}function ei(H){let p,x="Web Font Formats at a Glance",v,c,L="Web fonts allow websites to use typefaces beyond the system fonts installed on a visitor's device. Four file formats are relevant: TTF, OTF, WOFF, and WOFF2. Each represents a different point in the evolution from desktop fonts to web-optimised delivery.",C,y,w="TTF: TrueType Font",vt,k,re="TrueType was developed by Apple and Microsoft in the late 1980s as an alternative to Adobe's PostScript fonts. TTF files contain both the font outlines and hinting instructions for screen rendering.",ct,et,ue="Characteristics",mt,U,fe="<li>Quadratic Bézier curves for outlines</li> <li>Universal OS support (Windows, macOS, Linux)</li> <li>Relatively large file sizes â no built-in web compression</li> <li>Supported in all browsers but not recommended for web use due to file size</li>",xt,g,pe="OTF: OpenType Font",Ct,B,ve="OpenType was jointly developed by Microsoft and Adobe. OTF files can contain either TrueType or PostScript (CFF) outlines, along with advanced typographic features like ligatures, small caps, and contextual alternates.",_t,N,he="Characteristics",Tt,lt,ce="<li>Supports both quadratic (TrueType) and cubic (PostScript/CFF) Bézier curves</li> <li>Advanced layout features (OpenType features): ligatures, stylistic alternates, kerning tables</li> <li>Universal desktop OS support</li> <li>Like TTF, files are uncompressed and not ideal for web delivery</li>",yt,q,me="WOFF: Web Open Font Format",bt,it,xe="WOFF was created specifically for web use. It wraps TTF or OTF font data in a compressed container with additional metadata. Compression is table-level using zlib (Deflate), typically reducing file size by 40 % compared to the equivalent TTF or OTF.",Ht,A,Ce="Characteristics",Mt,W,_e="<li>Compressed wrapper around TTF/OTF data</li> <li>~40 % smaller than uncompressed TTF/OTF</li> <li>W3C recommendation (standardised in 2012)</li> <li>Universal browser support</li> <li>Includes metadata fields for licensing information</li>",Lt,D,Te="WOFF2: The Production Standard",wt,nt,ye="WOFF2 uses Brotli compression instead of Deflate, achieving significantly better compression. It is the format you should use for web fonts in production.",St,I,be="Characteristics",Pt,st,He="<li>Brotli compression â typically 30 % smaller than WOFF, 50â60 % smaller than TTF/OTF</li> <li>Supported in all modern browsers (Chrome 36+, Firefox 39+, Safari 12+, Edge 14+)</li> <li>W3C recommendation (standardised in 2018)</li> <li>Additional pre-processing of font data before compression for even better ratios</li>",kt,O,Me="Format Comparison",qt,ot,Le="<thead><tr><th>Feature</th> <th>TTF</th> <th>OTF</th> <th>WOFF</th> <th>WOFF2</th></tr></thead> <tbody><tr><td>Primary use</td><td>Desktop</td><td>Desktop</td><td>Web</td><td>Web</td></tr> <tr><td>Compression</td><td>None</td><td>None</td><td>Deflate (~40 %)</td><td>Brotli (~60 %)</td></tr> <tr><td>Browser support</td><td>Universal</td><td>Universal</td><td>Universal</td><td>~97 %</td></tr> <tr><td>Advanced typography</td><td>Basic</td><td>Full</td><td>Inherited</td><td>Inherited</td></tr> <tr><td>Recommended for web</td><td>No</td><td>No</td><td>Fallback only</td><td>Yes</td></tr></tbody>",Ft,F,we="Implementing Web Fonts",Et,Y,Se="A robust <code>@font-face</code> declaration serves WOFF2 with a WOFF fallback:",gt,at,Pe=`<code>@font-face { 74 font-family: 'MyFont'; 75 src: url('/fonts/myfont.woff2') format('woff2'), 76 url('/fonts/myfont.woff') format('woff'); 77 font-weight: 400; 78 font-style: normal; 79 font-display: swap; 80}</code>`,At,dt,ke="Key practices:",It,R,qe="<li>List WOFF2 first â browsers use the first format they support</li> <li>Include WOFF as a fallback for the ~3 % of browsers without WOFF2 support</li> <li>Use <code>font-display: swap</code> to show fallback text immediately while the font loads</li> <li>Subset fonts to include only the character ranges you need (Latin, extended Latin, etc.)</li> <li>Self-host when possible for performance â avoids DNS lookups and third-party depen
80dencies</li>",Ot,$,Fe="Font Subsetting",jt,G,Ee="Most fonts include thousands of glyphs for multiple languages. If your site only uses Latin characters, subsetting can reduce a 200 KB font to 20 KB.",zt,J,ge="Tools for subsetting:",Ut,E,Ae="<li><strong>pyftsubset</strong> (part of fonttools): <code>pyftsubset font.ttf --output-file=font-subset.woff2 --flavor=woff2 --unicodes="U+0000-00FF"</code></li> <li><strong>glyphhanger</strong>: Crawls your website and creates a subset containing only the characters actually used</li> <li><strong>Google Fonts</strong>: Automatically serves subsetted versions based on the <code>text</code> parameter</li>",Bt,X,Ie="Performance Tips",Nt,V,Oe="<li>Preload critical fonts: <code><link rel="preload" href="/fonts/main.woff2" as="font" type="font/woff2" crossorigin></code></li> <li>Limit the number of font weights and styles â each variant is a separate file</li> <li>Use variable fonts where possible â a single file replaces multiple weight/style variants</li> <li>Set long cache headers for font files (they rarely change)</li>",Wt,K,je="Frequently Asked Questions",Dt,j,ze="Do I still need TTF or OTF for web?",Yt,rt,Ue="No. WOFF2 with a WOFF fallback covers all modern browsers. TTF/OTF are only needed for desktop application use.",Rt,ut,Be="What about EOT (Embedded OpenType)?",$t,Q,Ne="EOT was an Internet Explorer-only format. IE is no longer supported. There is no reason to include EOT files in new projects.",Gt,Z,We="Should I use Google Fonts or self-host?",Jt,tt,De='Self-hosting is generally better for performance (fewer DNS lookups, more caching control) and privacy (no third-party requests). Google Fonts is convenient for prototyping. Use <a href="https://gwfh.mranftl.com/fonts">google-webfonts-helper</a> to easily download and self-host Google Fonts.',Xt,z,Zt="Related Resources",pt,r,_=$e(H[0].relatedLinks),S=[];for(let u=0;u<_.length;u+=1)S[u]=Al(gl(H,_,u));return{c(){p=i("h2"),p.textContent=x,v=d(),c=i("p"),c.textContent=L,C=d(),y=i("h2"),y.textContent=w,vt=d(),k=i("p"),k.textContent=re,ct=d(),et=i("h3"),et.textContent=ue,mt=d(),U=i("ul"),U.innerHTML=fe,xt=d(),g=i("h2"),g.textContent=pe,Ct=d(),B=i("p"),B.textContent=ve,_t=d(),N=i("h3"),N.textContent=he,Tt=d(),lt=i("ul"),lt.innerHTML=ce,yt=d(),q=i("h2"),q.textContent=me,bt=d(),it=i("p"),it.textContent=xe,Ht=d(),A=i("h3"),A.textContent=Ce,Mt=d(),W=i("ul"),W.innerHTML=_e,Lt=d(),D=i("h2"),D.textContent=Te,wt=d(),nt=i("p"),nt.textContent=ye,St=d(),I=i("h3"),I.textContent=be,Pt=d(),st=i("ul"),st.innerHTML=He,kt=d(),O=i("h2"),O.textContent=Me,qt=d(),ot=i("table"),ot.innerHTML=Le,Ft=d(),F=i("h2"),F.textContent=we,Et=d(),Y=i("p"),Y.innerHTML=Se,gt=d(),at=i("pre"),at.innerHTML=Pe,At=d(),dt=i("p"),dt.textContent=ke,It=d(),R=i("ul"),R.innerHTML=qe,Ot=d(),$=i("h2"),$.textContent=Fe,jt=d(),G=i("p"),G.textContent=Ee,zt=d(),J=i("p"),J.textContent=ge,Ut=d(),E=i("ul"),E.innerHTML=Ae,Bt=d(),X=i("h2"),X.textContent=Ie,Nt=d(),V=i("ul"),V.innerHTML=Oe,Wt=d(),K=i("h2"),K.textContent=je,Dt=d(),j=i("h3"),j.textContent=ze,Yt=d(),rt=i("p"),rt.textContent=Ue,Rt=d(),ut=i("h3"),ut.textContent=Be,$t=d(),Q=i("p"),Q.textContent=Ne,Gt=d(),Z=i("h3"),Z.textContent=We,Jt=d(),tt=i("p"),tt.innerHTML=De,Xt=d(),z=i("h2"),z.textContent=Zt,pt=d(),r=i("ul");for(let u=0;u<S.length;u+=1)S[u].c();this.h()},l(u){p=l(u,"H2",{id:!0,"data-svelte-h":!0}),o(p)!=="svelte-1p9criw"&&(p.textContent=x),v=a(u),c=l(u,"P",{"data-svelte-h":!0}),o(c)!=="svelte-1nzfbig"&&(c.textContent=L),C=a(u),y=l(u,"H2",{id:!0,"data-svelte-h":!0}),o(y)!=="svelte-78skrn"&&(y.textContent=w),vt=a(u),k=l(u,"P",{"data-svelte-h":!0}),o(k)!=="svelte-934ybo"&&(k.textContent=re),ct=a(u),et=l(u,"H3",{"data-svelte-h":!0}),o(et)!=="svelte-1culzmw"&&(et.textContent=ue),mt=a(u),U=l(u,"UL",{"data-svelte-h":!0}),o(U)!=="svelte-1ar10xd"&&(U.innerHTML=fe),xt=a(u),g=l(u,"H2",{id:!0,"data-svelte-h":!0}),o(g)!=="svelte-1bf1qt5"&&(g.textContent=pe),Ct=a(u),B=l(u,"P",{"data-svelte-h":!0}),o(B)!=="svelte-i0al0j"&&(B.textContent=ve),_t=a(u),N=l(u,"H3",{"data-svelte-h":!0}),o(N)!=="svelte-1culzmw"&&(N.textContent=he),Tt=a(u),lt=l(u,"UL",{"data-svelte-h":!0}),o(lt)!=="svelte-1ee0itf"&&(lt.innerHTML=ce),yt=a(u),q=l(u,"H2",{id:!0,"data-svelte-h":!0}),o(q)!=="svelte-19g82pa"&&(q.textContent=me),bt=a(u),it=l(u,"P",{"data-svelte-h":!0}),o(it)!=="svelte-e2i3zc"&&(it.textContent=xe),Ht=a(u),A=l(u,"H3",{"data-svelte-h":!0}),o(A)!=="svelte-1culzmw"&&(A.textContent=Ce),Mt=a(u),W=l(u,"UL",{"data-svelte-h":!0}),o(W)!=="svelte-urqhsc"&&(W.innerHTML=_e),Lt=a(u),D=l(u,"H2",{id:!0,"data-svelte-h":!0}),o(D)!=="svelte-lzr7ht"&&(D.textContent=Te),wt=a(u),nt=l(u,"P",{"data-svelte-h":!0}),o(nt)!=="svelte-qufdh3"&&(nt.textContent=ye),St=a(u),I=l(u,"H3",{"data-svelte-h":!0}),o(I)!=="svelte-1culzmw"&&(I.textContent=be),Pt=a(u),st=l(u,"UL",{"data-svelte-h":!0}),o(st)!=="svelte-1u53s9l"&&(st.innerHTML=He),kt=a(u),O=l(u,"H2",{id:!0,"data-svelte-h":!0}),o(O)!=="svelte-17unnvj"&&(O.textContent=Me),qt=a(u),ot=l(u,"TABLE",{"data-svelte-h":!0}),o(ot)!=="svelte-fist7s"&&(ot.innerHTML=Le),Ft=a(u),F=l(u,"H2",{id:!0,"data-svelte-h":!0}),o(F)!=="svelte-cd7277"&&(F.textContent=we),Et=a(u),Y=l(u,"P",{"data-svelte-h":!0}),o(Y)!=="svelte-1wcz31d"&&(Y.innerHTML=Se),gt=a(u),at=l(u,"PRE",{"data-svelte-h":!0}),o(at)!=="svelte-1uwq5kb"&&(at.innerHTML=Pe),At=a(u),dt=l(u,"P",{"data-svelte-h":!0}),o(dt)!=="svelte-jnd09f"&&(dt.textContent=ke),It=a(u),R=l(u,"UL",{"data-svelte-h":!0}),o(R)!=="svelte-72f176"&&(R.innerHTML=qe),Ot=a(u),$=l(u,"H2",{id:!0,"data-svelte-h":!0}),o($)!=="svelte-d2nyzr"&&($.textContent=Fe),jt=a(u),G=l(u,"P",{"data-svelte-h":!0}),o(G)!=="svelte-1xi75hm"&&(G.textContent=Ee),zt=a(u),J=l(u,"P",{"data-svelte-h":!0}),o(J)!=="svelte-janwag"&&(J.textContent=ge),Ut=a(u),E=l(u,"UL",{"data-svelte-h":!0}),o(E)!=="svelte-1nytwzx"&&(E.innerHTML=Ae),Bt=a(u),X=l(u,"H2",{id:!0,"data-svelte-h":!0}),o(X)!=="svelte-nz7ofh"&&(X.textContent=Ie),Nt=a(u),V=l(u,"UL",{"data-svelte-h":!0}),o(V)!=="svelte-ewuqoe"&&(V.innerHTML=Oe),Wt=a(u),K=l(u,"H2",{id:!0,"data-svelte-h":!0}),o(K)!=="svelte-hvsc9m"&&(K.textContent=je),Dt=a(u),j=l(u,"H3",{"data-svelte-h":!0}),o(j)!=="svelte-1hn3l0o"&&(j.textContent=ze),Yt=a(u),rt=l(u,"P",{"data-svelte-h":!0}),o(rt)!=="svelte-c6uu4q"&&(rt.textContent=Ue),Rt=a(u),ut=l(u,"H3",{"data-svelte-h":!0}),o(ut)!=="svelte-16zmukj"&&(ut.textContent=Be),$t=a(u),Q=l(u,"P",{"data-svelte-h":!0}),o(Q)!=="svelte-dyown0"&&(Q.textContent=Ne),Gt=a(u),Z=l(u,"H3",{"data-svelte-h":!0}),o(Z)!=="svelte-1ql8opn"&&(Z.textContent=We),Jt=a(u),tt=l(u,"P",{"data-svelte-h":!0}),o(tt)!=="svelte-1b2qdti"&&(tt.innerHTML=De),Xt=a(u),z=l(u,"H2",{id:!0,"data-svelte-h":!0}),o(z)!=="svelte-15a7nw5"&&(z.textContent=Zt),pt=a(u),r=l(u,"UL",{});var T=de(r);for(let P=0;P<S.length;P+=1)S[P].l(T);T.forEach(t),this.h()},h(){M(p,"id","overview"),M(y,"id","ttf"),M(g,"id","otf"),M(q,"id","woff"),M(D,"id","woff2"),M(O,"id","comparison"),M(F,"id","implementation"),M($,"id","subsetting"),M(X,"id","performance-tips"),M(K,"id","faq"),M(z,"id","related")},m(u,T){e(u,p,T),e(u,v,T),e(u,c,T),e(u,C,T),e(u,y,T),e(u,vt,T),e(u,k,T),e(u,ct,T),e(u,et,T),e(u,mt,T),e(u,U,T),e(u,xt,T),e(u,g,T),e(u,Ct,T),e(u,B,T),e(u,_t,T),e(u,N,T),e(u,Tt,T),e(u,lt,T),e(u,yt,T),e(u,q,T),e(u,bt,T),e(u,it,T),e(u,Ht,T),e(u,A,T),e(u,Mt,T),e(u,W,T),e(u,Lt,T),e(u,D,T),e(u,wt,T),e(u,nt,T),e(u,St,T),e(u,I,T),e(u,Pt,T),e(u,st,T),e(u,kt,T),e(u,O,T),e(u,qt,T),e(u,ot,T),e(u,Ft,T),e(u,F,T),e(u,Et,T),e(u,Y,T),e(u,gt,T),e(u,at,T),e(u,At,T),e(u,dt,T),e(u,It,T),e(u,R,T),e(u,Ot,T),e(u,$,T),e(u,jt,T),e(u,G,T),e(u,zt,T),e(u,J,T),e(u,Ut,T),e(u,E,T),e(u,Bt,T),e(u,X,T),e(u,Nt,T),e(u,V,T),e(u,Wt,T),e(u,K,T),e(u,Dt,T),e(u,j,T),e(u,Yt,T),e(u,rt,T),e(u,Rt,T),e(u,ut,T),e(u,$t,T),e(u,Q,T),e(u,Gt,T),e(u,Z,T),e(u,Jt,T),e(u,tt,T),e(u,Xt,T),e(u,z,T),e(u,pt,T),e(u,r,T);for(let P=0;P<S.length;P+=1)S[P]&&S[P].m(r,null)},p(u,[T]){if(T&1){_=$e(u[0].relatedLinks);let P;for(P=0;P<_.length;P+=1){const f=gl(u,_,P);S[P]?S[P].p(f,T):(S[P]=Al(f),S[P].c(),S[P].m(r,null))}for(;P<S.length;P+=1)S[P].d(1);S.length=_.length}},i:Ye,o:Ye,d(u){u&&(t(p),t(v),t(c),t(C),t(y),t(vt),t(k),t(ct),t(et),t(mt),t(U),t(xt),t(g),t(Ct),t(B),t(_t),t(N),t(Tt),t(lt),t(yt),t(q),t(bt),t(it),t(Ht),t(A),t(Mt),t(W),t(Lt),t(D),t(wt),t(nt),t(St),t(I),t(Pt),t(st),t(kt),t(O),t(qt),t(ot),t(Ft),t(F),t(Et),t(Y),t(gt),t(at),t(At),t(dt),t(It),t(R),t(Ot),t($),t(jt),t(G),t(zt),t(J),t(Ut),t(E),t(Bt),t(X),t(Nt),t(V),t(Wt),t(K),t(Dt),t(j),t(Yt),t(rt),t(Rt),t(ut),t($t),t(Q),t(Gt),t(Z),t(Jt),t(tt),t(Xt),t(z),t(pt),t(r)),cl(S,u)}}}
80function li(H,p,x){let{article:v}=p;return H.$$set=c=>{"article"in c&&x(0,v=c.article)},[v]}class ii extends il{constructor(p){super(),nl(this,p,li,ei,ll,{article:0})}}const ni=Object.freeze(Object.defineProperty({__proto__:null,default:ii},Symbol.toStringTag,{value:"Module"}));function si(H){let p,x="Loadingâ¦";return{c(){p=i("p"),p.textContent=x},l(v){p=l(v,"P",{"data-svelte-h":!0}),o(p)!=="svelte-cr9qbe"&&(p.textContent=x)},m(v,c){e(v,p,c)},p:Ye,i:Ye,o:Ye,d(v){v&&t(p)}}}function oi(H){let p,x,v;var c=H[2];function L(C,y){return{props:{article:C[1]}}}return c&&(p=Ml(c,L(H))),{c(){p&&bl(p.$$.fragment),x=_l()},l(C){p&&Il(p.$$.fragment,C),x=_l()},m(C,y){p&&yl(p,C,y),e(C,x,y),v=!0},p(C,y){if(y&4&&c!==(c=C[2])){if(p){Ol();const w=p;vl(w.$$.fragment,1,0,()=>{Tl(w,1)}),jl()}c?(p=Ml(c,L(C)),bl(p.$$.fragment),hl(p.$$.fragment,1),yl(p,x.parentNode,x)):p=null}else if(c){const w={};y&2&&(w.article=C[1]),p.$set(w)}},i(C){v||(p&&hl(p.$$.fragment,C),v=!0)},o(C){p&&vl(p.$$.fragment,C),v=!1},d(C){C&&t(x),p&&Tl(p,C)}}}function ai(H){let p,x,v,c;const L=[oi,si],C=[];function y(w,vt){return w[2]?0:1}return p=y(H),x=C[p]=L[p](H),{c(){x.c(),v=_l()},l(w){x.l(w),v=_l()},m(w,vt){C[p].m(w,vt),e(w,v,vt),c=!0},p(w,vt){let k=p;p=y(w),p===k?C[p].p(w,vt):(Ol(),vl(C[k],1,1,()=>{C[k]=null}),jl(),x=C[p],x?x.p(w,vt):(x=C[p]=L[p](w),x.c()),hl(x,1),x.m(v.parentNode,v))},i(w){c||(hl(x),c=!0)},o(w){vl(x),c=!1},d(w){w&&t(v),C[p].d(w)}}}function di(H){let p,x;return p=new zl({props:{title:H[1].title+" - Colin Mackay",description:H[1].description,heroImage:H[1].heroImage,canonicalUrl:H[1].canonicalUrl,ogImage:"https://colinmackay.net"+H[1].heroImage,lastUpdated:H[0].lastUpdatedFormatted,breadcrumbs:H[3],$$slots:{default:[ai]},$$scope:{ctx:H}}}),{c(){bl(p.$$.fragment)},l(v){Il(p.$$.fragment,v)},m(v,c){yl(p,v,c),x=!0},p(v,[c]){const L={};c&2&&(L.title=v[1].title+" - Colin Mackay"),c&2&&(L.description=v[1].description),c&2&&(L.heroImage=v[1].heroImage),c&2&&(L.canonicalUrl=v[1].canonicalUrl),c&2&&(L.ogImage="https://colinmackay.net"+v[1].heroImage),c&1&&(L.lastUpdated=v[0].lastUpdatedFormatted),c&8&&(L.breadcrumbs=v[3]),c&38&&(L.$$scope={dirty:c,ctx:v}),p.$set(L)},i(v){x||(hl(p.$$.fragment,v),x=!0)},o(v){vl(p.$$.fragment,v),x=!1},d(v){Tl(p,v)}}}function ri(H,p,x){let v,c,L,{data:C}=p;const y=Object.assign({"./content/brotli-vs-gzip-2026.svelte":Wl,"./content/html-vs-html5-web-page-extensions.svelte":$l,"./content/json-vs-xml-vs-yaml-2026.svelte":Vl,"./content/understanding-mime-types-file-extensions-web.svelte":ti,"./content/web-font-formats-ttf-otf-woff-woff2.svelte":ni});return H.$$set=w=>{"data"in w&&x(0,C=w.data)},H.$$.update=()=>{H.$$.dirty&1&&x(1,v=C.article),H.$$.dirty&2&&x(3,c=[{label:"Home",href:"/"},{label:"Development Notes",href:"/dev-notes/"},{label:v.title,href:`/dev-notes/${v.slug}/`}]),H.$$.dirty&2&&x(2,L=y[`./content/${v.slug}.svelte`]?.default??null)},[C,v,L,c]}class ci extends il{constructor(p){super(),nl(this,p,ri,di,ll,{data:0})}}export{ci as component};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.