Comments (14)
Please try to isolate the problem to a small reproduction scenario you can put up on jsfiddle.net, otherwise it's very difficult to help you since this crash could be caused by a lot of things.
from knockout.mapping.
Yes i understand, but i never used jsfiddle.net and there are a lot of ajax call how could i do that ? I've tried to debug the code
of the library and i find the call that cause the memory leak but i don't know if this could help.
from knockout.mapping.
What would already make it a lot simpler is if you replace the ajax calls with functions that just return the data. So, instead of doing:
$.ajax({success: function(data) { doSomething(data); }});
You could do:
var data = { a: 1, b: 2 };
doSomething(data);
So basically, not do the ajax call but just call the success
function directly with data
that would normally come from the ajax request.
from knockout.mapping.
Hi Roy, thank you very much for your suggestion. I made the fiddle example: http://jsfiddle.net/pierol/9MSSS/ the problem is that with fiddle i can simulate the problem because i can't open a modal which i think is the problem. In fact in the fiddle example if you repeatedly press the button "salva" the problem doesn't happen. If you want to give a try here the repository https://github.com/pierol/Knockout-memory-leak after 6/7 pressed to the "salva" button you will see the interface freezing and the browser telling to stop a script that doesn't respond.
from knockout.mapping.
Hi Piero, you really need to narrow it down a bit more. Can you strip away all unneeded html? Also, if the problem is caused by opening a modal, then maybe that is the issue and NOT the mapping.
Have you tried posting on the Knockout google group? There are a lot of friendly people there who may be able to offer some suggestions as well: https://groups.google.com/forum/?fromgroups#!forum/knockoutjs
from knockout.mapping.
Hi Ryan, thank you again for your patient, after a narrow investiganting i've found that the problem is not the modal. I follow your suggestion and now i've semplified the html (https://github.com/pierol/Knockout-memory-leak). It comes out that the call to ko.mapping.toJSON(viewModel) is time consuming and after a sequence of clicks on the save button the script stopped to respond. In fiddle http://jsfiddle.net/pierol/9MSSS/ i can't reproduce the problem i think that the context in wich the sript is execute is different.
I will post the problem even to the google group but i'm quite sure that the problem is the mapping.
from knockout.mapping.
Do you maybe have a lot more data in your 'real' scenario than in the JsFiddle? The mapping plugin does take time, so when you have a lot of items it can get slow.
from knockout.mapping.
The data in jsfiddle is identical to my real data. The problem i think is that repeating the toJSON operation more and more on same viewmodel perhaps the viewmodel grows even if the data remain the same. In fact the first 1 or 2 click the method call take a acceptable time and after the sixth o seventh click the call is too long and the page crash even if the data in the view model remain the same.
from knockout.mapping.
Are you maybe creating subscriptions or computed/dependentObservables every time you open the modal, and not disposing of them? This way, every time you open the modal, you get more and more subscriptions, so that everything becomes slower and slower.
from knockout.mapping.
Every time i open the modal i made a ajax call to obtain the data in JSON format from the server then i make a ko.mapping.fromJS(datafromajaxCall,viewModel) to update the viewModel as i saw in the site documentation of the knockout library. I don't know if this call create internally subscriptions every time, i think it shouldn't.
$.ajax({
type: 'GET',
async: false,
url: 'adminprodotto/detail?IdProdotto=' + key,
contentType: 'application/json; charset=utf-8',
success: function (data) {
ko.mapping.fromJS(data, viewModel);
$('#modal-prodotto').modal('show');
},
error: function (jqXHR, textStatus, errorThrown) { alert('Errore:' + errorThrown) }
});
I create the viewModel in a non declarative way but making a ajax call and then extended the object viewModel with data1
var viewModel = {
init: function() {
$.extend(viewModel, ko.mapping.fromJS(data1));
},
save: function() {
ko.mapping.toJSON(viewModel);
}
}
viewModel.init();
ko.applyBindings(viewModel);
but in the test html i made only sequence call to the ko.mapping.toJSON(viewModel) and the issue seems to come out in anyway without the fromJS call.
from knockout.mapping.
Investingating the source code of the mapping plugin i've found that this call inside the function ko.mapping.visitModel (line 621 of the knockout.mapping.latest-debug.js) is the time consuming function, every time i click on the save button this function become more and more time consuming even if the model is always the same:
visitPropertiesOrArrayEntries(unwrappedRootObject, function (indexer) {
var currentOptions = options;
var mappingObject = unwrappedRootObject[mappingProperty];
if (mappingObject) {
currentOptions = fillOptions(mappingObject,options);
}
if (currentOptions.ignore && ko.utils.arrayIndexOf(currentOptions.ignore, indexer) != -1) return;
var propertyValue = unwrappedRootObject[indexer];
options.parentName = getPropertyName(parentName, unwrappedRootObject, indexer);
// If we don't want to explicitly copy the unmapped property...
if (ko.utils.arrayIndexOf(currentOptions.copy, indexer) === -1) {
// ...find out if it's a property we want to explicitly include
if (ko.utils.arrayIndexOf(currentOptions.include, indexer) === -1) {
// The mapped properties object contains all the properties that were part of the original object.
// If a property does not exist, and it is not because it is part of an array (e.g. "myProp[3]"), then it should not be unmapped.
if (unwrappedRootObject[mappingProperty] && unwrappedRootObject[mappingProperty].mappedProperties && !unwrappedRootObject[mappingProperty].mappedProperties[indexer] && !(unwrappedRootObject instanceof Array)) {
return;
}
}
}
var outputProperty;
switch (ko.mapping.getType(ko.utils.unwrapObservable(propertyValue))) {
case "object":
case "undefined":
var previouslyMappedValue = options.visitedObjects.get(propertyValue);
mappedRootObject[indexer] = (ko.mapping.getType(previouslyMappedValue) !== "undefined") ? previouslyMappedValue : ko.mapping.visitModel(propertyValue, callback, options);
break;
default:
mappedRootObject[indexer] = callback(propertyValue, options.parentName);
}
});
from knockout.mapping.
Which version of the plugin are you using? (It's at the top of the file)
from knockout.mapping.
I'm using this
// Knockout Mapping plugin v2.0.4
from knockout.mapping.
And finally using this version
// Knockout Mapping plugin v2.1.1
the issue is solved Thank you Roy for your precious support. And sorry if i used an old version.
from knockout.mapping.
Related Issues (20)
- mapping fails if value = "constructor" HOT 2
- Is there a way to update the nested properties of the items of an ObservableArray? HOT 1
- Method visitPropertiesOrArrayEntries is doing unnecessary iterations on updateViewModel because the wrong variable is being used to check against ignored properties.
- Mapping not saved when data is an array HOT 1
- Mapping doesn't work when properties listed in different order HOT 4
- Empty observe array in mapping options creates observables from all properties HOT 1
- ko.mapping.toJSON to implement JSON formatting param like ko.toJSON
- Calling fromJS to amend an existing model with an ObservableArray fails
- NuGet package install directory
- Questions about Knockout Mapping HOT 10
- The "create" handler does not work with non-array properties HOT 1
- Create handler causes mapping to evaluate pureComputed HOT 1
- Suggestion: Safely update mapping when property in new object happens to be null
- mapping partial model into existing viewModel
- [Question] is arrayChanged part of the public api?
- objectLookup() + "watch" + Firefox = hilarity
- bug of optimizedKeys
- optionsCaption causes bound "value" to be deleted
- Doesn't seem to work with KO 3.4.2 HOT 1
- Having redudant data passed to an object makes it so the second reference of the same object is not updated
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from knockout.mapping.