Merge pull request #41 from ifl0w/enhance-history-performance

Enhance history performance

randomwallpaper@iflow.space/elements.js

@@ -149,7 +149,12 @@ var HistoryElement = new Lang.Class({
 				}
 			}
 		})
-	}
+	},
+
+	setIndex: function(index) {
+		this.prefixLabel.set_text(String(index));
+	},
+
 });
 
 var CurrentImageElement = new Lang.Class({
@@ -241,7 +246,11 @@ var StatusElement = new Lang.Class({
 			time: 1,
 			transition: 'easeInOutSine',
 			onComplete: function () {
-				Tweener.addTween(_this, _this.loadingTweenOut);
+				try {
+					Tweener.addTween(_this, _this.loadingTweenOut);
+				} catch (e) {
+					// swollow (not really important)
+				}
 			}
 		};
 
@@ -251,7 +260,11 @@ var StatusElement = new Lang.Class({
 			transition: 'easeInOutSine',
 			onComplete: function () {
 				if (_this.isLoading) {
-					Tweener.addTween(_this, _this.loadingTweenIn);
+					try {
+						Tweener.addTween(_this, _this.loadingTweenIn);
+					} catch (e) {
+						// swollow (not really important)
+					}
 				} else {
 					return false;
 				}
@@ -278,6 +291,13 @@ var HistorySection = new Lang.Class({
 	Name: 'HistorySection',
 	Extends: PopupMenu.PopupMenuSection,
 
+	/**
+	 * Cache HistoryElements for performance of long histories.
+	 */
+	_historySectionCache: {},
+
+	_historyCache: [],
+
 	_init: function () {
 		this.parent();
 
@@ -289,5 +309,63 @@ var HistorySection = new Lang.Class({
 		this.actor.add_actor(this.box);
 	},
 
+	updateList: function(history, onEnter, onLeave, onSelect) {
+		if (this._historyCache.length <= 1) {
+			this.removeAll(); // remove empty history element
+		}
+
+		let existingHistoryElements = [];
+
+		for (let i = 1; i < history.length; i++) {
+			let historyID = history[i].id;
+			let tmp;
+
+			if (!(historyID in this._historySectionCache)) {
+				tmp = new HistoryElement(history[i], i);
+
+				tmp.actor.connect('key-focus-in', onEnter);
+				tmp.actor.connect('key-focus-out', onLeave);
+				tmp.actor.connect('enter-event', onEnter);
+
+				tmp.connect('activate', onSelect);
+				this._historySectionCache[historyID] = tmp;
+
+				this.addMenuItem(tmp, i-1);
+			} else {
+				tmp = this._historySectionCache[historyID];
+				tmp.setIndex(i);
+			}
+
+			existingHistoryElements.push(historyID);
+		}
+
+		this._cleanupHistoryCache(existingHistoryElements);
+		this._historyCache = history;
+	},
+
+	_cleanupHistoryCache: function(existingIDs) {
+		let destroyIDs = Object.keys(this._historySectionCache).filter((i) => existingIDs.indexOf(i) === -1);
+
+		destroyIDs.map(id => {
+			this._historySectionCache[id].destroy();
+			delete this._historySectionCache[id];
+		});
+	},
+
+	clear: function() {
+		this._cleanupHistoryCache([]);
+		this.removeAll();
+		this.addMenuItem(
+			new PopupMenu.PopupMenuItem('No recent wallpaper ...', {
+				activate: false,
+				hover: false,
+				style_class: 'rwg-recent-lable',
+				can_focus: false
+			})
+		);
+
+		this._historyCache = [];
+	},
+
 });
 

randomwallpaper@iflow.space/extension.js

@@ -184,8 +184,6 @@ var RandomWallpaperEntry = new Lang.Class({
 		wallpaperController.update();
 		this.setCurrentBackgroundElement();
 
-		this.historySection.removeAll();
-
 		let historyController = wallpaperController.getHistoryController();
 		let history = historyController.history;
 
@@ -194,19 +192,6 @@ var RandomWallpaperEntry = new Lang.Class({
 			return;
 		}
 
-		for (let i = 1; i < history.length; i++) {
-			let historyid = history[i].id;
-			let tmp = new CustomElements.HistoryElement(history[i], i);
-
-			tmp.actor.connect('key-focus-in', onEnter);
-			tmp.actor.connect('key-focus-out', onLeave);
-			tmp.actor.connect('enter-event', onEnter);
-
-			tmp.connect('activate', onSelect);
-
-			this.historySection.addMenuItem(tmp);
-		}
-
 		function onLeave(actor) {
 			wallpaperController.resetWallpaper();
 		}
@@ -219,18 +204,11 @@ var RandomWallpaperEntry = new Lang.Class({
 			wallpaperController.setWallpaper(actor.historyEntry.id);
 		}
 
+		this.historySection.updateList(history, onEnter, onLeave, onSelect);
 	},
 
 	clearHistoryList: function () {
-		this.historySection.removeAll();
-
-		let empty = new PopupMenu.PopupMenuItem('No recent wallpaper ...', {
-			activate: false,
-			hover: false,
-			style_class: 'rwg-recent-lable',
-			can_focus: false
-		});
-		this.historySection.addMenuItem(empty);
+		this.historySection.clear();
 	},
 
 });

randomwallpaper@iflow.space/metadata.json

@@ -4,13 +4,14 @@
     "3.22",
     "3.24",
     "3.26",
-    "3.28"
+    "3.28",
+    "3.30"
   ],
   "uuid": "randomwallpaper@iflow.space",
   "settings-schema": "org.gnome.shell.extensions.space.iflow.randomwallpaper",
   "name": "Random Wallpaper",
   "description": "Fetches a random wallpaper from an online source and sets it as desktop background. \nThe desktop background can be updated periodically or manually.",
-  "version": 11,
-  "semantic-version": "2.2.2",
+  "version": 12,
+  "semantic-version": "2.3.0",
   "url": "https://github.com/ifl0w/RandomWallpaperGnome3"
 }

randomwallpaper@iflow.space/stylesheet.css

@@ -32,7 +32,6 @@
 }
 
 .rwg-recent-lable {
-    width: 100%;
     font-size: 90%;
     text-align: left;
     border: 0;