Don't needlessly reload resources

ElectronClient/app/gui/NoteText.jsx

@@ -110,8 +110,6 @@ class NoteTextComponent extends React.Component {
 	}
 
 	async reloadNote(props) {
-		this.mdToHtml_ = null;
-
 		const noteId = props.noteId;
 		this.lastLoadedNoteId_ = noteId;
 		const note = noteId ? await Note.load(noteId) : null;
@@ -124,6 +122,8 @@ class NoteTextComponent extends React.Component {
 			if (!Object.getOwnPropertyNames(diff).length) return;
 		}
 
+		this.mdToHtml_ = null;
+
 		// If we are loading nothing (noteId == null), make sure to
 		// set webviewReady to false too because the webview component
 		// is going to be removed in render().

ReactNativeClient/lib/MdToHtml.js

@@ -2,6 +2,7 @@ const MarkdownIt = require('markdown-it');
 const Entities = require('html-entities').AllHtmlEntities;
 const htmlentities = (new Entities()).encode;
 const { Resource } = require('lib/models/resource.js');
+const ModelCache = require('lib/ModelCache');
 const { shim } = require('lib/shim.js');
 const md5 = require('md5');
 
@@ -14,6 +15,7 @@ class MdToHtml {
 		this.loadedResources_ = {};
 		this.cachedContent_ = null;
 		this.cachedContentKey_ = null;
+		this.modelCache_ = new ModelCache();
 
 		// Must include last "/"
 		this.resourceBaseUrl_ = ('resourceBaseUrl' in options) ? options.resourceBaseUrl : null;
@@ -80,10 +82,11 @@ class MdToHtml {
 			this.loadedResources_[id] = {};
 
 			const resource = await Resource.load(id);
+			//const resource = await this.modelCache_.load(Resource, id);
 
 			if (!resource) {
 				// Can happen for example if an image is attached to a note, but the resource hasn't
-				// been download from the sync target yet.
+				// been downloaded from the sync target yet.
 				console.warn('Cannot load resource: ' + id);
 				return;
 			}

ReactNativeClient/lib/ModelCache.js

@@ -0,0 +1,39 @@
+class ModelCache {
+
+	constructor(maxSize) {
+		this.cache_ = [];
+		this.maxSize_ = maxSize;
+	}
+
+	fromCache(ModelClass, id) {
+		for (let i = 0; i < this.cache_.length; i++) {
+			const c = this.cache_[i];
+			if (c.id === id && c.modelType === ModelClass.modelType()) return c
+		}
+		return null;
+	}
+
+	cache(ModelClass, id, model) {
+		if (this.fromCache(ModelClass, model.id)) return;
+		this.cache_.push({
+			id: id,
+			model: model,
+			modelType: ModelClass.modelType(),
+		});
+
+		if (this.cache_.length > this.maxSize_) {
+			this.cache_.splice(0, 1);
+		}
+	}
+
+	async load(ModelClass, id) {
+		const cached = this.fromCache(ModelClass, id);
+		if (cached) return cached.model;
+		const output = await ModelClass.load(id);
+		this.cache(ModelClass, id, output);
+		return output;
+	}
+
+}
+
+module.exports = ModelCache;