I have a table, 10 cols, 200 rows. Using tablesorter causes a memory leak on every page refresh of almost 2mB. A smaller table causes a proportionately smaller memory leak. Is there way to clear this memory? I've tried setting inner html of the table to '', but it makes no difference. Is there even a universal method i can call to remove any trace of any jquery plugin I have on the page?
View 3 RepliesI have a jquery based system with ajax calls instead of page refreshes. Every time I return some ajax content, it replaces the content on the main div.
function execcmdcallback(data, textStatus, XMLHttpRequest)
{
$("#divmain").html(data);
data = null;
}
Each time this executes, the browser memory increases by about 600-900kb. Can anyone suggest a way of doing this where the old memory is freed so there is no significant increase in browser memory on each ajax call ?
I've studied this a bit, [URL]..., but I have to admit I don't quite understand it I see the same issue on IE8, FF and Chrome. FF comsumes less memory per ajax call and frees some memory seconds later, but still the total working set is increasing on each call by 300k in FF and 600 to 900 in chrome and IE
What is the best way to prevent memory leaks in IE6 and IE7?
I'm working on an internal web app that just gets slower and slower, using more and more CPU load and memory, unless and until you close the browser and start, again.
I have the AJAX-script. It eats memory about 4Kb per one callback.
Script reflects messages from server application in real-time. I form
messages, and put them into the iframe. If mesages more than 40 last
message delete. Can you check the script and say about my mistakes? Code:
I have a question regarding how to prevent memory leaks in Internet
Explorer when using closures. I already knew about the circular
reference problem, and until now was able to prevent memory leak
problems. But I needed to store DOM elements and can't solve it
anymore. So I search the group archive to see if I missed any
valuable information. I found some interesting articles, but somehow
could not apply it to my problem or I did not understand it fully.
In particular the articles that talked about setting variables to
NULL seemed as an easy solution, but I think I didn't understand it,
because it didn't seem to work.
So, let me explain my problem in more detail. I am working on some
very dynamic and complex page. It uses AJAX (XMLHttpRequest) to alter
different parts of the page. This already disqualifies the finalize
method solution to cleanup memory leak problems. I use several
"component classes" to do the work of creating DOM elements in some
container element and provide an easy to use interface for
manipulation the content. For example I can call
component.setBackgroundColor("red")
and the component takes care of changing the style on the correct
DOM element that is encapsulated in the component. In reality the
component uses more complex interface method, but I hope you
get the picture of why I do this.
Let me show you some example code:
function MyComponent()
{
var div;
var handler = null;
this.generate = function generate()
{
div = document.createElement("div");
div.onclick = MyComponent.createClickHandler(this);
// normally more elements are created here
return div;
}
this.setBackgroundColor = function setBackgroundColor(value)
{
div.style.backgroundColor = value;
}
this.getHandler = function getHandler()
{
return handler;
}
this.setHandler = function setHandler(value)
{
handler = value;
}
}
MyComponent.createClickHandler = function createClickHandler(component)
{
return function(event)
{
var handler = component.getHandler();
if (handler != null)
handler(event);
}
}
This "component class" can be used like this:
var container = document.getElementById("container");
var component = new MyComponent();
container.appendChild(component.generate());
....
component.setBackgroundColor("red");
component.setHandler(function(event) {alert("Stop touching me!")});
The problem, of course, is that this code will create a memory leak
in Internet Explorer. I need the component in the event handler to
get the handler dynamically, but the div is stored there too,
creating a circular reference.
One of the things I tried doing is making a DOMStorage "class" like
this:
function DOMStorage()
{
var map = new Object();
this.get = function get(id)
{
return map[id];
}
this.put = function put(id, obj)
{
map[id] = obj;
}
}
var storage = new DOMStorage(); //global
Instead of storing the div element directly in the component, I store
it under an id in the DOMStorage and use it to retrieve it later.
This actually prevented the memory leak. I don't really understand
why, because I still see a circular reference. Maybe Internet
Explorer does not count references in the global scope as a circular
reference? When I move the global storage to inside the container
object I get the memory leak again.
Unfortunately I am unable to use a global DOMStorage, because the
"component class" in instantiated many times, and they must all have
their seperate DOM elements.
Perhaps I have to generate unique ID's when I put a DOM element into
the global storage? It seems so over-the-top for something that works
perfectly fine in Firefox.
What are my alternatives?
I'm working on an Ajax library that I plan to use on several upcoming
projects. Everything seems to work just great...
Now I want to get into the finer aspects of checking things... How
much memory am I using, are my objects making themselves available for
garbage collection adequately, etc.
Are there tools you can recommend (especially for IE and Firefox) that
I can use to get this information?
I'm building a JavaScript-based calendar for a client that will require me to replace the page's HTML based on the user's input. For example, if the user clicks on a particular date, then the month/week calendar will be replaced with the day calendar. Needless to say, there are several event listeners involved. However, if I suddenly swap out the month calendar for a day calendar, does that mean that there are several event listeners in memory for elements that no longer exist? Or are those listeners destroyed when the elements are destroyed? Basically my question is, every time I swap out the HTML, do I have to detach all of the old events too?
View 3 Replies View RelatedI've been searching the web for a while now, and I haven't come across a conclusive solution for memory leaks due to replacing nodes with frequent AJAX updates. I wrote a class that pulls an RSS feed frequently (e.g. every 5 seconds) and updates an HTML element with new information. In the process, it removes the old nodes and replaces them with new ones. It works fine visually. The only problem is that it has terrible memory leak complications; when I put the script on to run, it increases the memory usage by about 1MB every few seconds at an accelerated 1000-ms delay between updates!
(That's 100MB every few minutes!) I discovered this when I let the script run for a few hours straight, not thinking anything of it, and when I returned to my computer, it was frozen up Opera seems to be the worst at its memory management on this script, Safari and Chrome are in the middle, and Firefox seems to handle it the best, but nonetheless there are memory leaks in all four. (I haven't tested IE yet, but based on what I read, I would expect that it might even be worse than Opera!)
[Code]....
The problem is, the extension tend to crash when there is no internet connection, and sometimes, the http requests fail to communicate with gmail server, they got built up over time and end up flooding the memory.
[Code]...
I found tablesorter plugin failed to sort the float if the float is in scientific notation? Eg. the tablesorter asc sorted result of float list is : [ 7e-06,4e-05,0.051116,0.00518,0.0].
View 3 Replies View RelatedI was trying to get the tablesorter plugin working. I'm not working with flat data, but with database-data appended to a div by javascript. The tablesorter plugin is working with flat HTML data, but no with that dynamic data.
View 1 Replies View RelatedI using tablesorter but I have a problem:
[Code]...
If i order second column, order is not correct! How can I solve it? Can I use link attribut in table sorter?
I'm trying to get a table like on Bob's site
So I downloaded Greg's tablefilter plugin and the tablesorter plugin like Bob says in his site. I then have this code...
I have to implement Tablesorter Pager plugin on Dynamic Table which will be cleared(emptied) out everytime. I triedby adding pager to [URL].. The sorting is working fine for first time but when i click on append url, the sorting is not working and the pager is skipping pages for large dataon subsequent clicks. I tried all the solutions ( appendCache, update,bind) but nothing seems to be solving the problem.
[Code]...
I am using the jQuery TableSorter plugin on a table that I have shaded. The table sorts successfully, but the shading is not refreshed when the table refreshes. How can I refresh the shading as well after the sort?
View 1 Replies View RelatedI have a xhtml jsf page that load anothers xhtml jsf pages that have, each page, 1 table with tablesorter enabled, when i load the first xhrml into the DIV the tablesorter works ok, when i load the next page the tablesorter od the page loaded before stops to work. In fact,after debugged the table sorter code, I found that the header.click() of the tablesorter loaded before is being called twice.
View 2 Replies View RelatedThe default sort (when clicking on any of the headers in the tablesorter table) is ascending. Now, I want to change that to descending for ALL columns, not just the initial sort column (defined in sortList). I've tried editing sortInitialOrder parameter in the .js itself, and nothing. I've tried adding it as a parameter in my html page when defining and assigning tablesorter, and nothing. What am I missing? And how do I accomplish this?
View 3 Replies View RelatedI am using Table sorter to sort the table. I need sort to work only if i click explicitly on header sort image, not on headers. I am using dynamic column width on headers and whenever the colum is resizing the table sorter is getting called unnecessarily because the click event is getting fired on the header. Do i need to change the $headers.click call in jquery.tablesorter.js page?
View 1 Replies View RelatedI am using Jquery and the tablesorter plugin to sort a table of information. Within the table i have a column of checkboxes. A user can check the boxes and press the submit button which will $_POST the checked boxes onto the next page. Everything works if i dont sort the table, but if i sort the table and then check a few boxes the $_POST array is empty.
View 1 Replies View RelatedWorking on creating my own plugin and realized that I would very likely end up doing this again in the future. Unfortunately, I have an extremely short memory when writing code. I frequently have to re-read the code I've created the day prior so I can get back on track with what I was doing. As such, I'm a fervent commenter in my code.
So, I'm creating a jQuery plugin framework with comments for everything that's going on in the framework to prevent my brain from having to re-learn everything in a month or so when I do another one.
Plugin-savvy folks to take a look at this code and help me fill in the blanks and make corrections to those places where I'm way off base. As you'll likely notice rather quickly, this is taken from the jQuery plugin tooltip construct found here: [url]
I'm using JQuery Tablesorter, and I would like to DISABLE Multi-column sorting option from tablesorter plugin.
View 2 Replies View RelatedI am using the tablesorter plugin and am experiencing the following problem:
Under several scenarios the up/down arrow icons will overlap with the text in a column's header. This occurs if the browser is resized so the table width is too narrow (e.g. plugin should force a min-width perhaps?).
More importantly, this will also occur when the text in a columns header is shorter than any of the values in the column the up/down icons overlap with the text in the column header.
I've attempted setting padding on the header columns but no success (probably because the up/down icons are set as background images and therefore have no impact on padding)
At the moment the plugin won't be usable for me since the arrorws overlap with the text in several columns.
My issue here is that the click event (edit) will work on page one but it won't when there's more than one page. What I need to do is add the click event to each page and I'm not sure where I need to accomplish this at.
Code:
<?php
// Include the database page
include ('../inc/dbconfig.php');
$query = "SELECT
[Code].....
First the code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript">
function TextScroll(scrollname, div_name, up_name, down_name, top_name){
[Code]...
When I use mouse wheel in Firefox to scroll contents of the DIV, memory usage in Firefox goes through the roof. Code above is a fully working page, if anyone would like to see what's up, just load it up, and start moving your mouse wheel in the area with text. You don't actually have to scroll the text, just moving the wheel back and forth in that DIV will do. Memory usage will start going up quite fast, and after you stop moving the wheel, it will finally come down a bit after a short while. I've highlighted in red the line where mousewheel event is registered for Firefox. I'm not sure if it's really a problem, but since Opera and IE don't have any strange memory usage, and Firefox does, maybe I did something wrong. In everyday use it shouldn't matter [don't expect to have kilometers of content to scroll], but anyway, it is a bit unsettling.
I'm trying to get tablesorter working on my site, as per [URL]
Here's the page I'm working on: [URL]
I've included references to jquery-1.5.1.min.js and jquery.tablesorter.min.js in the page header, and uploaded the files to my site. I'm sure the references are OK, because if I use firefox web developer to view javascript it can find both of these.
I've included a script in the header to sort the table:
<script type="text/javascript">
$(document).ready(function()
{
$("#myTable").tablesorter();
[Code].....
The table has an id of "myTable" and is of class "tablesorter".
I've uploaded the css file, and again, I'm sure this is being located OK, because the table has the look and feel of a tablesorter class, and again web Developer is able to display the css correctly.
BUT, the icons aren't appearing, and the table is not sorting. I've put copies of the icons in root, in the same directory as the page and the same directory as the jquery files for good measure, but they're not being found. And no amount of clicking will sort the columns.
I use table sorter ( latest 2.0.5) and Jquery latest for sort table !
It works fine!
BUT! in some tables, I've link for open image in a light box !
On the first page, all works fine !
But, as soon as i set the second ( or more ) page in the table, the link work like a classic link, not like a "lightbox class" link !
I've try with fancybox => same !
with shadowbox => same !
and with lightbox => same !
So, the problem come from tablesorter or the pager !