Timing starts when your algorithm starts, but make sure that it is after the page has loaded completely as all elements must be available (the browser spinner has stopped spinning).
Timing starts when your algorithm starts, but make sure that it is after the page has loaded completely (the browser spinner has stopped spinning).
Timing starts when your algorithm starts, but after the page has loaded completely as all elements must be available (the browser spinner has stopped spinning).
let t0 = performance.now(); doSomething() // <---- The function you're measuring time for let t1 = performance.now(); let totalTime = t1 - t0; ```javascript The medium and hard difficulty levels will have their execution time multiplied by `0.50` and `0.25` respectively. None the less, an execution time of less than 40 seconds is needed to qualify. So if the execution time on the medium difficulty was 41 seconds before the multiplier, it does not qualify. # Winner The winner will be determined by the shortest execution time for dynamic injection of these classes and where `document.getElementsByClassName('table-n-row-r-cell-c');` can still be executed against the browser console and return an element where `n`, `r`, and `c` are replaced with indexes. The medium and hard difficulty levels will have their execution time multiplied by 0.50 and 0.25 respectively. None the less, an execution time of less than 40 seconds is needed to qualify. So if the execution time on the medium difficulty was 41 seconds before the multiplier, it does not qualify.
Winner
The winner will be determined by the shortest execution time for dynamic injection of these classes and where document.getElementsByClassName('table-n-row-r-cell-c'); can still be executed against the browser console and return an element where n, r, and c are replaced with indexes.
let t0 = performance.now(); doSomething() // <---- The function you're measuring time for let t1 = performance.now(); let totalTime = t1 - t0; ```javascript The medium and hard difficulty levels will have their execution time multiplied by `0.50` and `0.25` respectively. None the less, an execution time of less than 40 seconds is needed to qualify. So if the execution time on the medium difficulty was 41 seconds before the multiplier, it does not qualify. # Winner The winner will be determined by the shortest execution time for dynamic injection of these classes and where `document.getElementsByClassName('table-n-row-r-cell-c');` can still be executed against the browser console and return an element where `n`, `r`, and `c` are replaced with indexes. let t0 = performance.now(); doSomething() // <---- The function you're measuring time for let t1 = performance.now(); let totalTime = t1 - t0; The medium and hard difficulty levels will have their execution time multiplied by 0.50 and 0.25 respectively. None the less, an execution time of less than 40 seconds is needed to qualify. So if the execution time on the medium difficulty was 41 seconds before the multiplier, it does not qualify.
Winner
The winner will be determined by the shortest execution time for dynamic injection of these classes and where document.getElementsByClassName('table-n-row-r-cell-c'); can still be executed against the browser console and return an element where n, r, and c are replaced with indexes.
Crazy Blazin' DOM Injection
I was instructed to post this code golf challenge here for recommendations on how to modify the challenge.
I'd like to tag it.
fastest-code grid and browser , but I don't know how to do that here.
Code golf challenge listed below.
Introduction
This problem is a challenge that has to do with DOM manipulation at scale and overcoming some issues that may be inherent in dealing with the DOM.
- This challenge is interesting because limitations push us to think through things differently and lean on the strengths of languages different than what we usually use.
- I created this challenge myself based on a real world problem I ran into myself (details can be provided if needed). If this challenge has any relation to a differently know problem, those similarities are coincidental.
This challenge will be scored based on fastest execution and fastest algorithm. A multiplier will be given for completing the challege at easy, medium, and hard difficulties.
Challenge
You must render one of the challenge levels in a web browser:
Through any means available to you interacting through a web browser in code you need to complete the following:
- Get each table displayed and add a class
table-nto each table wherenis a zero based index of order of the table on the screen. If a table is nested within a table the parent would be N and the child would be N+1 with the next table being N+2. - Get each row displayed in each table and add a class of
table-n-row-rwhereris a zero based index of rows in the table represented bytable-n. - Get each cell displayed in each table and add a class of
table-n-row-r-cell-cwherecis a zero based index of cells in a row represented bytable-n-row-r.
At the end of the challenge the web page should still be able to be interacted through in the browser, and a call to document.getElementsByClassName('table-n-row-r-cell-c'); should return one and only one cell from the DOM.
Any method available to you as valid as long as:
- Access to one of the difficulty levels has been done through a web browser
- The URL of the browser and the page displayed doesn't change
- A call to
document.getElementsByClassName('table-n-row-r-cell-c');returns only one element
Output Examples
For this example we're using the easy level as input.
The abbreviated output in the DOM should be.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Code Golf Challenge</title> </head> <body> <table class="table-0"> <thead> <tr class="table-0-row-0"> <th class="table-0-row-0-cell-0">1</th> ... </tr> </thead> <tbody> <tr class="table-0-row-1"> <td class="table-0-row-1-cell-0">11</td> <td class="table-0-row-1-cell-1">12</td> ... </tr> ... </table> </body> </html> There are only <td> and <th> elements used as cell elements for the challenge.
As long as document.getElementsByClassName('table-n-row-r-cell-c'); returns an element with this class. We're good to go.
Qualifying Entries
All entries that qualify need to have an execution speed of under 40 seconds for any difficulty level.
Timing starts when your algorithm starts, but make sure that it is after the page has loaded completely (the browser spinner has stopped spinning).
Calculate the runtime for your method by calling performance.now() before and and after your injection method, and subtracting the first from the second as in the example below.
let t0 = performance.now(); doSomething() // <---- The function you're measuring time for let t1 = performance.now(); let totalTime = t1 - t0; ```javascript The medium and hard difficulty levels will have their execution time multiplied by `0.50` and `0.25` respectively. None the less, an execution time of less than 40 seconds is needed to qualify. So if the execution time on the medium difficulty was 41 seconds before the multiplier, it does not qualify. # Winner The winner will be determined by the shortest execution time for dynamic injection of these classes and where `document.getElementsByClassName('table-n-row-r-cell-c');` can still be executed against the browser console and return an element where `n`, `r`, and `c` are replaced with indexes.