Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #28283

Re: Best way to show create different elements dynamically

Show all headers | View raw

Il 07/05/2015 01:16 PM, Thomas 'PointedEars' Lahn ha scritto:
> danca wrote:

>>> It is recommended to use a consistent quoting style.
>>
>> And I don't get this, too. I'm using Thunderbird on Linux and the
>> quoting is automatic and seems to me just the same it was under
>> Windows... Can you be more specific?
>
> I mean your *code* style.  The first statement should be self-explanatory
> onec you read my correction.
>
> As for the second one: You are using <'> as string delimiter in one line and
> <"> in the next one.  That is inconsistent and should not happen.  One
> reason is that it makes code harder to maintain as it requires regular
> expressions for search and/or replace.
>
> I recommend to use <"> for delimiting string literals always unless there
> are valid reasons not to.  The reason for that is that the double-quote
> character is better visible with several fonts that the straight apostrophe.
> One valid reason for an exception is that the string value contains one or
> more <">; in that case using <'> as delimiter avoids the need for escaping
> the <">.  One example for that is generating HTML with document.write()
> (which is blocking, avoid this if possible) or “innerHTML”: I prefer the
> resulting markup with <"> as attribute delimiters, not least because I find
> straight apostrophes in attribute values more common than straight double-
> quote characters (although you need to guard against that in any case, and
> the typographically correct characters would not be the straight ones).

:-) what a misunderstanding. Ok, you are right. I have the habit to be a 
bit [ :-) ] sloppy about that. [offtopic&irrelevant] The main reason is 
the need to press 2 keys (on my keyboard) to obtain " and only one for 
'. So it seems it depends by my mood/hurry/sloppiness.

>
> Also, you should always guard against the possibility that the element
> object could not be created:
>
>    var aDiv = document.createElement("div");
>    if (aDiv)
>    {
>      aDiv.style.position = "fixed";
>    }
>

Just a curiosity: this has to do with feature testing or with the 
possibilty that the element can not be created for some other reasons?
In other words... are you aware of conditions that can reasonably cause 
createElement() to fail [if implemented]?

>>> <http://www.quirksmode.org/dom/innerhtml.html>
>>
>> Interesting. Anyway, I was not concerned by any means about performance.
>> And that page should be updated, it is really old stuff.
>
> There is a pseudo-link attached to each benchmark which you can run.  I have
> run the tests 5 times each in Chromium “43.0.2357.130 Built on Debian
> stretch/sid, running on Debian stretch/sid (64-bit)”.  The “innerHTML”
> approach to building tables is still the fastest one there.

Tried on Firefox 29 on Kernel 2.6.37.6 (Slackware 13.37/64) - best 
result on last option, concatenate array. And 180 msec vs 100 msec is 
the overall difference between fastest vs. slowest method.

>
> What surprises me is that the “innerHTML” approach that uses appending
> string concatenation –
>
> 	var string = '<table><tbody>';
> 	for (var i=0;i<50;i++)
> 	{
> 		string += '<tr>';
> 		for (var j=0;j<50;j++)
> 		{
> 			string += '<td>*</td>';
> 		}
> 		string += '</tr>';
> 	}
> 	string += '</tbody></table>';
> 	document.getElementById('writeroot').innerHTML = string;
>
> – is indeed faster than the one that uses Array.prototype.push() –
>
> 	var string = new Array();
> 	string.push('<table><tbody>');
> 	for (var i=0;i<50;i++)
> 	{
> 		string.push('<tr>');
> 		for (var j=0;j<50;j++)
> 		{
> 			string.push('<td>*</td>');
> 		}
> 		string.push('</tr>');
> 	}
> 	string.push('</tbody></table>');
> 	var writestring = string.join('');
> 	document.getElementById('writeroot').innerHTML = writestring;
>
> –, even though the latter method is a built-in, in that browser version.
> Perhaps this has to do with the shortness of the strings as I remember
> having read of a benchmark that showed that appending string concatenation
> gets less efficient the longer the strings are, while the reverse is true
> for Array.prototype.push().
>
> (Blame PPK for the tabs.)

[Reads OK in my newsreader] Indeed this can raise more than a eyebrow. 
This has probably to do with *how* the built-ins are... built in.
But if I can make a guess, this could be understandable. In a browser 
implementation at c-level we can imagine that the routines used to keep 
in sync the textual content of a document with its DOM counterpart are 
the ancient and more "core-level" ones (optimized and quite 
"straightforward") while the object management needs some more software 
levels. Just guessing.

>
>> BTW isn't innerHTML generally discouraged?
>
> *Apparently* not.
>
> Please get a *real* name.
>
For a human, ynnadrebyc can be understood as a childish way to protect 
my mail account from the spam, for a bot it can be puzzling [I hope].
[One sidenote: why the hell you insist on real names? Are you immune by 
spam?]

And thanks for your time.
Dan

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread

Thread

Best way to show create different elements dynamically JiiPee <no@notvalid.com> - 2015-07-05 01:02 +0100
  Re: Best way to show create different elements dynamically JiiPee <no@notvalid.com> - 2015-07-05 01:06 +0100
    Re: Best way to show create different elements dynamically Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-07-05 09:27 +0200
      Re: Best way to show create different elements dynamically JiiPee <no@notvalid.com> - 2015-07-05 10:04 +0100
    Re: Best way to show create different elements dynamically danca <cyberdanny@tiscalinet.it> - 2015-07-05 10:10 +0200
      Re: Best way to show create different elements dynamically Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-07-05 10:22 +0200
        Re: Best way to show create different elements dynamically danca <cyberdanny@tiscalinet.it> - 2015-07-05 11:43 +0200
          Re: Best way to show create different elements dynamically Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-07-05 13:16 +0200
            Re: Best way to show create different elements dynamically JiiPee <no@notvalid.com> - 2015-07-05 12:48 +0100
            Re: Best way to show create different elements dynamically danca <cyberdanny@tiscalinet.it> - 2015-07-05 14:47 +0200
              Re: Best way to show create different elements dynamically Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-07-05 16:03 +0200
                Re: Best way to show create different elements dynamically danca <cyberdanny@tiscalinet.it> - 2015-07-05 19:53 +0200
                Re: Best way to show create different elements dynamically Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-07-06 01:46 +0200
                Re: Best way to show create different elements dynamically "danca (Daniele Campagna)" <cyberdanny@tiscalinet.it> - 2015-07-06 07:29 +0200
        Re: Best way to show create different elements dynamically Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2015-07-05 13:17 +0200
    Re: Best way to show create different elements dynamically "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2015-07-05 10:38 +0200
      Re: Best way to show create different elements dynamically JiiPee <no@notvalid.com> - 2015-07-05 10:01 +0100
      Re: Best way to show create different elements dynamically JiiPee <no@notvalid.com> - 2015-07-05 10:11 +0100
        Re: Best way to show create different elements dynamically Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-07-05 11:17 +0200
        Re: Best way to show create different elements dynamically "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2015-07-05 11:26 +0200
          Re: Best way to show create different elements dynamically JiiPee <no@notvalid.com> - 2015-07-05 10:30 +0100
          Re: Best way to show create different elements dynamically JiiPee <no@notvalid.com> - 2015-07-05 10:33 +0100
            Re: Best way to show create different elements dynamically "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2015-07-05 12:29 +0200
              Re: Best way to show create different elements dynamically danca <cyberdanny@tiscalinet.it> - 2015-07-05 12:38 +0200
                Re: Best way to show create different elements dynamically "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2015-07-05 17:33 +0200
                Re: Best way to show create different elements dynamically danca <cyberdanny@tiscalinet.it> - 2015-07-05 18:55 +0200
                Re: Best way to show create different elements dynamically "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2015-07-05 19:44 +0200
                Re: Best way to show create different elements dynamically danca <cyberdanny@tiscalinet.it> - 2015-07-05 20:42 +0200
                Re: Best way to show create different elements dynamically "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2015-07-05 21:01 +0200
              Re: Best way to show create different elements dynamically JiiPee <no@notvalid.com> - 2015-07-05 13:00 +0100
                Re: Best way to show create different elements dynamically Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-07-05 16:13 +0200
                Re: Best way to show create different elements dynamically Tim Streater <timstreater@greenbee.net> - 2015-07-05 15:23 +0100
                Re: Best way to show create different elements dynamically JiiPee <no@notvalid.com> - 2015-07-05 15:57 +0100
  Re: Best way to show create different elements dynamically JiiPee <no@notvalid.com> - 2015-07-05 10:03 +0100

csiph-web