Develop Reference

Fetch operation is a lot slower when calling it from a JavaScript code then when calling it from react-native

So I have developed an app that crawl data from a some html sites.
I wanted to keep the parser code separated from the app. So when I want to make changes to a parser I wont have to republish my app. So I could have my parsers JS files on Github for example and then let my app download and parse those parsers.
I have been able to accomplish that but then I got a weird problem. When calling fetch from the code in react-native(typescript) is a lot faster then when I call those fetch operation from the JavaScript.
Why is that? I am using the same HttpClient object the different is that I am calling it from different place.
Here is one of the Parser
Here is the parser translator.
private async loadParser() {
try {
this.script = await HttpClient.GetText(this.onlineParserURI);
if (this.script && this.script.length >= 5) {
this.searchFunction = new Function(...this.parameter, "filter", "page", this.script + "\n return search(filter, page);");
this.getNovelFunction = new Function(...this.parameter, "novelUrl", this.script + "\n return getNovel(novelUrl);");
this.latestFunction = new Function(...this.parameter, "page", this.script + "\n return latest(page);");
this.getChapterFunction = new Function(...this.parameter, "url", this.script + "\n return getChapter(url);");
var detaliFunc = new Function(...this.parameter, this.script + "\n return parserDetali();");
var item = detaliFunc(...this.types); // the constructor eg name, url etc
this.url = item.url;
this.latestUrl = item.latestUrl;
this.searchUrl = item.searchUrl;
this.id = item.id;
this.parserLanguage = item.parserLanguage;
this.name = item.name;
this.panination = item.panination;
this.searchPagination = item.searchPagination;
this.icon = item.icon;
this.parserSearchSettings = item.parserSearchSettings;
this.detaliItemType = item.detaliItemType;
this.onlineDefaultFilter = item.defaultFiter;
this.onlineSections = item.sections;
Object.assign(this, item); // add the extra fields
this.state = "ready";
}
else
this.state = "failed";
} catch (error) {
console.log(error);
this.state = "failed";
}
return this;
}
And here is how I call the methods in the parser
async latest(page: number): Promise <LightItem[]> {
try {
if (this.latestFunction)
return await this.latestFunction(...this.types, page);
} catch (error) {
console.log(error);
}
return [];
}
Here is the default types and parameters that I import
this.types = [this,
Chapter,
LightItem,
Filter,
DetaliItem,
ParserSearchSettings,
labelValue,
DetaliItemType,
Section,
NovelReviews,
HttpClient,
]
this.parameter: Array <string> = [
"parser",
"Chapter",
"LightItem",
"Filter",
"DetaliItem",
"ParserSearchSettings",
"labelValue",
"DetaliItemType",
"Section",
"NovelReviews",
"HttpClient"
];
This is the method that takes to long
There is 10 calls, the first 3 calls are fast then it gets slow for some reasion.
note: the methods (await HttpClient.getHtml(url)) get html is what taking long, it gets stuck for sometimes
async function getChapters(novelUrl) {
var page = 1;
var result = [];
while (page > 0) {
var url = novelUrl + "/page-" + page;
var container = parser.jq(await HttpClient.getHtml(url)).find(".chapter-list a");
if (!items.hasElements()) {
page = 0;
break;
}
var resultA = items.map((x) => {
var ch = new Chapter(x.attr("title").text(), x.attr("href").url());
if (result.find((a) => a.chapterUrl == ch.chapterUrl && a.name == ch.name) === undefined)
return ch;
return undefined;
}, [])
if (resultA.length <= 0) {
page = 0;
break;
}
resultA.forEach((x) => {
result.push(x);
});
page++;
}
return result;
}
Any Idea why this is happening?

JSON.Stringify returns empty array when Stringifying array of objects

I have an array which is initialized with
var detail = [];
// Have also tried var detail = new Array;
Through the rest of my code, I loop through a data set creating an object in the following manner
while(true) {
var tempObj = {
qty : "",
size : "",
adr : "",
dir : ""
}
// Some Logic
tempObj.qty = val;
tempObj.size = val;
tempObj.adr = val;
tempObj.dir = val;
detail.push(tempObj);
}
Then when I attempt to JSON.Stringify my detail array to send through an AJAX request, it returns a blank array []. This can also be seen in the below screenshot of the console.
Note: The indent at the bottom calling out the prototype as an object is because the screenshot is from the object I am attempting to send to my server. There is other non array based data in that object. I want to stringify the array so it properly sends to the server.
What is causing this behavior and how can I correct it?
Edit 1: Execution of JSON.stringify(detail)
var requestObj = {
field1: “a”,
field2: “b”,
field3: “c”,
data: JSON.stringify(detail)
}
Edit 2: Add full block of code
$("#submit-button").click(function() {
var reqDate = $("#reqDate").val();
var wonum = $("#wonum").val();
var svc = $("#svc").val();
var complaint = $("#complaint").val();
var comments = $("#comm").val();
var detail = new Array;
var topValid = false;
$(".tb-rw").each(function() {
var qty = $(this).find(".quantity");
var size = $(this).find(".size");
var adr = $(this).find(".address");
var dir = $(this).find(".direction");
var mgk = $(this).find(".mgKey");
var tempObj = {};
if(fail == true || topValid == true) {
alert("Please Make Sure all Inputs are Filled Out");
return;
} else {
//tempArr.push(qty.val(), size.val(), dir.val());
tempObj.qty = qty.val();
tempObj.size = size.val();
tempObj.dir = dir.val();
}
findSimilarJobs(adr.val(), mgk.val(), function(data) {
if(data != "clear") {
console.log("FAILED VALIDATION");
console.log(data);
adr.css('border-color', 'red');
alert("Please Make Sure all Addresses are Valid");
return;
} else {
//tempArr.push(adr.val());
tempObj.adr = adr.val();
}
detail.push(tempObj);
});
});
console.log("Preparing to send!");
var requestData = {
"requestedDate": reqDate,
"svc": svc,
"wonum": wonum,
"complaint": complaint,
"comment": comments,
"data": JSON.stringify(detail)
};
console.log(requestData);
console.log(JSON.stringify(detail));
});

Stringify should be all lower case like this stringify, otherwise is won't work. So like, this JSON.Stringify(detail) should be this JSON.stringify(detail)

your tempObj is JSON object and it should have key:value like below
while(true) {
var tempObj = {
qty : "",
size : "",
adr : "",
dir : ""
}
// or you can create empty object
// var tempObj = {};
tempObj.qty = val;
tempObj.size = val;
tempObj.adr = val;
tempObj.dir = val;
detail.push(tempObj);
}

Angular Cannot read property of null

In a web app I have two box containing some elements. I also have an aside with filters (composed by a selection). At the beginning the filters are all selected, and it works. But when I try a combination which find nothing in the first list but there are some data in the second list, I got an error. This is the when I call the Service in the controller:
if(data){ // If i have some response form serve
var tmp = null;
var lastName = null;
angular.forEach(data.people, function(ppl){
if(ppl.lastName != lastName){
if (lastName != null){
$scope.people.push(tmp);
}
// Clean the tmp
tmp = {
name : null,
count : 0,
products : []
};
// Update lastName
lastName = ppl.lastName;
}
// Add the actual row in the ob
tmp.name = lastName;
tmp.count += ppl.personCount;
tmp.products.push(ppl);
});
// Process lasts elements (if there are some) in the array
if(tmp.products.length > 0){
$scope.people.push(tmp);
}
The error is: Cannot read property 'products' of null
I've tried to write: var tmp = []; instead of null, but it says Cannot read property 'products' of undefined

I think the angular.forEach is giving you a scoping issue. Try the below code instead.
if(data && data.people.length > 0){ // If i have some response form serve
var tmp = {};
var lastName = null;
for(var i = 0; i < data.people.length; i++){
if(ppl.lastName != lastName){
if (lastName != null){
$scope.people.push(tmp);
}
// Clean the tmp
tmp = {
name : null,
count : 0,
products : []
};
// Update lastName
lastName = ppl.lastName;
}
// Add the actual row in the ob
tmp.name = lastName;
tmp.count += ppl.personCount;
tmp.products.push(ppl);
};
// Process lasts elements (if there are some) in the array
if (tmp && tmp.products && tmp.products.length > 0)
$scope.people.push(tmp);
}
}

How to obtain objectId from a parse user?

When I print user, I get : {"objectId":"insertSomeValue"} as output. But I cannot obtain the value of that objectId and store it in a string variable. How do I obtain it?
I tried user.get("objectId") and user["objectId"] but they just return "No message provided" when fed to console.log. Do I have to fetch user before I can get its objectId?
var query = new Parse.Query("HelperRating");
var newProfiles = {};
var eachPromise = Parse.Promise.as();
eachPromise = eachPromise.then(function() {
return query.each(
function (helperRating) {
var user = helperRating.get("helper");
var userId = user.objectId; // How do I get this?
console.log(user);
console.log(user.get("objectId")); // I tried these but it prints "No message provided" instead
//console.log(user["objectId"]);
var newRating = helperRating.get("rating");
// Calculate without querying
if (newProfiles.hasOwnProperty(userId)) {
newProfiles[userId][0] = 10;
} else {
newProfiles[userId] = [];
newProfiles[userId].push(1);
}
return;
}
);
return eachPromise;
}).then(function(){
var promises = [];
for (var userId in newProfiles) {
if (newProfiles.hasOwnProperty(userId)) {
var query = new Parse.Query("UserProfile");
query.equalTo("owner", userId);
var promise = query.find().then(
function (results) {
// Do something
}
);
promises.push(promise);
}
}
return Parse.Promise.when(promises);
});

The objectId in the JS SDK is given by var userId = user.id

Saving Every new String in to an array in Local Storage

I'm trying to save every new string that i receive (result) from an input into an array in local storage, to use it later
$('.crearGpo').on('click',function() {
bootbox.prompt("Name of the Gr", function(result ,e) {
if(result != null && result !="" )
{
names = [];
names[0]= result;
localStorage["names"] = JSON.stringify(names);
var storedNames = JSON.parse(localStorage["names"]);
console.log(storedNames);
localStorage.setItem('name', result);
name = localStorage.getItem('name');
$('.top-card-grupos ul ').last().append("<li><button class=\"btn\" id=\""+name+"\">"+name+"</button></li>");
}
});
});
But is just saving the last string, not every string that i receive, any help would be great

You're creating a new array for each result, and not incrementing the array index each time you assign a value to it, meaning each value will be overwritten. Try:
names = []; //Array for all results
var count = 0; //Keep track of the number of results
if(result != null && result !="" )
{
names[count++]= result; //Store and increment counter
localStorage["names"] = JSON.stringify(names);
var storedNames = JSON.parse(localStorage["names"]);
console.log(storedNames);
localStorage.setItem('name', result);
name = localStorage.getItem('name');
$('.top-card-grupos ul ').last().append("<li><button class=\"btn\" id=\""+name+"\">"+name+"</button></li>");
}

You are creating a new array on every click. You should create it once and push values into it on every click instead.
Like this:
var names = []; // create the array once
$('.crearGpo').on('click', function() {
bootbox.prompt("Name of the Gr", function(result, e) {
if (result != null && result != "") {
names.push(result); //add the result to the names array
localStorage["names"] = JSON.stringify(names);
var storedNames = JSON.parse(localStorage["names"]);
console.log(storedNames);
localStorage.setItem('name', result);
name = localStorage.getItem('name');
$('.top-card-grupos ul ').last().append("<li><button class=\"btn\" id=\"" + name + "\">" + name + "</button></li>");
}
});
});