Skip to content

Instantly share code, notes, and snippets.

@JobLeonard
Last active July 29, 2026 10:43
Show Gist options
  • Select an option

  • Save JobLeonard/66f9fafebaff934e2bd9954e11c9c0fd to your computer and use it in GitHub Desktop.

Select an option

Save JobLeonard/66f9fafebaff934e2bd9954e11c9c0fd to your computer and use it in GitHub Desktop.
Color string generation
{"title":"Color string generation","initialization":"function channelsToHex1(r, g, b) {\n const R = r.toString(16);\n const G = g.toString(16);\n const B = b.toString(16);\n return \"#\" +\n (R.length === 1 ? \"0\" : \"\") + R +\n (G.length === 1 ? \"0\" : \"\") + G +\n (B.length === 1 ? \"0\" : \"\") + B;\n}\n\nconst decoder = new TextDecoder();\nconst hexArr = new Uint8Array(7);\nhexArr[0] = \"#\".charCodeAt(0);\n\nfunction channelsToHex2(r, g, b) {\n const r0 = r >> 4;\n r &= 15;\n const g0 = g >> 4;\n g &= 15;\n const b0 = b >> 4;\n b &= 15;\n hexArr[1] = r0 + (r0 < 10 ? 48 : 87);\n hexArr[2] = r + (r < 10 ? 48 : 87);\n hexArr[3] = g0 + (r0 < 10 ? 48 : 87);\n hexArr[4] = g + (g < 10 ? 48 : 87);\n hexArr[5] = b0 + (r0 < 10 ? 48 : 87);\n hexArr[6] = b + (b < 10 ? 48 : 87);\n return decoder.decode(hexArr);\n}\n\nfunction channelsToHex3(r, g, b) {\n const R = r.toString(16);\n const G = g.toString(16);\n const B = b.toString(16);\n return `#${R.length === 1 ? \"0\" : \"\"}${R}${G.length === 1 ? \"0\" : \"\"}${G}${B.length === 1 ? \"0\" : \"\"}${B}`;\n}\n\nconst valToHex = [\"00\"];\nfor (let i = 1; i < 256; i++) {\n valToHex[i] = i.toString(16).padStart(2, \"0\");\n}\n\nfunction channelsToHex4(r, g, b) {\n return \"#\" + valToHex[r] + valToHex[g] + valToHex[b];\n}\n\nfunction channelsToHex5(r, g, b) {\n return `#${valToHex[r]}${valToHex[g]}${valToHex[b]}`;\n}\n\nconst rValToHex = valToHex.map(h => \"#\" + h);\n\nfunction channelsToHex6(r, g, b) {\n return rValToHex[r] + valToHex[g] + valToHex[b];\n}\n\nfunction channelsToHex7(r, g, b) {\n return `${rValToHex[r]}${valToHex[g]}${valToHex[b]}`;\n}\n\nconst {random} = Math;\nconst colors = 100000;\nconst randomChannels = new Uint8Array(colors * 3);\nfor (let i = 0; i < colors; i++) {\n randomChannels[i * 3] = random() * 0x100 | 0;\n randomChannels[i * 3 + 1] = random() * 0x100 | 0;\n randomChannels[i * 3 + 2] = random() * 0x100 | 0;\n}\n","setup":"// runs before each test","tests":[{"name":"channelsToHex1","code":"for (let i = 0; i < colors; i++) {\n const rgb = channelsToHex1(\n randomChannels[i*3],\n randomChannels[i*3 + 1],\n randomChannels[i*3 + 2]\n );\n}","results":{"aborted":false,"count":12,"cycles":2,"hz":137.7511087920689,"stats":{"moe":0.0001145395398177032,"rme":1.577794861042194,"sem":0.00005843854072331796,"deviation":0.00043731399513938484,"mean":0.0072594696969696965,"variance":1.9124353034476992e-7,"numSamples":56},"times":{"cycle":0.08711363636363637,"elapsed":5.829,"period":0.0072594696969696965,"timeStamp":1785321754206}},"platforms":{"Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/114.0":{"aborted":false,"count":11,"cycles":2,"hz":137.2141372141372,"stats":{"moe":0.0000918338244229807,"rme":1.2600898985273858,"sem":0.000046853992052541176,"deviation":0.0003629294618456533,"mean":0.0072878787878787885,"variance":1.3171779427557553e-7,"numSamples":60},"times":{"cycle":0.08016666666666668,"elapsed":5.948,"period":0.0072878787878787885,"timeStamp":1686573372783}},"Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/115.0.0.0 Safari/537.36":{"aborted":false,"count":7,"cycles":3,"hz":82.19178082191779,"stats":{"moe":0.0001240218190492282,"rme":1.019357416842971,"sem":0.00006327643829042255,"deviation":0.00046498495965672826,"mean":0.01216666666666667,"variance":2.162110127069692e-7,"numSamples":54},"times":{"cycle":0.08516666666666668,"elapsed":6.143,"period":0.01216666666666667,"timeStamp":1686571847151}},"Mozilla/5.0 (X11; Linux x86_64; rv:153.0) Gecko/20100101 Firefox/153.0":{"aborted":false,"count":12,"cycles":2,"hz":137.7511087920689,"stats":{"moe":0.0001145395398177032,"rme":1.577794861042194,"sem":0.00005843854072331796,"deviation":0.00043731399513938484,"mean":0.0072594696969696965,"variance":1.9124353034476992e-7,"numSamples":56},"times":{"cycle":0.08711363636363637,"elapsed":5.829,"period":0.0072594696969696965,"timeStamp":1785321754206}}}},{"name":"channelsToHex2","code":"for (let i = 0; i < colors; i++) {\n const rgb = channelsToHex2(\n randomChannels[i*3],\n randomChannels[i*3 + 1],\n randomChannels[i*3 + 2]\n );\n}","results":{"aborted":false,"count":5,"cycles":2,"hz":58.537662911420384,"stats":{"moe":0.0002265922925372138,"rme":1.3264183238869378,"sem":0.00011560831251898662,"deviation":0.0008416412192525073,"mean":0.017083018867924522,"variance":7.08359941944847e-7,"numSamples":53},"times":{"cycle":0.0854150943396226,"elapsed":5.996,"period":0.017083018867924522,"timeStamp":1785321760040}},"platforms":{"Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/114.0":{"aborted":false,"count":4,"cycles":2,"hz":51.03969754253309,"stats":{"moe":0.00015122315354083486,"rme":0.7718384018152253,"sem":0.00007715467017389534,"deviation":0.0005669687195963276,"mean":0.01959259259259259,"variance":3.2145352900069907e-7,"numSamples":54},"times":{"cycle":0.07837037037037035,"elapsed":5.844,"period":0.01959259259259259,"timeStamp":1686573378736}},"Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/115.0.0.0 Safari/537.36":{"aborted":false,"count":3,"cycles":2,"hz":25.453388482341715,"stats":{"moe":0.00032244878455495646,"rme":0.8207414178936213,"sem":0.00016451468599742677,"deviation":0.0010404822325985569,"mean":0.039287499999999996,"variance":0.0000010826032763532776,"numSamples":40},"times":{"cycle":0.11786249999999998,"elapsed":6.675,"period":0.039287499999999996,"timeStamp":1686571853303}},"Mozilla/5.0 (X11; Linux x86_64; rv:153.0) Gecko/20100101 Firefox/153.0":{"aborted":false,"count":5,"cycles":2,"hz":58.537662911420384,"stats":{"moe":0.0002265922925372138,"rme":1.3264183238869378,"sem":0.00011560831251898662,"deviation":0.0008416412192525073,"mean":0.017083018867924522,"variance":7.08359941944847e-7,"numSamples":53},"times":{"cycle":0.0854150943396226,"elapsed":5.996,"period":0.017083018867924522,"timeStamp":1785321760040}}}},{"name":"channelsToHex3","code":"for (let i = 0; i < colors; i++) {\n const rgb = channelsToHex3(\n randomChannels[i*3],\n randomChannels[i*3 + 1],\n randomChannels[i*3 + 2]\n );\n}","results":{"aborted":false,"count":13,"cycles":3,"hz":152.61445179449063,"stats":{"moe":0.00009065331644641818,"rme":1.3835006192822592,"sem":0.00004625169206449907,"deviation":0.0003552659878329553,"mean":0.006552459405001774,"variance":1.2621392211092556e-7,"numSamples":59},"times":{"cycle":0.08518197226502307,"elapsed":6.037,"period":0.006552459405001774,"timeStamp":1785321766041}},"platforms":{"Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/114.0":{"aborted":false,"count":11,"cycles":2,"hz":141.1383618695048,"stats":{"moe":0.0000490615485834453,"rme":0.6924466597848594,"sem":0.0000250314023384925,"deviation":0.0001955015020017001,"mean":0.007085245901639347,"variance":3.8220837284920754e-8,"numSamples":61},"times":{"cycle":0.07793770491803281,"elapsed":5.838,"period":0.007085245901639347,"timeStamp":1686573384586}},"Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/115.0.0.0 Safari/537.36":{"aborted":false,"count":6,"cycles":2,"hz":65.8790460714129,"stats":{"moe":0.00008659180766998447,"rme":0.5704585686897831,"sem":0.00004417949370917575,"deviation":0.00031239619591146586,"mean":0.015179333333333331,"variance":9.759138321995495e-8,"numSamples":50},"times":{"cycle":0.09107599999999999,"elapsed":6.15,"period":0.015179333333333331,"timeStamp":1686571859991}},"Mozilla/5.0 (X11; Linux x86_64; rv:153.0) Gecko/20100101 Firefox/153.0":{"aborted":false,"count":13,"cycles":3,"hz":152.61445179449063,"stats":{"moe":0.00009065331644641818,"rme":1.3835006192822592,"sem":0.00004625169206449907,"deviation":0.0003552659878329553,"mean":0.006552459405001774,"variance":1.2621392211092556e-7,"numSamples":59},"times":{"cycle":0.08518197226502307,"elapsed":6.037,"period":0.006552459405001774,"timeStamp":1785321766041}}}},{"name":"channelsToHex4","code":"for (let i = 0; i < colors; i++) {\n const rgb = channelsToHex4(\n randomChannels[i*3],\n randomChannels[i*3 + 1],\n randomChannels[i*3 + 2]\n );\n}","results":{"aborted":false,"count":123,"cycles":8,"hz":1468.3944471036355,"stats":{"moe":0.000007222552733737424,"rme":1.0605556328133214,"sem":0.0000036849758845599104,"deviation":0.000028543700464152956,"mean":0.0006810159231890793,"variance":8.147428361872857e-10,"numSamples":60},"times":{"cycle":0.08376495855225675,"elapsed":6.373,"period":0.0006810159231890793,"timeStamp":1785321772084}},"platforms":{"Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/114.0":{"aborted":false,"count":151,"cycles":4,"hz":1838.8768266233064,"stats":{"moe":0.00001201218059933103,"rme":2.2088920541323893,"sem":0.00000612866357108726,"deviation":0.00004864475903483374,"mean":0.0005438102136706353,"variance":2.3663125815570387e-9,"numSamples":63},"times":{"cycle":0.08211534226426592,"elapsed":6.151,"period":0.0005438102136706353,"timeStamp":1686573390430}},"Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/115.0.0.0 Safari/537.36":{"aborted":false,"count":134,"cycles":7,"hz":1751.6339869281064,"stats":{"moe":0.0000017080499222648314,"rme":0.2991878295208989,"sem":8.714540419718528e-7,"deviation":0.000007079726104854571,"mean":0.0005708955223880591,"variance":5.012252171975927e-11,"numSamples":66},"times":{"cycle":0.07649999999999992,"elapsed":6.233,"period":0.0005708955223880591,"timeStamp":1686571866151}},"Mozilla/5.0 (X11; Linux x86_64; rv:153.0) Gecko/20100101 Firefox/153.0":{"aborted":false,"count":123,"cycles":8,"hz":1468.3944471036355,"stats":{"moe":0.000007222552733737424,"rme":1.0605556328133214,"sem":0.0000036849758845599104,"deviation":0.000028543700464152956,"mean":0.0006810159231890793,"variance":8.147428361872857e-10,"numSamples":60},"times":{"cycle":0.08376495855225675,"elapsed":6.373,"period":0.0006810159231890793,"timeStamp":1785321772084}}}},{"name":"channelsToHex5","code":"for (let i = 0; i < colors; i++) {\n const rgb = channelsToHex5(\n randomChannels[i*3],\n randomChannels[i*3 + 1],\n randomChannels[i*3 + 2]\n );\n}","results":{"aborted":false,"count":66,"cycles":7,"hz":851.9482109810441,"stats":{"moe":0.000006938912882960728,"rme":0.5911594416791711,"sem":0.0000035402616749799632,"deviation":0.00002854250212011161,"mean":0.001173780268695523,"variance":8.146744272765757e-10,"numSamples":65},"times":{"cycle":0.07746949773390452,"elapsed":6.323,"period":0.001173780268695523,"timeStamp":1785321778462}},"platforms":{"Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/114.0":{"aborted":false,"count":58,"cycles":3,"hz":721.8831526646863,"stats":{"moe":0.000018691735504646108,"rme":1.3493248954868384,"sem":0.000009536599747268423,"deviation":0.00007509126150129061,"mean":0.00138526574045772,"variance":5.638697553855209e-9,"numSamples":62},"times":{"cycle":0.08034541294654776,"elapsed":5.922,"period":0.00138526574045772,"timeStamp":1686573396586}},"Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/115.0.0.0 Safari/537.36":{"aborted":false,"count":24,"cycles":4,"hz":308.8057901085645,"stats":{"moe":0.00001937482109883555,"rme":0.5983056937637997,"sem":0.000009885112805528342,"deviation":0.00007908090244422674,"mean":0.0032382812500000003,"variance":6.253789131393306e-9,"numSamples":64},"times":{"cycle":0.07771875,"elapsed":6.399,"period":0.0032382812500000003,"timeStamp":1686571872391}},"Mozilla/5.0 (X11; Linux x86_64; rv:153.0) Gecko/20100101 Firefox/153.0":{"aborted":false,"count":66,"cycles":7,"hz":851.9482109810441,"stats":{"moe":0.000006938912882960728,"rme":0.5911594416791711,"sem":0.0000035402616749799632,"deviation":0.00002854250212011161,"mean":0.001173780268695523,"variance":8.146744272765757e-10,"numSamples":65},"times":{"cycle":0.07746949773390452,"elapsed":6.323,"period":0.001173780268695523,"timeStamp":1785321778462}}}},{"name":"channelsToHex6","code":"for (let i = 0; i < colors; i++) {\n const rgb = channelsToHex6(\n randomChannels[i*3],\n randomChannels[i*3 + 1],\n randomChannels[i*3 + 2]\n );\n}","results":{"aborted":false,"count":134,"cycles":7,"hz":1701.3862652700905,"stats":{"moe":0.0000044327438279071805,"rme":0.7541809466262043,"sem":0.000002261603993830194,"deviation":0.00001795092519535545,"mean":0.0005877560083872269,"variance":3.2223571536924707e-10,"numSamples":63},"times":{"cycle":0.07875930512388842,"elapsed":6.182,"period":0.0005877560083872269,"timeStamp":1785321784790}},"platforms":{"Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/114.0":{"aborted":false,"count":162,"cycles":5,"hz":1886.119516686189,"stats":{"moe":0.000008825598737484362,"rme":1.6646134025210244,"sem":0.000004502856498716511,"deviation":0.00003487897645978177,"mean":0.0005301890952048185,"variance":1.216542998882011e-9,"numSamples":60},"times":{"cycle":0.0858906334231806,"elapsed":6.208,"period":0.0005301890952048185,"timeStamp":1686573402513}},"Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/115.0.0.0 Safari/537.36":{"aborted":false,"count":134,"cycles":5,"hz":1733.2480345738104,"stats":{"moe":0.0000025754603439243196,"rme":0.4463911579229617,"sem":0.0000013140103795532242,"deviation":0.000010512083036425794,"mean":0.0005769514691795919,"variance":1.1050388976471093e-10,"numSamples":64},"times":{"cycle":0.07731149687006532,"elapsed":6.178,"period":0.0005769514691795919,"timeStamp":1686571878799}},"Mozilla/5.0 (X11; Linux x86_64; rv:153.0) Gecko/20100101 Firefox/153.0":{"aborted":false,"count":134,"cycles":7,"hz":1701.3862652700905,"stats":{"moe":0.0000044327438279071805,"rme":0.7541809466262043,"sem":0.000002261603993830194,"deviation":0.00001795092519535545,"mean":0.0005877560083872269,"variance":3.2223571536924707e-10,"numSamples":63},"times":{"cycle":0.07875930512388842,"elapsed":6.182,"period":0.0005877560083872269,"timeStamp":1785321784790}}}},{"name":"channelsToHex7","code":"for (let i = 0; i < colors; i++) {\n const rgb = channelsToHex7(\n randomChannels[i*3],\n randomChannels[i*3 + 1],\n randomChannels[i*3 + 2]\n );\n}","results":{"aborted":false,"count":72,"cycles":7,"hz":923.5729517371993,"stats":{"moe":0.00000747788136539311,"rme":0.6906368965376712,"sem":0.0000038152455945883215,"deviation":0.000030282573101746367,"mean":0.0010827515012420458,"variance":9.170342336626126e-10,"numSamples":63},"times":{"cycle":0.0779581080894273,"elapsed":6.113,"period":0.0010827515012420458,"timeStamp":1785321790978}},"platforms":{"Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/114.0":{"aborted":false,"count":58,"cycles":3,"hz":731.4852650422507,"stats":{"moe":0.00001560444078775889,"rme":1.141441850546992,"sem":0.000007961449381509639,"deviation":0.0000631920454173105,"mean":0.0013670815364165126,"variance":3.993234604023433e-9,"numSamples":63},"times":{"cycle":0.07929072911215773,"elapsed":5.843,"period":0.0013670815364165126,"timeStamp":1686573408727}},"Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/115.0.0.0 Safari/537.36":{"aborted":false,"count":35,"cycles":5,"hz":446.09719722627506,"stats":{"moe":0.000010669132390740522,"rme":0.47594700563454134,"sem":0.000005443434893234961,"deviation":0.00004320592501641341,"mean":0.0022416639383025924,"variance":1.866751956523938e-9,"numSamples":63},"times":{"cycle":0.07845823784059074,"elapsed":6.371,"period":0.0022416639383025924,"timeStamp":1686571884983}},"Mozilla/5.0 (X11; Linux x86_64; rv:153.0) Gecko/20100101 Firefox/153.0":{"aborted":false,"count":72,"cycles":7,"hz":923.5729517371993,"stats":{"moe":0.00000747788136539311,"rme":0.6906368965376712,"sem":0.0000038152455945883215,"deviation":0.000030282573101746367,"mean":0.0010827515012420458,"variance":9.170342336626126e-10,"numSamples":63},"times":{"cycle":0.0779581080894273,"elapsed":6.113,"period":0.0010827515012420458,"timeStamp":1785321790978}}}},{"name":"channelsToHex4 inlined","code":"for (let i = 0; i < colors; i++) {\n const rgb = \"#\" +\n valToHex[randomChannels[i*3]] +\n valToHex[randomChannels[i*3 + 1]]+\n valToHex[randomChannels[i*3 + 2]];\n}","results":{"aborted":false,"count":137,"cycles":7,"hz":1600.1286199204528,"stats":{"moe":0.000011356282047918937,"rme":1.8171511920763943,"sem":0.000005794021453019866,"deviation":0.00004412595275670722,"mean":0.0006249497618820873,"variance":1.947099706687158e-9,"numSamples":58},"times":{"cycle":0.08561811737784597,"elapsed":6.153,"period":0.0006249497618820873,"timeStamp":1785321797097}},"platforms":{"Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/115.0.0.0 Safari/537.36":{"aborted":false,"count":159,"cycles":4,"hz":2069.8268946732655,"stats":{"moe":0.000001989116689596119,"rme":0.4117127220769501,"sem":0.0000010148554538755709,"deviation":0.000008182026246411363,"mean":0.0004831321897369857,"variance":6.694555349696441e-11,"numSamples":65},"times":{"cycle":0.07681801816818074,"elapsed":6.13,"period":0.0004831321897369857,"timeStamp":1686571891367}},"Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/114.0":{"aborted":false,"count":151,"cycles":4,"hz":1870.4297635448743,"stats":{"moe":0.000007370701896541627,"rme":1.3786380205508113,"sem":0.000003760562192113075,"deviation":0.0000298485370503693,"mean":0.0005346364880896575,"variance":8.909351640472689e-10,"numSamples":63},"times":{"cycle":0.08073010970153828,"elapsed":5.959,"period":0.0005346364880896575,"timeStamp":1686573414575}},"Mozilla/5.0 (X11; Linux x86_64; rv:153.0) Gecko/20100101 Firefox/153.0":{"aborted":false,"count":137,"cycles":7,"hz":1600.1286199204528,"stats":{"moe":0.000011356282047918937,"rme":1.8171511920763943,"sem":0.000005794021453019866,"deviation":0.00004412595275670722,"mean":0.0006249497618820873,"variance":1.947099706687158e-9,"numSamples":58},"times":{"cycle":0.08561811737784597,"elapsed":6.153,"period":0.0006249497618820873,"timeStamp":1785321797097}}}},{"name":"channelsToHex6 inlined","code":"for (let i = 0; i < colors; i++) {\n const rgb =\n rValToHex[randomChannels[i*3]] +\n valToHex[randomChannels[i*3 + 1]]+\n valToHex[randomChannels[i*3 + 2]];\n}","results":{"aborted":false,"count":138,"cycles":9,"hz":1763.3520453629556,"stats":{"moe":0.000004278162811627974,"rme":0.754390714427992,"sem":0.0000021827361283816193,"deviation":0.000017324930920121153,"mean":0.0005671017325381372,"variance":3.0015323138696993e-10,"numSamples":63},"times":{"cycle":0.07826003909026294,"elapsed":6.258,"period":0.0005671017325381372,"timeStamp":1785321803256}},"platforms":{"Mozilla/5.0 (X11; Linux x86_64; rv:153.0) Gecko/20100101 Firefox/153.0":{"aborted":false,"count":138,"cycles":9,"hz":1763.3520453629556,"stats":{"moe":0.000004278162811627974,"rme":0.754390714427992,"sem":0.0000021827361283816193,"deviation":0.000017324930920121153,"mean":0.0005671017325381372,"variance":3.0015323138696993e-10,"numSamples":63},"times":{"cycle":0.07826003909026294,"elapsed":6.258,"period":0.0005671017325381372,"timeStamp":1785321803256}}}}]}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment