Run results for: iloop - console.log vs. ptag vs. ctag vs. slim vs. ptag no-log (logLevel=0) vs. ptag native-bypass (logLevel=-1) vs. ptag NO_COLOR

A looped version of the ptag test that prints a new line and number instead of updating the devtool's inline counter

Go to the benchmark

Run details:

User agent: Mozilla/5.0 (X11; Linux x86_64; rv:128.0) Gecko/20100101 Firefox/128.0

Browser: Firefox 128

Operating system: Linux

Device Platform: Desktop

Date tested: one year ago

Test name	Executions per second
console.log (native)	61450.6 Ops/sec
ptag	27604.4 Ops/sec
ctag	37175.8 Ops/sec
stag	43680.6 Ops/sec
ptag no-log (logLevel=0)	935240.2 Ops/sec
ptag native-bypass (logLevel=-1)	55228.8 Ops/sec
ptag NO_COLOR	50655.4 Ops/sec

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

const ITERATIONS = 3;
const ptag=(u,G,F,a,J,w="_id",L="_def",A="_lvl",Y="PTAG_",K="_FORCE",U={},x=()=>{},B=(I,E="s")=>(typeof I)[0]==E,C=B(globalThis,"o")?globalThis:U,i=([I,E,m],T)=>[E??C[Y+I]??m,C[Y+I+K]].map((O)=>T>3?B(O)?JSON.parse(O):O:O),[[Q,n],[V,X],[f,c],[v,k]]=[["ID",u,"{}"],["LVL",G,5],["PLG",a],["DEF",null,U]].map(i),H={debug:[5,">","#89A"],log:[4,">","#2AE"],info:[4,"i","#1AA"],check:[3,"?","#D6D"],warn:[2,"!","#F77"],error:[1,"X","#F36"],_dl:["[","]","|"],_css:["color:#0000;margin:-1px 0 -1px -1ch;padding:1px;","border-radius:2px;background:^^^;color:^^;","color:^;","border-right:2px solid ^;","color:^;font-weight:900;font-family:Menlo,Consolas,monospace;margin:-1px 0;padding:1px 3px;"],...v,...F??U,...k??U},M=(I,E=H)=>({...E,...I??H}),N=console)=>new Proxy({[w]:Q,[L]:M(),[A]:V},{get:(I,E)=>{let m=I[L]??H,T=m[E];X=C[Y+"LVL"+K];let O=~~(X??I[A]),Z=E==A||E==w||E==L?I[E]:O&&(O==-1||!T&&(E in N))?N[E]??N.log:!O||T?.[0]>O?x:null;if(!Z&&((I[E]??x)===x||0>J)){I[L]=T?m:M({[E]:[5,E,"#a58"]},m),T=I[L][E];let D=(n??I[w]??"").replace("{}",E),$=c??f,[_,b,S,P,r,W,q]=$?$(T,E,D,I):T;if(_!==T[0]){if(B(_,"f"))return _;D=B(_)?_:D}q=k?._dl??q??m._dl,W=k?._css??W??m._css;let h=J??("NO_COLOR"in C||!(P??m._fg!="")?0:3),[t,g,d]=q.map((R)=>h?`%c${R}%c`:R),[z,s,l,p,o]=W;I[E]=(N[r??E]??N.log).bind(N,t+(E==b?"*":b)+g+D+d,...h?[z,s,z,l,z+p,""].map((R)=>R?((o??"")+R).replace(/\^+/g,(j)=>(j=="^"?P??S:j=="^^"?P??m._fg:S)??"#000c"):R):[])}return Z||I[E]},set:(I,E,m)=>{I[E]=E==A?m??V:E==w?m??Q:M(m,I[L]);for(let T in I[L])I[T]=x;return!0}});
const ctag=(u,G,F,a,J,w="_id",L="_def",A="_lvl",Y="PTAG_",K="_FORCE",U={},x=()=>{},B=(I,E="s")=>(typeof I)[0]==E,C=B(globalThis,"o")?globalThis:U,c=([I,E,m],T)=>[E??C[Y+I]??m,C[Y+I+K]].map((O)=>T>3?B(O)?JSON.parse(O):O:O),[[Q,i],[V,X],[n,f],[v,k]]=[["ID",u,"{}"],["LVL",G,5],["PLG",a],["DEF",null,U]].map(c),H={debug:[5,">","#89A"],log:[4,">","#2AE"],info:[4,"i","#1AA"],check:[3,"?","#D6D"],warn:[2,"!","#F77"],error:[1,"X","#F36"],_dl:["",":",":"],_css:[" "," "," "," ","color:^;font-weight:900;font-family:Menlo,Consolas,monospace;"],...v,...F??U,...k??U},M=(I,E=H)=>({...E,...I??H}),N=console)=>new Proxy({[w]:Q,[L]:M(),[A]:V},{get:(I,E)=>{let m=I[L]??H,T=m[E];X=C[Y+"LVL"+K];let O=~~(X??I[A]),Z=E==A||E==w||E==L?I[E]:O&&(O==-1||!T&&(E in N))?N[E]??N.log:!O||T?.[0]>O?x:null;if(!Z&&((I[E]??x)===x||0>J)){I[L]=T?m:M({[E]:[5,E,"#a58"]},m),T=I[L][E];let D=(i??I[w]??"").replace("{}",E),$=f??n,[_,b,S,P,r,W,q]=$?$(T,E,D,I):T;if(_!==T[0]){if(B(_,"f"))return _;D=B(_)?_:D}q=k?._dl??q??m._dl,W=k?._css??W??m._css;let h=J??("NO_COLOR"in C||!(P??m._fg!="")?0:3),[t,g,d]=q.map((R)=>h?`%c${R}%c`:R),[z,s,l,p,o]=W;I[E]=(N[r??E]??N.log).bind(N,t+(E==b?"*":b)+g+D+d,...h?[z,s,z,l,z+p,""].map((R)=>R?((o??"")+R).replace(/\^+/g,(j)=>(j=="^"?P??S:j=="^^"?P??m._fg:S)??"#000c"):R):[])}return Z||I[E]},set:(I,E,m)=>{I[E]=E==A?m??V:E==w?m??Q:M(m,I[L]);for(let T in I[L])I[T]=x;return!0}});
const slim=(M,I,N,V,E,R='_id',z='_def',F='_lvl',S=N??{},y=[3,'?','#D6D'],J={debug:[5,'>','#89A'],log:[4,'>','#2AE'],info:[4,'i','#1AA'],check:y,warn:[2,'!','#F77'],error:[1,'X','#F36'],_fg:S._fg??'#fff',_dl:S._dl??['',':',':'],_css:S._css??[' ',' ',' ',' ','color:^;']},K=(q,j=J)=>({...j,...q??J}),G=()=>{},B=console)=>new Proxy({[R]:M??'{}',[z]:K(),[F]:I??5},{get:(q,j)=>{let f=q[z]??J,g=f[j],l=~~q[F],e=j==F||j==R||j==z?q[j]:l&&(-1==l||!g&&j in B)?B[j]??B.log:!l||g?.[0]>l?G:null;if(!e&&(q[j]??G)===G){q[z]=g?f:K({[j]:y},f);let[,l,e,c,o]=q[z][j],[_,n,s]=f._dl.map(D=>`%c${D}%c`);q[j]=(B[o??j]??B.log).bind(B,_+l+n+q[R]?.replace('{}',j)+s,...f._css.concat('').map(D=>D&&((f._css[4]??'')+D).replace(/\^+/g,r=>'^'==r?c??e:'^^'==r?c??f._fg:e)))}return e||q[j]},set:(q,j,w)=>{q[j]=j==F?w??I:j==R?w??M:K(w,q[z]);for(let j in q[z])q[j]=G;return!0}});

const tag = ptag();
const cag = ctag();
const sag = slim();
const tagNoLog = ptag(null, 0); // no log
const tagBypass = ptag(null, -1); // native bypass
const tagNoColor = ptag(null, null, null, null, 0); // could also use: ptag(null, null, {_fg: ''})

Tests:

console.log (native)
for (let i = ITERATIONS-1; i > -1; i--) { console.log(i); }
ptag
for (let i = ITERATIONS-1; i > -1; i--) { tag.log(i); }
ctag
for (let i = ITERATIONS-1; i > -1; i--) { cag.log(i); }
stag
for (let i = ITERATIONS-1; i > -1; i--) { sag.log(i); }
ptag no-log (logLevel=0)
for (let i = ITERATIONS-1; i > -1; i--) { tagNoLog.log(i); }
ptag native-bypass (logLevel=-1)
for (let i = ITERATIONS-1; i > -1; i--) { tagBypass.log(i); }
ptag NO_COLOR
for (let i = ITERATIONS-1; i > -1; i--) { tagNoColor.log(i); }

Run results for: iloop - console.log vs. ptag vs. ctag vs. slim vs. ptag no-log (logLevel=0) vs. ptag native-bypass (logLevel=-1) vs. ptag NO_COLOR

A looped version of the ptag test that prints a new line and number instead of updating the devtool's inline counter

console.log (native)

ptag

ctag

stag

ptag no-log (logLevel=0)

ptag native-bypass (logLevel=-1)

ptag NO_COLOR