• Our software update is now concluded. You will need to reset your password to log in. In order to do this, you will have to click "Log in" in the top right corner and then "Forgot your password?".
  • Welcome to PokéCommunity! Register now and join one of the best fan communities on the 'net to talk Pokémon and more! We are not affiliated with The Pokémon Company or Nintendo.

that guy [TCTI v 8]

Status
Not open for further replies.

Akiba

[img]http://i.imgur.com/o3RYT4v.png[/img]
4,262
Posts
13
Years
  • 228382.

    228379

    I beat the internet, but it nearly killed my browser in the process.

    ...Actually, now I'm curious as to what exactly causes multiple spoiler tags to be so heavy on the ol' processing. Surely it could be done better.

    Did a little sniffing, and apparently PC's spoiler tags use this:
    Code:
    if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }

    Which looks like this when beautified (not that it's in any way beautiful):
    Code:
    if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') {
    	this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';
    	this.innerText = '';
    	this.value = 'Hide';
    }
    else {
    	this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none';
    	this.innerText = '';
    	this.value = 'Show';
    }

    Which translates roughly to:
    Code:
    when I am clicked:
    	grab my parent element's parent element
    	grab every single element underneath that parent
    	take the second one and throw everything else away
    	grab every single element underneath this element, most of which I just threw away
    	take the first one and throw everything else away
    	if it's hidden then:
    		grab my parent element's parent element
    		grab every single element underneath that parent
    		take the second one and throw everything else away
    		grab every single element underneath this element, most of which I just threw away
    		take the first one and throw everything else away
    		make it show its content
    		utterly pointless line
    		also make me say "Hide"
    	otherwise:
    		grab my parent element's parent element
    		grab every single element underneath that parent
    		take the second one and throw everything else away
    		grab every single element underneath this element, most of which I just threw away
    		take the first one and throw everything else away
    		make it hide its content
    		utterly pointless line
    		also make me say "Show"

    It aches me to say that my beloved PC runs code that is so terribly inefficient. It's obvious how broken it is just by seeing all those redundant steps.

    I took a look in the profiler:
    Spoiler:

    The DOM queries were taking longer and longer, until my processor couldn't even take them all in one cycle.
    Spoiler:

    Sure enough, the real bottleneck was all those queries piling up from the complexity of the operation, resulting in an ever increasing wait between opening each spoiler tag, as well as browser lag:
    Spoiler:


    This is like opening Pandora's Box.
     

    Pokestick good times.

    [i]cheeky[/i]
    7,521
    Posts
    15
    Years
  • 228383.



    Did a little sniffing, and apparently PC's spoiler tags use this:
    Code:
    if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }
    Which looks like this when beautified (not that it's in any way beautiful):
    Code:
    if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') {
        this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';
        this.innerText = '';
        this.value = 'Hide';
    }
    else {
        this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none';
        this.innerText = '';
        this.value = 'Show';
    }
    Which translates roughly to:
    Code:
    when I am clicked:
        grab my parent element's parent element
        grab every single element underneath that parent
        take the second one and throw everything else away
        grab every single element underneath this element, most of which I just threw away
        take the first one and throw everything else away
        if it's hidden then:
            grab my parent element's parent element
            grab every single element underneath that parent
            take the second one and throw everything else away
            grab every single element underneath this element, most of which I just threw away
            take the first one and throw everything else away
            make it show its content
            utterly pointless line
            also make me say "Hide"
        otherwise:
            grab my parent element's parent element
            grab every single element underneath that parent
            take the second one and throw everything else away
            grab every single element underneath this element, most of which I just threw away
            take the first one and throw everything else away
            make it hide its content
            utterly pointless line
            also make me say "Show"
    It aches me to say that my beloved PC runs code that is so terribly inefficient. It's obvious how broken it is just by seeing all those redundant steps.

    I took a look in the profiler:
    Spoiler:

    The DOM queries were taking longer and longer, until my processor couldn't even take them all in one cycle.
    Spoiler:

    Sure enough, the real bottleneck was all those queries piling up from the complexity of the operation, resulting in an ever increasing wait between opening each spoiler tag, as well as browser lag:
    Spoiler:


    This is like opening Pandora's Box.
    This is precisely what I hoped my query would incentivize. Thank you.
     

    Ivysaur

    Grass dinosaur extraordinaire
    21,082
    Posts
    17
    Years
  • I googled "Zbambabar" and one of the top results was a post by me in this very thread.

    I'm famous.

    228391
     
    Status
    Not open for further replies.
    Back
    Top