Closed
Bug 470532
Opened 17 years ago
Closed 12 years ago
Slow Performance of JS in Firefox 3 when compared to FF2
Categories
(Core :: DOM: Core & HTML, defect)
Tracking
()
RESOLVED
WORKSFORME
People
(Reporter: jayakrishnan, Unassigned)
Details
(Keywords: perf, regression)
Attachments
(1 file)
|
5.34 KB,
text/html
|
Details |
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.0.5) Gecko/2008120122 Firefox/3.0.5
Build Identifier: Firefox 3.0.5
Is there anyone who has experienced slow performance of js execution or sluggishness in user experience in Firefox 3?
In my app, all the scripts written in onmousemove and onmouseover events are working slowly? Happens when offsetLeft and offsetTop calculations are done! But, the same worked in a jiffy in Firefox 2?
Reproducible: Always
Steps to Reproduce:
Pls test this html in both FF3 and FF2... u can feel the sluggishness of grid selection in FF3
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style>
table {
border-left: 1px solid #CCC;
border-top: 1px solid #CCC;
-moz-user-select: none;
}
td {
border-right: 1px solid #CCC;
border-bottom: 1px solid #CCC;
}
#focusDiv {
position: absolute;
background: #81A7D1;
opacity: 0.3;
z-index: 2;
}
</style>
<script>
/* Author: Peter-Paul Koch, Available for download at: http://www.quirksmode.org/js/findpos.html */
function findPosX(obj) {
var curleft = 0;
if (document.getElementById || document.all) {
try {
while (obj.offsetParent) {
curleft += obj.offsetLeft;
obj = obj.offsetParent;
}
} catch (e) {
return curleft;
}
}
else if (document.layers) {
curleft += obj.x;
}
return curleft;
}
// ---------------------------------------
/**
* Retruns the x position of the given object in the window / screen.
*/
/* Author: Peter-Paul Koch, Available for download at: http://www.quirksmode.org/js/findpos.html */
function findPosY(obj) {
var curtop = 0;
if (document.getElementById || document.all) {
try {
while (obj.offsetParent) {
curtop += obj.offsetTop;
obj = obj.offsetParent;
}
} catch (e) {
return curtop;
}
}
else if (document.layers) {
curtop += obj.y;
}
return curtop;
}
function getCursorPos(ev) {
var x = ev.pageX;
var y = ev.pageY;
return {x : x, y : y};
}
</script>
</head>
<body onLoad="renderGrid();">
</body>
</html>
<script>
var grid, gridLeft, gridTop, focusDiv;
function renderGrid() {
var gridStr = "<table id='grid' border='0' cellspacing='0' cellpadding='0' width='100%' onmousedown='startFocus(event)'>";
for (var i = 0; i < 20; i++) {
gridStr += "<tr>";
for (var j = 0; j < 20; j++) {
gridStr += "<td> </td>";
}
gridStr += "</tr>";
}
gridStr += "</table>";
document.body.innerHTML = "<h3>Drag over the grid using your mouse!</h3>" + gridStr + "<div id='focusDiv' style='display:none;width:0px;height:0px;' onmousedown='clearFocus();'></div>";
grid = document.getElementById("grid");
gridLeft = findPosX(grid);
gridTop = findPosY(grid);
focusDiv = document.getElementById("focusDiv");
}
function getCell(row, col) {
if (grid.rows[row].cells[col] != null) return grid.rows[row].cells[col];
}
var selRow, selCol;
function startFocus(ev) {
var cell = ev.target;
selRow = cell.parentNode.rowIndex;
selCol = cell.cellIndex;
focusDiv.style.left = findPosX(cell) + "px";
focusDiv.style.top = findPosY(cell) + "px";
focusDiv.style.width = cell.offsetWidth + "px";
focusDiv.style.height = cell.offsetHeight + "px";
focusDiv.style.display = "";
document.addEventListener("mousemove", doFocus, false);
document.addEventListener("mouseup", endFocus, false);
}
function doFocus(ev) {
var el = ev.target;
var cursorPos = getCursorPos(ev);
var x = cursorPos.x - gridLeft;
var y = cursorPos.y - gridTop;
var width = parseInt(focusDiv.style.width);
var height = parseInt(focusDiv.style.height);
var prevColCell = getCell(selRow, selCol - 1);
var prevRowCell = getCell(selRow - 1, selCol);
var currCell = getCell(selRow, selCol);
var nextColCell = getCell(selRow, selCol + 1);
var nextRowCell = getCell(selRow + 1, selCol);
if (x > nextColCell.offsetLeft) {
focusDiv.style.width = (width + nextColCell.offsetWidth) + "px";
selCol++;
} else if (x < prevColCell.offsetLeft + prevColCell.offsetWidth) {
focusDiv.style.width = (width - currCell.offsetWidth) + "px";
selCol--;
}
if (y > nextRowCell.offsetTop) {
focusDiv.style.height = (height + nextRowCell.offsetHeight) + "px";
selRow++;
} else if (y < prevRowCell.offsetTop + prevRowCell.offsetHeight) {
focusDiv.style.height = (height - currCell.offsetHeight) + "px";
selRow--;
}
}
function endFocus() {
document.removeEventListener("mousemove", doFocus, false);
document.removeEventListener("mouseup", endFocus, false);
}
function clearFocus() {
focusDiv.style.display = "none";
focusDiv.style.width = focusDiv.style.height = "0px";
}
</script>
Actual Results:
Sluggish performance of grid selection
Expected Results:
Similar to that of Firefox 2
|
||
Comment 1•17 years ago
|
||
not a bugzilla issue.
Assignee: general → nobody
Component: Bugzilla-General → General
Product: Bugzilla → Firefox
QA Contact: default-qa → general
|
Reporter | |
Comment 2•17 years ago
|
||
I've posted this issue in forums.mozillazine.org
They've advised me to post the same here
|
||
Comment 3•17 years ago
|
||
Can you upload a testcase to https://bugzilla.mozilla.org/attachment.cgi?bugid=470532&action=enter
|
|
Reporter | |
Comment 4•17 years ago
|
||
Pls test the attached html in both FF3 and FF2... u can feel the sluggishness of grid selection in FF3
|
|
||
Comment 5•17 years ago
|
||
Do you mean "select header and draw circles with it over the grid"? In that case I can experience indeed a performance regression. It uses twice as much CPU. But just drawing circles hovering over the grid makes no difference here.
|
|
Reporter | |
Comment 6•17 years ago
|
||
Ria Klassen,
Yeah you are right, just click-n-drag over the grid... similar to cell range selection you do in MS Excel
I hope you can find the difference in performance
|
|
||
Comment 7•17 years ago
|
||
This could be caused by Bug 374593. In that case I wouldn't know what could be done about it.
Blocks: 374593
Status: UNCONFIRMED → NEW
Component: General → Drag and Drop
Ever confirmed: true
Keywords: perf,
regression
Product: Firefox → Core
QA Contact: general → drag-drop
Version: unspecified → Trunk
|
||
Comment 8•17 years ago
|
||
Ria, why do you think this could be caused by bug 374593? Did you find a regression range that indicated that? I ask this, because this kind of click-n-drag doesn't necessarily have to be related to the os level drag and drop, which bug 374593 was involved with.
|
|
||
Comment 9•17 years ago
|
||
Like I said in comment 5, the only regression I could find in the testcase was "selecting header and draw circles with it over the grid". This gave a performance regression. Only builds with this translucent drag feedback had this problem, I did some checks around the time this patch was checked in.
|
|
||
Comment 10•17 years ago
|
||
As I read it now the reporter just meant that I should mouse down on the grid and select some cells. This showed no performance regression. Little misunderstanding I think.
No longer blocks: 374593
|
||
Updated•17 years ago
|
Component: Drag and Drop → DOM
QA Contact: drag-drop → general
|
|
||
Comment 11•17 years ago
|
||
In the meantime I found indeed a regression, if I quickly try to select nearly all cells. So if I mouse down on one of the first cells on the top left and then very quickly drag-select far to the right, I see indeed some delay. This regressed somewhere in the first half of August 2006. But I can't reproduce it on my Vista computer where I have more archive and a working optical drive so trying to find a range is more complicated and would require more time.
|
|
||
Comment 12•17 years ago
|
||
Ok, I'll try to come up with a testcase that more clearly shows a performance regression, first.
|
|
Reporter | |
Comment 13•17 years ago
|
||
I believe everyone understood the issue, am i right?
|
|
||
Comment 14•17 years ago
|
||
(In reply to comment #13)
> I believe everyone understood the issue, am i right?
I hope so. To get this clear, does comment 11 describe your bug?
|
|
Reporter | |
Comment 15•17 years ago
|
||
> I hope so. To get this clear, does comment 11 describe your bug?
Yes. To be more clear, mousedown over a cell and then move your mouse towards right and bottom side in a quicker way. The selection of cells will be highlighted with a blue background.
And then, compare the same user experience in Firefox 2. I am sure you can feel the difference in speed.
Fyki, I used FF2 portable edition for testing this case in both FF3 and FF2 in a same machine.
|
|
Reporter | |
Comment 16•17 years ago
|
||
Any updates on this issue? Pls help
Thanks
Jay
|
||
Updated•17 years ago
|
Version: Trunk → 1.9.0 Branch
|
||
Comment 17•15 years ago
|
||
weird testcase. can't multiselect starting in row 1 or column 1
|
||
Comment 18•14 years ago
|
||
Works for me in Firefox 4 (and Opera)
Buggy behavior in Chrome.
|
||
Comment 19•13 years ago
|
||
WFM: Mozilla/5.0 (Windows NT 5.1; rv:12.0) Gecko/20100101 Firefox/12.0
|
||
Updated•12 years ago
|
Status: NEW → RESOLVED
Closed: 12 years ago
Resolution: --- → WORKSFORME
|
Assignee | |
Updated•6 years ago
|
Component: DOM → DOM: Core & HTML
You need to log in
before you can comment on or make changes to this bug.
Description
•