Jump to content

Parsing json in IE is very slow. Why?

johnnyg24

By johnnyg24
in JavaScript

Recommended Posts

johnnyg24 Member

johnnyg24

Posted
Posted

IE is parsing json very slowly compared to FF, Chrome and Safari. The ajax request to our server is working just fine, our back end program building the json string is working just fine and calling the eval() function is working just fine, but when I go to build my tables, IE is very slow. I have included my code below. Can anyone take a look and let me know if I can do things differently to increase the performance in IE. I have tried using document.createElement, I also tried building a long string and inserting it into the DOM, but all methods in IE are very slow. Thanks in advance.Working Example

var tmpJvar json$("input:radio[name='view']").eq(0).attr('checked','checked')var d = new Date();var curr_year = d.getFullYear();$(".y1").html(curr_year)$(".y2").html(curr_year-1)$(".y3").html(curr_year-2)var theG = truevar tbl1 = document.getElementById("cb1").tBodies[0]var tbl2 = document.getElementById("cb2").tBodies[0]var tbl3 = document.getElementById("cb3").tBodies[0]var tbl11 = document.getElementById("cb11").tBodies[0]var tblALL = document.getElementById("allbooks").tBodies[0]$(document).ready(function(){var custno = $("#custid").val()$.ajax({		type: "POST",		async: true,		url:"http://www.estout.com/webwizard/wwiz.asp?",		data:"wwizmstr=W_BOOK_SALES&custno=" + custno,		success: function(data){			tmpJ = data.split("<html>")[1]			json = eval('(' + tmpJ + ')')			checkbuild("g")		}	});	})function checkbuild(t){	if( t == "g" ){		theG = true		$(".group").show()		$(".split").hide()	}else{		$(".group").hide()		$(".split").show()		theG = false	}	buildit()}function buildit(){	if( $(".split tbody tr").length == 0 || $(".group tbody tr").length == 0){	var jclen = json.CUSTS.length	for(i=0;i<jclen;i++){		var jcblen = json.CUSTS[i].BOOK.length		if(i==0){			var str = ''			str += json.CUSTS[i].RD + "+,"			if(json.CUSTS[i].RD2 != ""){				str += json.CUSTS[i].RD2 + "+,"			}			str += json.CUSTS[i].CITY + "+,"			str += json.CUSTS[i].STATE + "+ "			str += json.CUSTS[i].ZIP			$("#googleMaps").click(function(){				window.open('http://maps.google.com/maps?q=' + str + '','mywindow','width=auto,height=auto,fullscreen=yes,resizable=yes');			})						$("#who").html("Sample Book Analysis for "+json.CUSTS[i].NAME+"<br/>"+str.replace(/\+/g,""))		}				for(b=0;b<jcblen;b++){			if(!theG){				$("#allbooks").hide()				var c_type = json.CUSTS[i].BOOK[b].C				var tbl				switch (c_type)				{				case "1":				  tbl = tbl1				  $("#cb1").show()				  break;				case "2":				  tbl = tbl2				  $("#cb2").show()				  break;				case "3":				  tbl = tbl3				  $("#cb3").show()				  break;				case "11":				  tbl = tbl11				  $("#cb11").show()				  break;				default:				  tbl = tbl1				  $("#cb1").show()				}			}else{				var tbl = tblALL				$(".cb").hide()				$("#allbooks").show()			}								var row = tbl.insertRow(0)				cellCnt = 0								var cell = row.insertCell(cellCnt)				cell.innerHTML = Number(json.CUSTS[i].BOOK[b].NUM)				cellCnt++								var cell = row.insertCell(cellCnt)				cell.innerHTML = shrink(json.CUSTS[i].BOOK[b].NAME)				cellCnt++								var cell = row.insertCell(cellCnt)				cell.innerHTML = json.CUSTS[i].BOOK[b].QTY				cell.className = 'qty'				cellCnt++								var cell = row.insertCell(cellCnt)				if(json.CUSTS[i].BOOK[b].AD == "" || json.CUSTS[i].BOOK[b].AD == "?????"){					cell.innerHTML = " "				}else{					cell.innerHTML = json.CUSTS[i].BOOK[b].AD				}				cellCnt++								var cell = row.insertCell(cellCnt)				if(json.CUSTS[i].BOOK[b].DD == "" || json.CUSTS[i].BOOK[b].DD == "?????"){					cell.innerHTML = " "				}else{					cell.innerHTML = json.CUSTS[i].BOOK[b].DD				}				cellCnt++								var cell = row.insertCell(cellCnt)				cell.innerHTML = "$"+json.CUSTS[i].BOOK[b].YTD				cell.style.textAlign = "right"				cell.className = 'ytd'				cellCnt++								var cell = row.insertCell(cellCnt)				cell.innerHTML = "$"+json.CUSTS[i].BOOK[b].LY				cell.style.textAlign = "right"				cell.className = "ly"				cellCnt++								var cell = row.insertCell(cellCnt)				cell.innerHTML = "$"+json.CUSTS[i].BOOK[b].PRI				cell.style.textAlign = "right"				cell.className = "prior"				cellCnt++		}	}}		var tArray = new Array("qty","ytd","ly","prior")	var gtot = 0	for(tot=0;tot<tArray.length;tot++){		$(".cb").each(function(cb){			var t = 0			$(".cb:eq("+cb+") tbody tr td[class='"+tArray[tot]+"']").each(function(){				t += Number($(this).html().replace("$",""))			})			if(tArray[tot]!="qty"){				$(".cb:eq(" + cb + ") tfoot td[class='"+tArray[tot]+"']").html("$"+r(t))			}else{				$(".cb:eq(" + cb + ") tfoot td[class='"+tArray[tot]+"']").html(t)			}		})	}			summary()}function r(n){	n = Number(n)	n *= 100;	n = Math.round(n)	n /= 100;	n = n.toFixed(2)	return n}function shrink(e){	return e.substr(0,20)}function summary(){	if($("#sum").is(":checked")){		$(".cb tbody tr").hide()	}else{		$(".cb tbody tr").show()	}}

Link to comment
Share on other sites
jeffman w3schools Guru

jeffman

Posted
Posted

Once you have evaluated the responseText, the json object is a normal javascript object. Its origin no longer matters. More likely the slowdown results from the way IE adds new elements to the DOM.You can test this by (1) working with a duplicate of your file so that your original is left intact, (2) changing all your json references to ordinary strings, and (3) running the modified script. Be sure to add the same number of elements to the DOM that would be added if you were in fact using the json data.

Link to comment
Share on other sites
johnnyg24 Member

johnnyg24

Posted
  • Author
Posted

Great minds must think alike...I change all of that and realized it is indeed the way IE is adding to the DOM. I am going to try and get our back end program to return the tables pre-build. Hopefully this will increase performance. Thank you.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...