I’m making a desktop app with meteor/angular and electron. I’m currently storing the filepath to local images (thumbnails) in my mongo collection then i’m using fs to load the image on the server side. I have it working but its really slow - takes a few seconds to load around 20 thumbnails (around 200kb each).
I’d like someone to check my implementation and see if this is a bad approach and/or where it could be optimised.
So…
- I load the ‘job’ from a ‘job’ collection. This contains a ‘thumbUrl’ field.
- I pass the thumbUrl into a child component (named thumbnail)
- In the thumbnail component I call a meteor method to load the image:
MeteorObservable.call('readImage2', this.thumbUrl).subscribe((res) => {
this.imageSrc = "data:image/jpg;base64," + res;
}, (err) => {
console.log(err);
});
- Meteor method to load image asynchronously:
readImage(url) {
var Future = Npm.require('fibers/future');
var myFuture = new Future();
fs.readFile(String(url), function read(error, result) {
if(error){
myFuture.throw(error);
}else{
myFuture.return(new Buffer(result).toString('base64'));
}
});
return myFuture.wait();
}
This is for a desktop media management app for a visual effects studio which is why i’m loading everything from the local filesystem. I could also use gridFS but i’m uploading data from external applications through python (pymongo) and I couldn’t get that working with gridFS…
Or I host the images on a web server.
What would people recommend? Or how could i optimise my current code?