Re: Speed Up document.getElementById()?



On May 1, 12:34 am, vunet...@xxxxxxxxx wrote:
On Apr 30, 12:03 pm, Derek <derek.detwei...@xxxxxxxxx> wrote:





If you are dynamically creating the cell elements, you can create the
array at the same time you are creating the elements, instead of doing
them all at once using the "for loop" and document.getElementById.
Depending on how you are setting the ID's, it may be tricky at first,
but you should be able to do something along the lines of:

var arr = new Array(500);
var yourTableContainingCells =
document.getElementById("yourTablesID");

/*
* Automatically assign the reference when you dynamically create
the element as follows.
* Do this for each cell reference, whether it be inside a for loop
or in some other function
* you are currently using to construct your cells. Use "arr[x]"
anywhere after this code to
* point to the element having "cellx" as it's id. (ie. arr[4] is
equivalent to id="cell4")
*/
arr[thisElementsID] = document.createElement("div");
arr[thisElementsID].setAttribute("id", "cell" + thisElementsID);
yourTableContainingCells.insertBefore(arr[thisElementsID],null);

Hope this helps out! Let me know how things turn out.

On Apr 30, 11:39 am, vunet...@xxxxxxxxx wrote:

On Apr 30, 10:15 am, Derek <derek.detwei...@xxxxxxxxx> wrote:

Have you tried creating a javascript array of all of the cells as you
create (or after you create: depending if they're dynamically created
or not) the document elements? Then you can just reference the array's
mapped ID instead of IE finding the document element every time. I
don't know for sure if this would be faster, but it seems it would be.
(slightly longer start-up, but faster once everything is loaded)

For example, at the beginning:

var arr = new Array(500);
for (x in arr)
{
arr[x] = document.getElementById('cell' + x);

}

Then, throughout the rest of your document, simply use "arr[ID]" to
point to the document element you are wanting to manipulate.

On Apr 30, 9:36 am, vunet...@xxxxxxxxx wrote:

Hello,
My AJAX application paints data into about 500 cells with unique ID
every 10 seconds. I am using document.getElementById() to find the
right cell. However, I have noticed that document.getElementById() in
IE is freezing the browser for about 1 second unlike Firefox.
Can anyone suggest any speed improvements for painting data into a
large number of cells to speed up the process?

It is a significant improvement when updating cells' content but I
lose time when building this array. My cells are drawn dynamically.
So, until I draw the whole table, I cannot create a reference array.
However, when having this array, I repaint cell content much faster
(by 80%) than if using document.getElementById().
Thank you.
PS: any suggestions for speed improvements to create a reference
array? :)

This perfectly makes sense. However, my table is created differently,
as it is a much faster way (based on test cases) to draw big tables:

var arrTable = new Array();
arrTable.push("<table><tr><td>")
arrTable.push("qqq</td><td>")
arrTable.push("www</td><td>")
arrTable.push("</td></tr></table>")
document.getElementById("container").innerHTML=arrTable.join(' ');

which means I cannot get a reference until I draw the whole table,
unless I go back to DOM method of creating a table as you mentioned
above.- Hide quoted text -

- Show quoted text -

this code is pretty inefficient...

is there a reason why you couldn't just do
document.getElementById("container").innerHTML="<table><tr><td>qqq</
td><td>www</td><td>("</td></tr></table>";
this will give a huge performance gain by eliminating array
operations.

why don't you post more code so we can help optimise.

.



Relevant Pages

  • Re: HOW DO I CREATE A SERIES INVOLVING CELLS ACROSS ROWS?
    ... To simplify, here, we're using the array form, which will return the ... C18 to say E22. ... of cells you wish to reference: ... since copying will only revise the cell references of the array. ...
    (microsoft.public.excel.misc)
  • Re: Nearest point to the mouse cursor?
    ... current X or Y mouse position by the size of the cell give the cell's ... It is an array of arrays. ... and 1 were only used during the draw process to help ... > a nice big red block on the panel screen. ...
    (microsoft.public.dotnet.languages.vb)
  • Re: VB-101: Passing Arrays ByVal vs ByRef
    ... changed if an array is passed by Val. ... ' new reference ... As each function creates a new array object, ... 'secondArray' and 'secondArrayCopy'. ...
    (microsoft.public.dotnet.languages.vb)
  • Re: Need help with textboxes
    ... The JavaScript 1.5 Reference already states: ... All forms and their children are stored in an array ... use dot notation or object literals. ... No. Bracket property accessors allow their argument to be any string value. ...
    (comp.lang.javascript)
  • Re: Allowing a UDF to
    ... value or an array of values like. ... left cell of the array if the function is NOT array-entered. ... reference or a value for each argument and return an array when I hit ... Dim CurrentPmtdate As Date ...
    (microsoft.public.excel.programming)