I have a Grails application running with a very heavy back-end data.Every selection made in the view of the application loads a new JSON file.I am new to developing web applications and I assume that this JSON file which is getting loaded is being loaded into the browser's cache memory(It's just a guess and I could be wrong too.Do correct me in that case).
Why I came to this conclusion is because, after playing around with the application for some time and making different selections in the view, I observed that the browser crashes(In my case, it stops responding) after the cumulative size of the JSON files loaded into the cache memory(assuming it to be cache memory) exceeds 200MB.
If the location where the files are being loaded is actually the cache memory(or be it any other storage location),I would like to delete the files loaded previously once a new selection is made.
If this solution is not practical enough then, feel free to suggest any method that will solve my problem.
Any help or suggestion will be appreciated.
You can use the browser's sessionStorage (only accessible within a session inside a tab) or localStorage (accessible across multiple sessions across multiple tabs) using JavaScript.
These can store string data in the form of key, value pairs. So you can fetch the JSON data from a file and convert it into a string using JSON.stringify() and get the data back from the browser's storage from string to JSON using JSON.parse().
Assuming you're using sessionStorage, you can check how many JSON strings you have stored using sessionStorage.length. You can set a limit in your code such that if your limit is reached, you can delete the oldest one using sessionStorage.removeItem(key).
Related
I have an Angular app where I am loading some static data from a file under assets.
urlDataFile = './assets/data.json';
data: any = null;
constructor(
private _http: HttpClient
) {
this.loadData().subscribe((res) => {
this.data = res;
});
}
private loadData() {
return this._http.get(this.urlDataFile);
}
This works absolutely fine for me for truly static data.
When I build my app for distribution, the data gets packaged into the app.
However, once deployed, I want to be able to publish an updated data file - just (manually) updating a single file into the deployment location.
In an ideal world, I would like to develop with a dummy or sample data file (to be held in source control etc.), to exclude that file from deployment, and once deployed, to push a new data file into the deployed app.
What is the standard convention for accomplishing this?
What you have there should work just fine?
There's two ways of doing JSON stuff; one is as you're doing and dynamically request the file, the other is to literally import dataJson from './assets/data.json' in your file directly.
The second option, I was surprised to find out, actually gets compiled into your code so that the json values are literally part of your, e.g. main.js, app files.
So, yours is good for not being a part of your app, it will request that file on every app load (or whenever you tell it to).
Means it will load your local debug file because that's what it's got, and then the prod file when deployed; it's just requesting a file, after all.
What I foresee you needing to contend with is two things:
Live updates
Unless your app keeps requesting the file periodically, it won't magically get new data from any new file that you push. Until/unless someone F5's or freshly browses to the site, you otherwise won't get that new data.
Caching
Even if you occasionally check that file for new data, you need to handle the fact browsers try to be nice and cache files for you to make things quicker. I guess this would be handled with various cache headers and things that I know exist but have never had to touch in detail myself.
Otherwise, the browser will just return the old, cached data.json instead of actually going and retrieving the new one.
After that, though, I can't see anything wrong with doing what you're doing.
Slap your file request in an interval and put no-cache headers on the file itself and... good enough, probably?
You are already following the right convention, which is to call the data with the HTTP client, not importing the file.
Now you can just gitignore the file, and replace it in a deployment step or whatever suits you.
Just watch for caching. You might want to add a dummy query string with some value based on a time or something to ensure the server sends a new file, based on how often you might update this file.
I'm currently thinking of a concept for a react-native app where people add events over a period of time like a diary/log. These events need to be exported and for security and privacy reasons I don't want to use a database. I've read you can use JSON files as a storage method, too.
How can I store data from the app to a JSON file and load the data from the JSON file back in the app? Don't need any code, helpful articles or webpages are appreciated
Assuming that you already have all the app data into a json, its rather simple.
Decide where to store the appdata.json, lets call it APP_DATA_PATH
Find a library to read/write files (I've only used expo-file-system)
On app boot, check if APP_DATA_PATH exists, if it does read the file and load into app, if not assume its a new user
Whenever app data changes, write the changes to APP_DATA_PATH
I'm trying to make a centralized POS system, was wondering what are my options to save data locally to the device to save data connection rather than making the POS online-only app.
I already have the APIs from Laravel being pulled into JSON and basically need to find a way to store data, as well as to convert image_location into blob or something Flutter can do, (is Image.memory viable?). The APIs will only be triggered on app startup if the device is connected to the internet.
You can use a plugin called sqflite which works for ios and android.
and also SharedPreference plugin which stores data in key-value format.
you can search for plugins and there example on https://pub.dev/
I want to synchronize data from a nosql database, have it emit json, and when there is a change and the app is online, have the app pull the changes and update them.
My react-native app uses a few language-specific json files loading them dynamically into javascript objects and then using them as my "database". One file for rendering content, one for the app texts, and one for the styles.
When the user changes the language a different directory is used with the same set of json filenames. This is done via the index.js in that directory and loaded into redux.
Must I change the way my app works, and use a NoSQL/real database directly in the app? So that I can use a solution like this one: synchronizing pouchDB with json data
(that solution is for working if I understand correctly in the exact opposite direction. The app is working with a database and synchronizing with json received from the web)
Or can I update the data in an external (preferably) NoSQL (pouchDB or couchDB) or relational database, and somehow "synchronize" it with the json files, when the app is connected to the web and have it update?
Is there a known method or framework to accomplish this with react-native?
Is it possible to obtain file handles in HTML5 and store it as a blob in webDB for upload later?
(Upload selected images when the 3G network is available again, without re-selecting the files.)
The HTML5 will be loaded from the local client device and
action="http://.../insert.jsp"
be used to upload the files to the server.
Any help or ideas will be very useful.
C-:
Any File object can be converted to an URL.
It is simple to do by using object URLs as described by:
https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications
(I still have to confirm that the URLs remain valid across sessions.)
And it does not remain valid across sessions in Chrome!