I am using jquery in my web page. I see a lot of memory leak happening and after a while the whole browser grinds to a halt. I used the sieve tool and noticed that there is a contsant increase in the no. of DOM elements, everytime by a no. of 4.
Am I doing something wrong in the way I have associated events?
Or is it because I am using setTimeout to redraw my app every X seconds?
Event association:
$('.bir_Names').click(showNames);
The selector $('.bir_Names') evelautes to a set of some 300 elements each of which call the function on click.
setTimeout
Every X mins I remove every single HTML element in the app and rebind fresh data and associate the events. I use jquery remove() to delete elements. have tried innerHTML = '' and empty() also.
I see a jump of nearly 30-40 MB for every redraw and Sieve indicates that none of the deleted nodes are actually removed.
Anyhelp would be greatly appreciated. This thing is driving me nuts.
Thanks.
You don't mention which browser, but some googling seems to indicate that this is a known problem with IE. Here's one potential workaround:
http://forum.jquery.com/topic/possible-memory-leak-in-remove-and-empty
Note that that's referring to a 1.2.x release of jQuery. Before you do anything, make sure you are running the latest 1.6.x release to first see if the defect has already been fixed within jQuery.
[EDIT] ack...you DO state your browsers...'all'...so maybe disregard that first link.
Related
First of all sorry if this question has been already asked somewhere, but after a few hours on google I still can't find an answer.
I am pretty new in portlet development, (but we have a shortage of developers and I have to work with it time to time), so the solution might be something trivial, but I really don't have enough experience with it.
The problem is I have two portlets on a page and I try to let one of them know about changes in the other. For this I use IPC. In the first one I have a Liferay.fire function:
function fire(key,value){
Liferay.fire(
'category',{
id: key,
name: value
}
);
}
In the other I have a Liferay.on('category',function(category){...}) function with an ajax call inside and some rendering methods.
Now if I visit the mentioned page and click on the corresponding buttons, at first everything works just fine. However, if I navigate from this page and come back, the listener will run two times. Navigating again -> three times. And so on... But if I reload the page (with F5 or CTRL+F5), it starts over, so until further navigation the listener runs only once.
The other strange thing is no matter how many times the function runs, the input parameters are all the same for each.
For example, if I have left the page and went back to it 3 times and last time I chose the category with 'id=1', then the function will run 3 times with 'id=1'. Now if I choose 'id=2' it will run 3 times with 'id=2'.
If anyone has any idea I would be really grateful as I am stuck for almost a day now.
Thank you very much in advance and please let me know if you need any further info.
the problem you're having is caused by the global Liferay.on listeners that are being created but never removed.
In Liferay Portal 7.x, SPA navigation is enabled by default. This means that when you are navigating, the page isn't being completely refreshed, but simply updated with new data coming from the server.
In a traditional navigation scenario, every page refresh resets everything, so you don't have to be so careful about everything that's left behind. In an SPA scenario, however, global listeners such as Liferay.on or Liferay.after or body delegates can become problematic. Every time you're executing that code, you're adding yet another listener to the globally persisted Liferay object. The result is the observed multiple invocations of those listeners.
To fix it, you simply need to listen to the navigation event in order to detach your listeners like this:
var onCategory = function(event) {...};
var clearPortletHandlers = function(event) {
if (event.portletId === '<%= portletDisplay.getRootPortletId() %>') {
Liferay.detach('onCategoryHandler', onCategory);
Liferay.detach('destroyPortlet', clearPortletHandlers);
}
};
Liferay.on('category', onCategory);
Liferay.on('destroyPortlet', clearPortletHandlers);
I have a Xpage that takes too long to load. So the client ask me to do a loading indicator.
I searched and found XSP.startAjaxLoading(), that I put in onClientLoad event of the Custom Control.
But now I don't know where should I put XSP.endAjaxLoading() to make the loading screen go away.
I'tried to use in afterRenderResponse and beforeRenderResponse: view.postScript("XSP.endAjaxLoading()"), since this comand is CSJS, but it doesn't work.
Thanks in advance.
I think you want to put it in the onComplete event. That can be difficult to find. You typically need to use the outline control to find it.
I have a video demo on NotesIn9 that has an example on this.
http://www.notesin9.com/2016/02/19/notesin9-188-adding-a-please-wait-to-xpages/?unique=http%3A//www.notesin9.com/2016/02/19/notesin9-188-adding-a-please-wait-to-xpages/
Your attempt (view.postscript) works only with full/partial updates and does not work for page loading.
You have used onClientLoad - which is executed when your page is finished with loading. I guess you get ajax animation after a while and it won't stop.
You should make preload screen - very simple XPage which starts animation and does not care to turn it off. In onClientLoad event redirect to your slow XPage. That will discard the animation.
I'd highly recommend using the Standby Dialog XSnippet https://openntf.org/XSnippets.nsf/snippet.xsp?id=standby-dialog-custom-control. I use it as a standard in all XPages applications.
I used this answer as solution: https://stackoverflow.com/a/35481981/5339322
I've saw it a few days ago, what made me think twice is that using this i should know what is doing my XPages to delay. I ran some tests and discovered what, and it was a call to a method in the afterRestoreView event, then I migrated it to onClientLoad event and used the solution in the answer above cited.
But I'm afraid that I have to keep an eye on it, so if someone adds some code that delays in one of the another events of XPages I have to move it again, of course, if it's possible, if it's not, I'll figure it out something diferent.
Thanks for all the answers ans comments.
We're currently developing an Xbox One and a Windows 8.1 app, which share the same codebase, and I'm running into an issue with the 'pointerover' (or hover-state) in of a listView item in the WinJS.UI.ListView.
The listview item has an eventListener, pointerover. However, this only seems to work on the first 10 items in the WinJS.UI.ListView although I see 16 items on screen, and the WinJS.UI.ListView gives me:
indexOfFirstVisible = 0
indexOfLastVisible = 15
The eventListener my listItem has, is:
mediaTile.element.addEventListener("pointerover", function (that) {
that._allItemsListView.currentItem = { hasFocus: true, index: this.tileIndex };
}.bind(mediaTile, this));
When I add a breakpoint, it get's hit but only for the first 10 items although there are 16 items on screen.
Does anyone know what I'm missing here?
Thanks in advance!
My guess is you're getting bitten by ListView visualization. Perhaps tiles higher than 10 don't yet exist when you bind your event listener, but they appear on screen quickly enough that it isn't obvious.
I'm not expert enough to advise a concrete way around this. Conceptually you could listen for an event when new items are added to the list (on the list itself) and then add your pointerover event to the new items.
Yes, that seemed to be the case when you look at it from a distance; another developer took over, and we also migrated from WinJS 1.0 to WinJS 2.0, which seems to solve a lot of these problems.
Up until today I'm not sure what the exact problem was; we also played with the fetch limit of the datasource and this also seem to have played a part in solving the problem.
I'm sorry I can't be more thorough in my answer; I would have to ask the developer (if he still remembers) what the problem was, but afaik the major improvement was moving to WinJS 2.0.
I'm running a scenario where form fields are automatically filled in with invalid values which trigger some javascripts to show warnings under each incorrectly filled field when I blur.
The test passes when the browser is in focus. It finds the xpath with the "expected warning" that I pass. But if I minimize or just click on another application, it fails to find the xpath.
I'm running Firefox 3.6 (going to update it soon) and the way I'm doing to find the xpath is by using "page.should have_xpath(xpath)"
Does anyone have any idea how what might solve this? It's really important for me to run it with the browser minimized.
Edit and alternative solution:
I guess the timing issue that occurs in events such as blur followed by finding a certain xpath in a minimized browser inherent to the driver itself. Therefore, I decided to run the tests in a Virtual Frame Buffer using xvfb in Linux and it seems to be working really well. I'm planning on applying this to be triggered by Hudson/Jenkins whenever a change is committed.
Could it be a timing issue? Perhaps if the browser isn't frontmost and maximised, the rendering is not happening quickly enough for the content be present when Capybara checks for it.
Also: How are you triggering the blur event?
Inside my "dom ready" function, I create a TabView on an HTML element and call tabview.getTab(0).blah(). Unfortunately every now and then I get an error that tabView.get("tabs") returned null in my javascript console (firefox).
YAHOO.util.Event.onDOMReady(function() {
tabview = new YAHOO.widget.TabView("content");
var tab0 = tabview.getTab(0);
...
tabview.getTab(0) is implemented as tabs.get("tabs")[0].
This happens sometimes but not every time. Does anybody have an explanation for why this happens sometimes? The DOMReady event occurs after the entire DOM is in place but before anything is displayed, right?
Speaking of which, sometimes I see flashing of data in some of the other tabs. That does not bode well I think for the nice, clean experience I was hoping for.
This is YUI 2.7.0/
OK - I believe the answer is, I was trying to use prototype and YUI at the same time. In theory I think that is possible but you need to pick one or the other when it comes to doing things on the "dom:loaded"/onDOMReady events, if you know what I mean.
So I don't know what was happening, but it was some sort of race, and once I picked a single mechanism for doing things when the dom was ready, everything is working fine.