My AJAX script runs fine on IE and Opera, but in firefox memory usage raises exponently (sript processes text, more text I use, more memory needed... when I use up to 1000 words, it takes 2 GB RAM on Firefox, while few mb on IE and Opera only).
<!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 writing a very complex javascript application and I'd like memory usage to be as low as possible, so I've got a question about objects.
I'm using jQuery and my code is a bunch of jQuery plugins that interact with eachother. Will there be a difference in memory usage if I declare functions like this:
I haven't written anything in javascript as complex as I'm about to write, so I never worked with objects. As far as I understand, $.fn.whatever will add function to prototype, while $.whatever will add function only to one entry of jQuery object.
So question comes down to this: when jQuery object is being created, are functions in it being copied (meaning increase in memory usage) or does javascript only make references (meaning no significant increase in memory usage) to one main entry of that function in prototype?
I have a really long application so i'm trying to minimiza cpu/memory usage,with each function, therefore I have a few simple questions.
1. on elements added after the page has been loaded,is there a difference between putting "onclick" inside the element tag or using jquery's delegate like the following example?
2. does it make a big difference selecting an element with a full path like (#body #contentdiv #userstbl td.example)or just typing (.example) ?
3. I have 2 arrays of objects, both objects has an id attribute, one of then objects are the images on the page, the second one is an ajax result with updated images.will it be better to first loop threw both objects just to create new arrays with just the id's instead of looping the threw those big objects? like this:
Code: if (data.online) var online_length = data.online.length; else[code]..........
Attached is a sample html file (named jqmleak.html - rename it to remove the txt extension and drop it into your web server to test for yourself) that I've put together to demonstrate a memory leak with the $.ajax function in jQuery 1.6.1 when run in Firefox 4.0.1. The file loads jQuery 1.6.1 from the Google API CDN. Next, a simple function is defined that runs $.ajax to request the html file itself. This function is then set to run once every second using setInterval.
In Firefox 4.0.1, on both Win XP and Linux (ubuntu 10.10, 64-bit), I can watch the amount of memory consumed by Firefox gradually rise. It takes a few minutes for the problem to be observed, because initially the memory will decrease with no other activity in the browser. Then after about 5 minutes or so, I can watch the memory used by Firefox slowly but steadily increase. I can use the handy 'about:memory' tool in Chrome to monitor this alongside other browsers. Chrome, Opera, and IE do not exhibit the same problem with this test. Their memory usage will vary within a range of about 2 or 3 mb, but over a long period of time they do not increase their total amount of memory used. This problem is only happening in Firefox 4.0.1 as far as I can tell (I also used safe mode in Firefox to make sure no plugins were interfering with the test). I have tried both GET and POST methods with the $.ajax call, and with the cache setting both enabled and disabled. The result is the same.
Is this a jQuery problem, or maybe instead a bug with Firefox? I see similar bugs reporting memory leaks in other situations, but usually specific to IE. I was about to report a bug for this, but I thought I'd check here first to see if anyone can duplicate this problem, and/or point out what I should do to prevent the memory leak in Firefox.
The question has to do with the use of popup windows in a web page. I have heard that popup windows should be avoided; due to use of popup blockers and browser that do not process javascript.
Is the use of popup windows bad design? Will it severly reduce the usage of our web page?
Note, The popup windows are created using only onClick events, not onLoad or onClose events. Do popup blockers make any distinction between the two?
I'm really hoping someone out there can help me with an unusual, frustrating XP problem that I just can't seem to fix.
When certain web pages are opened with my Internet Explorer 6, it causes the CPU to jump up to 100% usage, and my computer comes to almost a halt. The culprit, according to Task Manager, is always IEXPLORE.EXE, or at least one of the IEXPLORE.EXEs if there are multiple instances.
I've noticed a common thread to virtually all sites that cause the CPU to run at 100% -- Javascript. Pages containing Javascript are virtually always the problem. Examples:
1) almost all pop up windows 2) Yahoo! Mail 3) Match.com Searches 4) All Music Guide
I'm not a computer expert at all, so I've only done what I can think of, or what has been suggested to me. I've checked/removed spyware/malware with multiple pieces of software (Spybot, etc.) I've defragged. I've checked for viruses using both NAV and PC-cillin. I've used my System Mechanic program to go through almost all fixes/maintanance/optimizers. The only thing i haven't been able to do is Windows ChkDisk, because it gets stuck every time I try to use it.
I'm used to C/C++ where if you "new" something you really need to "delete" it later. Is that also true in javascript? if i do "mydate = new date();" in a function and dont "delete mydate" when the function exits do i have a memory leak or other trouble brewing?
ie: function MyFn() { var mydate;
mydate = new date(); }
does the above function present a problem (what if its called over and over and over etc)? or is the allocation automaticaly freed on function exit?
I noticed that Apple updated their website. In this thread I asked what people's thoughts on it were, but one of the main things I noticed in the mac and or the iPod pages is that the content elegantly spreads outward form the centre and fades in when the document is loaded.
So, I have a few questions, How would one do this? I know the fading can be done with jQuery, but what about the fanning-out form the centre? And also how the fade order is from top to bottom not what loads first is one of the aspects that makes it elegant, I believe. How would one do this?
My original fiddle for a solution used a separate callback function which just called def.resolve().However I then remembered that I've seen other code simply pass "def.resolve" as a callback in its own right. I tried this instead, and it works (see http://jsfiddle.net/Nyg4y/3/).This got me wondering - how does this work? As I understand it for this to work at all the value 'def.resolve' must be specific to 'def'.This suggests that it is actually a (reference to a) closure holding a reference to 'def' in its scope. Is my understanding correct, and if so is this behaviour guaranteed?
I have a simple page and a javascript that measure the time the user has spent on a page and I want that variable to pass as a link to another page (php). I'm stuck (rookie) with how to actually pass that on in the link.Here's my code:
I am using this code load a file from server to display in to a div.
Code JavaScript: function getHTTPObject() { var xhr = false; if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); [Code]...
I want to use the same script but apply for a button, clicking the button, a file called from server will display in the div "ask_seller". Since button has no href attribute, I don't know how to name the file that going to be called(or I don't know what is the usage in this case)
I am fairly new to javascript but I am an experienced php programmer. I have been parsing XML information using php, but my CPU usage has been too high recently due to this. I am trying to convert my scripts to javascript, but I am unsure how I can do this using javascript. I think that if I get started off, the rest will be easy. One of my XML files is located at Code: http://ws.audioscrobbler.com/2.0/?method=user.getrecenttracks&user=bbcradio1&api_key=c910b0bc1e2d4e64964ebcd2d69c255c&limit=500 Basically I have been trying to grab the Name, Artist and large image of the most recent <track>.
Issue: Received project from previous developer who left. The working URL generates a table chart using Javascript after you have entered a valid address/zip code. I haven't been able to determine why I can't get the "schoolfinder-business.asp" URL to generate a table chart using Javascript. I believe the issue is related to something in the function GetDirections, but I cannot pinpoint the issue.
Is there a way to check the page for invalid usage (e.g. text boxes using .text which doesnt exist)? I originally thought I could use the .data("events") but then realize that .text and .val isn't an event which is pretty obvious but I'm stuck now. I already know my selector is $('input[type="text"]') but is there any way to see if anywhere on the page is improperly calling .text()?
I have this web-app which can also be used offline. However, some content is dynamic (it depends on the user input). What I do now to have it accessible offline, is to store this content into localStorage. However, this works great for text, but what about images!
I've seen examples on the web where the base64 representation of the image-data is used, which is text and can be stored. But how do you get the Base64 of raw image data client-side ?
What would be the preferred way (Assume we don't have a File API) ?
I have a list for example <ul id="applications"> <li id="id-1" class="util"></li> <li id="id-1" class="app"></li> <li id="id-1" class="util"></li> <li id="id-1" class="app"></li> </ul>
Then I want a select some of the list with some animate effect, first the all of the elements would disappear, then the elements that I wanted would display one by one the code: $('#applications li').each(function (index) { setTimeout(function (e) { e.hide("slow"); }, index * 100, $(this)); }); $('#applications li[class="app"]').each(function (index) { setTimeout(function (e) { e.fadeIn("fast"); }, index * 100, $(this)); });
The final effect is that all the elements would disappear first but the element I wanted would not display? Then I think about the queue,before I use it I change a little about the code: $('#applications li').each(function (index) { setTimeout(function (e) { e.hide("slow"); }, index * 100, $(this)); }); $('#applications li') .each(function (index) { setTimeout(function (e) { e.fadeIn("fast"); }, index * 100, $(this)); });
The yellow part is the different from the former one, the effect is that all the elements would disappear first, then all the would display again without any problem!
I'm having an issue getting jQuery to load from a local file system. My head links are: <script type="text/javascript" src="js/jquery-1.3.2.min"></script> <script type="text/javascript" src="js/jquery-ui-1.7.2.custom.min.js"></script> <script type="text/javascript" src="js/jquery.scrollTo-min.js"></script> <script type="text/javascript" src="js/jquery.localscroll-min.js"></script> <script type="text/javascript" src="shadowbox-3.0.3/shadowbox.js"></script> <script type="text/javascript" src="js/myscripts.js"></script>
This works fine when served from my server via http. However, I want to load this entire site (including all linked js/css files) from a local filesystem for offline usage. When I move the project to a local filesystem, the browser throws a bunch of errors from the secondary scripts (like jquery-ui) which indicate that the main jQuery lib isn't loading (ie.ReferenceError: Can't find variable: $). This behavior is consistent across IE7/FF3/Safari4Mac.
I've been putting together a small pet project. Once it was finished i realised it had a gigantic memory leak inside of it. I tried to read up on the subject, but couldn't find the source of the problem via the articals.
This site is very simple, so I'd think idenifying (and hopefully fixing) the problem would be easy. Here is the relavent portions of JS (followed by links to the full page incase you need to see that): Code:
I was wondering how good is JavaScript with memory management. I have an object called MANAGER that has a list of other objects, each one managing a single DOM nodes, etc. In my implementation of MANAGER.reset(), I simply recreate my MANAGER.object_list = new object(); and do a single MANAGER.domnode.innerHTML = '' as apposed to getting my hands dirty. Is my app leaking memory?
Internet Explorer leaks memory when I update a div container using innerHTML, this does not occur in firefox. This would not be a problem except the webpage is required to be left on for weeks on end without being restarted. I presume the issue with innerHTML is that Internet Explorer apparently parses what you give it and then decides on how to construct the dom elements itself, so never truely creates what you give it.
I know that the innerHTML is the problem as I have successfully narrowed down the leak to that line. It only leaks memory when I assign content to the innerHTML of my containing DIV. Appending a text node, for example, with the exact same information to the same div does not leak. Note I have also tried using such existing AJAX packages like Prototype etc. but to no avail.
I need to do it this way as my XML documents are styled using an XSL stylesheet and then transformed using transformNode [I will omit details regarding firefox as there is no problem there]. I have looked into transformNodeToObject as a way to get a dom object that I originally assumed could be appended [as a child] to my containing element. This did not work and gave me compatibility errors.
I suppose I am either looking for someone who has solved this problem, or who has an acceptable work around. Or someone to say that it cannot be solved.