Why is this so slow...is it DOM?

[divinyl]

Hi

I support a web application in my company built by our dev team. Recently a client complained that when loading a particular web page was taking a very long time, with CPU usage at 100%. It's only hppening with their particular database. I am trying to debug the code and figure out where the problem lies...

I'm not a developer so please bear with me. Basically, the web app is using xml, xml dom and javascript - a user will do a particular search and the data in the database will be transformed into xml, and then the xml data gets loaded into/parsed by dom and returned to the browser. Or something like that. Now, the actual xml data we are dealing with is not large in actual data terms (it returns about 700 rows) - but perhaps this is considered big in DOM terms? I know the database is not the bottleneck because the actual query taking place takes a second to return in SQL query analyzer...
I wonder if it's the actual xquery portion of the code that is just not efficient. I'm going to paste the javascript code below and hope that someone can perhaps give me an idea of where the problem lies or at least some advice on where to look:

function FillCustomTable()
{

	// Read the XML 
	var rootNode = document.all("xmlTmData").XMLDocument;
	var oNodeList;
	
	oNodeList = rootNode.selectNodes("TMDATA/ROWSET_DATA[@Name='CUSTOMVALUES']/ROW");

	var oElement	= null;

	var oID			= null;
	var oLabel		= null;
	var oType		= null;
	var oValue		= null;

	var szID		= "";
	var szValue		= "";
	var szType		= "";
	var szSpanStart	= "<SPAN>";
	var szSpanEnd	= "</SPAN>";
	
	var row			= null;
	var cell		= null;
	
	if (oNodeList.length == 0)
	{
		tableCustom.style.display = "none";
		return;
	}
	
	
	var i = 0;
	for (i = 0; i < oNodeList.length; i++)
	{
		oID			= null;
		oLabel		= null;
		oType		= null;
		oValue		= null;
		
		szID		= "";
		szValue		= "";
		szType		= "";

		szSpanStart	= "<SPAN>";
				
		oElement = oNodeList.item(i);

		oID			= oElement.selectSingleNode("TM_CUSTOM_VALUE.ID");
		oLabel		= oElement.selectSingleNode("TM_CUSTOM_FIELD.FIELDLABEL");
		oType		= oElement.selectSingleNode("TM_CUSTOM_FIELD.DBTYPE");


		szType = oType.text;
		
		if (szType == "1")	// TEXT
			oValue	= oElement.selectSingleNode("TM_CUSTOM_VALUE.VALUETEXT");
		else if (szType == "4")	// MEMO
			oValue	= oElement.selectSingleNode("TM_CUSTOM_VALUE.VALUEMEMO");
		else if (szType == "3" || szType == "11")	// DATEs
			oValue	= oElement.selectSingleNode("TM_CUSTOM_VALUE.VALUEDATE");
		else if (szType == "2" || szType == "5" || szType == "6" || szType == "7" || szType == "8" || szType == "9") // ints and bool
			oValue	= oElement.selectSingleNode("TM_CUSTOM_VALUE.VALUEINT");

		szValue		= oValue.text;


		szID = oID.text;
		
		// create a span with the custom values id in it - (so it's unique)
		// and so we can refer to it directly if user wants to edit it.
		szSpanStart = "<SPAN id='custom_" + szID + "'>";


		// if we're looking at a YesNo field, convert 1->Yes, 0->No
		if (szType == "5")
		{
			if (szValue == "1")
				szValue = g_sBooleanPulldown_Yes;
			else if (szValue == "0")
				szValue = g_sBooleanPulldown_No;
		}


		row = tableCustom.insertRow();
		if (row != null)
		{
			cell = row.insertCell();
			if (cell != null)
			{
				cell.innerHTML = oLabel.text == "" ? "&nbsp;" : oLabel.text;
				cell.className = "classRowTitle";
			}

			cell = row.insertCell();
			if (cell != null)
			{
				if (szType == "4")		// memo field - handle with care
				{
					var szDivID		= "custom_" + szID;
					var szEditLink	= "<A CLASS='EditLink'  TITLE='" + g_sEditLink_Tooltip + "' onclick=\"JavaScript:OnEditText('" + szDivID + "', 'TM_CUSTOM_VALUE', 'VALUEMEMO', 'ID', '', '" + szID + "')\">[" + g_sEditLink + "]</A><BR>";
					var szDivStart	= "<DIV id='" + szDivID + "'>";
					var szDivEnd	= "</DIV>";
					var szUseText	= szValue == "" ? "<I>" + g_sNoDataProvided + "</I>" : szValue;
					
					cell.innerHTML = szEditLink + szDivStart + szValue + szDivEnd;
					cell.className = "classRowData";
				}
				else
				{			
					cell.innerHTML = szSpanStart + szValue + szSpanEnd;
					cell.className = "classRowData";
				}
			}
		}
	}
	
	return;

I've been debugging this app in Visual Studio.net and have put stepped through this entire function - the only time it hangs is when i put the break point on the actual return statement right at the end.

Anyway....anyone have any ideas???

Thanks!
Divinyl

 

[chiph]

Depending on how many values are in the NodeList, you could loop over the parts with SelectSingleNode calls many times. This method, in most implementations of XPath, just does a linear search (start at the top and go down). You've got seven of them.

You could probably speed things up by only doing one SelectSingleNode, and then locating the other nodes via relative paths, using the parentNode and childNodes properties as needed.

Chip H.


____________________________________________________________________
If you want to get the best response to a question, please read FAQ222-2244 first