• 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