I have large amount of data that i want insert it into indexedDB database.
The size of data about 5MB.
And more than 77,000 row.
And i converted the database to "all.js" file like this:-
const AllData = [
{ id: 1, en: "10th", ar: "arabic word" },
{ id: 2, en: "1st", ar: "arabic word" },
{ id: 3, en: "2nd", ar: "arabic word" },
{ id: 4, en: "3rd", ar: "arabic word" },
{ id: 5, en: "4th", ar: "arabic word" },
{ id: 6, en: "5th", ar: "arabic word" },
{ id: 7, en: "6th", ar: "arabic word" },
{ id: 8, en: "7th", ar: "arabic word" },
{ id: 9, en: "8th", ar: "arabic word" },
to about 77,000
];
and my code in HTML and JavaScript
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="all.js" type="text/javascript"></script>
<script type="text/javascript">
/*
var custom = [
{"id":1 ,"name":"hussein","email":"[email protected]"},
{"id":2 ,"name":"ali","email":"[email protected]"}
];
*/
var db;
var request = window.indexedDB.open("YesData13", 1);
request.onerror = function(event) {
alert("Why didn't you allow my web app to use IndexedDB?!");
};
request.onsuccess = function(event) {
db = event.target.result;
/*
var transaction = db.transaction(["data"], "readwrite");
transaction.oncomplete = function(event) {
alert("All done!");
};
transaction.onerror = function(event) {
// Don't forget to handle errors!
};
var objectStore = transaction.objectStore("data");
for (var i in AllData) {
var request = objectStore.add(AllData[i]);
request.onsuccess = function(event) {
// event.target.result == customerData[i].ssn;
};
}
*/
};
request.onupgradeneeded = function(event) {
var db = event.target.result;
var objectStore = db.createObjectStore("data", { keyPath: "id" });
//objectStore.createIndex("en","en",{unique:true});
//objectStore.createIndex("ar","ar",{unique:false});
for (var i in AllData){
objectStore.put(AllData[i])
}
};
/*
for (var i in AllData) {
var request = objectStore.add(AllData[i]);
request.onsuccess = function(event) {
// event.target.result == customerData[i].ssn;
};
}
*/
function read() {
var transaction = db.transaction(["data"]);
var objectStore = transaction.objectStore("data");
var request = objectStore.get(25001);
request.onerror = function(event) {
alert("Unable to retrieve daa from database!");
};
request.onsuccess = function(event) {
// Do something with the request.result!
if(request.result) {
alert("id: " + request.result.id + ", English: " + request.result.en + ", arabic: " + request.result.ar);
} else {
alert("Kenny couldn't be found in your database!");
}
};
}
</script>
</head>
Click here
The code above work well in firefox and google chrome, and all of the rows inserted. but when try it in firefox os simulator it no working, and when try to reduce the rows to 25,000 it work fine.
and i try to split it into files about 25000 in each file,only first 25,000 added, but after 25,000 not added
From my own experiments with indexedDB on firefox os, it seems like the simulator imposes a fairly small limit on the amount of data you can store with indexedDB. I tried writing a script to add a bunch of random data to a single database and the simulator didn't give me an error but it stopped allowing me to add data after about 12,000 entries. However if I tried to create a new database with the simulator it gave me an error saying quota exceeded.
However when I ran this all on the phone, it just keeps going and going, I suspect the simulator is just not representative of the actual device since firefox apps supposedly don't impose an indexedDB limit. So your app should work on a device if you have on available to test.