Closed Bug 446049 Opened 16 years ago Closed 3 years ago

CPU USAGE GOES VERY HIGH when moving HTML DOM Elements using JavaScript and DOM

Categories

(Core :: DOM: Core & HTML, defect, P5)

x86
Windows XP
defect

Tracking

()

RESOLVED INCOMPLETE

People

(Reporter: deep.abstractions, Unassigned)

References

()

Details

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; pt-BR; rv:1.9.0.1) Gecko/2008070208 Firefox/3.0.1
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; pt-BR; rv:1.9.0.1) Gecko/2008070208 Firefox/3.0.1

I'm building a JavaScript Lib, that has full compatibility with more than ten web browsers. It has a prototype class, DOM, that turns easier and shorter the DOM Elements control, by JavaScript coding.

The code runs very well in WebKit based and in Opera Browser. CPU stays very low... under 4%. Testing on Firefox... the CPU goes hight(100% and 50%+ for kernel).

On http://jsleaf.webs.com/ I'm using a switch, inside a loop. The switch tests if a key is pressed (use S,E,D and F) and changes DOM background and position of the DIV element.

I'm not sure if the problem is only because of the repositioning or gif rendering. But a test with one and other showed me that they together make Firefox abuse of kernel and CPU, while WebKit and some others stays under 8%, in a Pentium 4 2.6 with 1GB RAM.

Reproducible: Always

Steps to Reproduce:
1.use the given function (see additional information)
2.Test changing background gifs (build a function or take a look on http://jsleaf.webs.com ... and use S,E,D and F keys)

Obs: the code does not cause the problem... or WebKit, Opera and others would present the same.
Actual Results:  
CPU and Kernel "peggs".

Expected Results:  
Optimized CPU usage.

Similar bug:27042 https://bugzilla.mozilla.org/show_bug.cgi?id=427042


Used JavaScript code:


[leaf.DOM instance].setBackground: function (color, src, x, y, repeat)
{
	var $ = this.core.style;
	if (isString(color)) { $.backgroundColor = color; }
	if (isString(src))   { $.backgroundImage = 'url(\"' + src + '\")'; }
	
	x = forceUnit(x)||'50%';
	y = forceUnit(y)||'50%';
	
	$.backgroundPosition = x +' '+ y;
	$.backgroundRepeat = repeat? repeat:'no-repeat';
}



[leaf.DOM instance].modPosition: function (x, y, z)
{
	var $ = this.getPosition();
	this.setPosition(
		x? x +forceFloat($.x)+extUnit($.x):null,
		y? y +forceFloat($.y)+extUnit($.x):null,
		z? z +$.z:null
	);
}


[leaf.DOM instance].setPosition: function (x, y, z, type)
{
	var $ = this.core.style;
	$.position = type||$.position||'absolute';
	
	if (hasValue(x)) {
		x = forceUnit(x);
		if ($.right) {
			$.left  = '';
			$.right = x;
		}
		else {
			$.left  = x;
			$.right = '';
		}
	}
	if (hasValue(y)) {
		y = forceUnit(y);
		if ($.bottom) {
			$.top = '';
			$.bottom = y;
		}
		else {
			$.top = y;
			$.bottom = '';
		}
	}
	if (hasValue(z)) {
		$.zIndex = z;
	}
}


This code is part of Leaf JavaScript Library and is protected by licenses.
No other use, distribuition or any similar is, yet, allowed.


Sorry for the poor text, my English is too bad and I'm on a rush.
But, please, test all the concept by yourself too.
Over to Core::Dom for triage.
Component: Build Config → DOM
Product: Firefox → Core
QA Contact: build.config → general
comment 1 appears to never have been triaged

note, reporter's email address is dead.
https://bugzilla.mozilla.org/show_bug.cgi?id=1472046

Move all DOM bugs that haven’t been updated in more than 3 years and has no one currently assigned to P5.

If you have questions, please contact :mdaly.
Priority: -- → P5
Component: DOM → DOM: Core & HTML

Hi wayne
I'm trying to reproduce old bugs to see if I can solve any. The original reporter account is down and the link is also down,
do you think we should close the bug as incomplete?
Thanks!

Flags: needinfo?(vseerror)

Yeah, without clear STR and no one to reproduce => incomplete

Status: UNCONFIRMED → RESOLVED
Closed: 3 years ago
Flags: needinfo?(vseerror)
Resolution: --- → INCOMPLETE
You need to log in before you can comment on or make changes to this bug.