homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

Interesting find: myfunction('value') vs myfunction(this.myval)
page rendering slows considerably

10+ Year Member

Msg#: 3633257 posted 3:05 pm on Apr 23, 2008 (gmt 0)

I develop Intranet apps with IE as the supported browser, so how other browsers are effected are unknown.

I had an app that displays 1000+ lines on a single page and each line had an inline function "myfunction('valueID')" and would render to the page much slower than the actual querry would take to return the data. At first we thought there was just a lot of data and it just took time to render.
Example 1: <img src="img.gif" onclick="myfunction('456-12')">

Recently we found that if we put the "valueID" in an attribute and referenced it through this.attrName it display much faster.

Example 2: <img src="img.gif" onclick="myfunction(this.valueID)" valueID="456-12">

Further testing revealed that if the variable remained constant in the functions it was also very fast, but when they were all unique it slowed down again.

We concluded: (atleast in IE) The browser has to allocate memory for the variables in the functions as it tries to display the page, but not for the attributes.



WebmasterWorld Administrator httpwebwitch us a WebmasterWorld Top Contributor of All Time 10+ Year Member

Msg#: 3633257 posted 7:35 pm on Apr 23, 2008 (gmt 0)

So is this yet another reason for embracing Unobtrusive Javascript.

Putting data in an attribute is faster than putting it in a function... I would have guessed it'd be the other way around. This is directly applicable to something I am building right now.

thanks for sharing this XtendScott.


WebmasterWorld Senior Member 5+ Year Member

Msg#: 3633257 posted 5:13 am on Apr 24, 2008 (gmt 0)

with example 1 1000+ anon functions will be created of the form
function () { myfunction('456-12') } and these functions assigned one to one to the onclicks.

with example 2 ( or constant ID ) assumable only one anon function is created and assigned to all onclicks


10+ Year Member

Msg#: 3633257 posted 2:52 pm on Apr 24, 2008 (gmt 0)

one of the pages with "ALL" results, returned over 5000 records. This page went from a nearly 2 minute query-load-display time down to a 25-30 second time to display.

I just could NOT have imagined that it would have made such a significant difference.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved