{"id":22120229,"url":"https://github.com/joshbrew/js_speed_tests","last_synced_at":"2026-01-05T15:06:41.651Z","repository":{"id":133634729,"uuid":"485555476","full_name":"joshbrew/js_speed_tests","owner":"joshbrew","description":"Just an html file to toy with js function execution times. Open in browser to run.","archived":false,"fork":false,"pushed_at":"2022-06-18T21:18:23.000Z","size":393,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-29T12:15:10.647Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/joshbrew.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-04-25T22:34:58.000Z","updated_at":"2022-04-25T22:35:54.000Z","dependencies_parsed_at":null,"dependency_job_id":"4820c956-0a84-476c-ba90-239c512600d5","html_url":"https://github.com/joshbrew/js_speed_tests","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joshbrew%2Fjs_speed_tests","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joshbrew%2Fjs_speed_tests/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joshbrew%2Fjs_speed_tests/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joshbrew%2Fjs_speed_tests/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/joshbrew","download_url":"https://codeload.github.com/joshbrew/js_speed_tests/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245220167,"owners_count":20579715,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-12-01T14:21:35.118Z","updated_at":"2026-01-05T15:06:41.627Z","avatar_url":"https://github.com/joshbrew.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# js_speed_tests\nJust an html file to toy with js function execution times. Open in browser to run.\n\n\u003cimg src=\"testcapture.PNG\" alt=\"cao\" width=\"500\"/\u003e\n\nRaw:\n```html\n\u003c!DOCTYPE html\u003e\n\u003chtml\u003e\n    \u003chead\u003e\u003c/head\u003e\n    \u003cbody style='background-color: black; color:white;'\u003e\n        \u003ch4\u003eJS function test page\u003c/h4\u003e\n        \u003cdiv id=\"info\"\u003en Tests per function: \u003cinput id=\"ntests\" type=\"number\" value=\"100000\"\u003e\u003cbutton id=\"run\"\u003eRun\u003c/button\u003e\u003c/div\u003e\n        \u003cbr\u003e\n        \u003cdiv id=\"msg\"\u003eAwaiting results, view console for progress... Keep this window prioritized, this could take a minute...\u003c/div\u003e\n        \u003cbr\u003e\n        \u003ctable id=\"results\" style=\"text-align:right; font-family:'Courier New', Courier, monospace;\"\u003e\n\n        \u003c/table\u003e\n        \u003cscript\u003e\n\n            let running = false; //prevent spamming the run button\n\n            const speed_I_am_speed = () =\u003e {\n\n                let testResults = {};\n                let now;\n                let title;\n                let delayExec = 100; //delay executions between functions (to keep page semi responsive)\n       \n                running = true;\n                //let html load before we lock up\n                setTimeout(async ()=\u003e{\n\n                let n = document.getElementById('ntests').value; //try different scales, performance scales differently e.g. for promises\n\n                let delay = async function(delay=delayExec) {\n                    return await new Promise((resolve)=\u003e{\n                        setTimeout(()=\u003e{resolve();},delay);\n                    })\n                }\n\n                document.getElementById('msg').innerHTML = 'Awaiting results, view console for progress... Keep this window prioritized, this could take a minute...';\n\n                function speedTest(title='test',fn=()=\u003e{},t=n) { //wraps a function in a for loop\n                    console.time(title);\n                    let now = performance.now();\n                    for(let i = 0; i \u003c t; i++) {\n                        fn();\n                    }\n                    console.timeEnd(title);\n                    return performance.now() - now;\n                }\n\n                await delay(1000); //make sure the html update doesn't impact the speed test\n\n                \n                title = `empty for loop`\n                now = performance.now();\n                console.time(title);\n                for(let i = 0; i \u003c n; i++) {\n\n                }\n                console.timeEnd(title);\n                testResults[title] = performance.now() - now;\n\n                await delay(delayExec);\n\n                title = `while loop incr`\n                now = performance.now();\n                console.time(title);\n                let i = 0;\n                while(i \u003c n) {\n                    ++i;\n                }\n                console.timeEnd(title);\n                testResults[title] = performance.now() - now;\n\n                await delay();\n\n\n\n                title = `execute empty anonymous function`\n                testResults[title] = speedTest(title,function(){},n);\n\n                await delay();\n\n                title = `execute empty arrow function`\n                testResults[title] = speedTest(title,()=\u003e{},n);\n\n                await delay();\n\n                title = `execute empty arrow function with 3 default arguments`\n                testResults[title] = speedTest(title,(a=1,b=2,c=3)=\u003e{},n);\n\n                await delay();\n\n                \n                title = `add two function arguments`;\n                testResults[title] = speedTest(title,function(a=1,b=2){return x = a + b;},n);\n\n                await delay();\n\n\n                title = `pass object by reference`;\n                let ref = {};\n                testResults[title] = speedTest(title,function(refin=ref){let x = refin; return x;},n);\n\n                await delay();\n\n                title = `add`;\n                testResults[title] = speedTest(title,function(){return x = 2 + 2;},n)\n\n                await delay();\n\n                title = `multiply`;\n                testResults[title] = speedTest(title,function(){return x = 2 * 2;},n)\n\n                await delay();\n\n                title = `divide`;\n                testResults[title] = speedTest(title,function(){return x = 4 / 2;},n);\n\n                await delay();\n\n\n                title = `async await new promise`;\n                testResults[title] = speedTest(\n                    title,\n                    async function(){\n                    return await new Promise(function(resolve, reject){\n                        resolve(0);\n                    })\n                },n);\n\n                await delay();\n\n                title = `empty async function`;\n                testResults[title] = speedTest(\n                    title,\n                    async function(){},\n                    n\n                );\n\n                await delay();\n\n                title = `create object with 1 key:value pair`;\n                testResults[title] = speedTest(\n                    title,\n                    function(){\n                        return {x:1};\n                    }\n                )\n\n                await delay();\n\n                \n                title = `create array with 1 value`;\n                testResults[title] = speedTest(\n                    title,\n                    function(){\n                        return [1];\n                    }\n                )\n\n                await delay();\n\n\n                title = `create array with 100 elements and .fill(0)`;\n                testResults[title] = speedTest(title, function(){ let j = new Array(100).fill(0);})\n\n                await delay();\n\n                title = `create array and recursively push 100 elements`;\n                testResults[title] = speedTest(title, function() {\n                    \n                    let o = [];\n                    for(let j = 0; j \u003c 100; j++) {\n                        o.push(j);\n                    }\n                    \n                })\n\n                await delay();\n\n                title = `create object and recursively set 100 elements`;\n                testResults[title] = speedTest(title, function() {\n                    let o = {};\n                    for(let j = 0; j \u003c 100; j++) {\n                        o[j] = j;\n                    }\n                })\n\n                await delay();\n\n                \n                // title = `create canvas element, set size, getContext, fillRect`;\n                // testResults[title] = speedTest(\n                //     title,\n                //     function(){\n                //         let c = document.createElement('canvas');\n                //         let ctx = c.getContext('2d');\n\n                //         c.height = document.body.clientHeight;\n                //         c.width = document.body.clientWidth;\n\n                //         ctx.fillStyle = 'red';\n                //         ctx.fillRect(0,0,c.height,c.width);\n\n                //         ctx = null;\n                //         c = null;\n\n                //     }\n                // )\n\n                // await delay();\n\n                \n                // title = `create *offscreen* canvas element, set size, getContext, fillRect`;\n                // testResults[title] = speedTest(\n                //     title,\n                //     function(){\n                    \n                //         let c = new OffscreenCanvas(document.body.clientWidth,document.body.clientHeight);\n                //         let ctx = c.getContext('2d');\n\n                //         ctx.fillStyle = 'red';\n                //         ctx.fillRect(0,0,c.height,c.width);\n\n                //         ctx = null;\n                //         c = null;\n                //     }\n                // )\n\n                // await delay();\n\n                //PRINT RESULTS\n\n                document.getElementById('msg').innerHTML = 'Results will vary widely with current browser load/prioritization + number of tests, Average ~10 tests minimum with different (larger) n:';\n                let resultsElm = document.getElementById('results');\n                \n                resultsElm.insertAdjacentHTML('beforeend',`\u003ctr\u003e\u003cth style='font-size:16px; font-weight:bold;'\u003eProcess:\u003c/th\u003e\u003cth style='font-size:14px;'\u003eTime (n = ${n})\u003c/th\u003e\u003c/tr\u003e`);\n                \n                for(const prop in testResults) {\n                    let color = 'green';\n                    if(testResults[prop] \u003e n*0.0001) color = 'gold';\n                    if(testResults[prop] \u003e n*0.003) color = 'red';\n                    resultsElm.insertAdjacentHTML('beforeend',`\u003ctr\u003e\u003ctd style='font-size:14px; font-weight:bold;'\u003e${prop}:\u003c/td\u003e\u003ctd style='font-size:14px; color:${color};'\u003e${testResults[prop].toFixed(3)} ms\u003c/td\u003e\u003c/tr\u003e`);\n                }\n                \n                running = false;\n\n                },100);\n            }\n\n            speed_I_am_speed();\n\n            document.getElementById('run').onclick = () =\u003e {\n                if(!running) speed_I_am_speed();\n            }\n\n        \u003c/script\u003e\n    \u003c/body\u003e\n\u003c/html\u003e\n\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjoshbrew%2Fjs_speed_tests","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjoshbrew%2Fjs_speed_tests","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjoshbrew%2Fjs_speed_tests/lists"}