Faster loading IMGUR previews; slightly slower triggering preview popup

This commit is contained in:
Mr. Stallion 2021-02-01 12:17:11 -06:00
parent eba896275b
commit 7043a9af89
3 changed files with 38 additions and 5 deletions

View File

@ -4,6 +4,8 @@
* Moved database queries to a web worker to gain more responsive UI
* Fixed Gelbooru, Instagram, and Twitter previews
* Fixed green names not showing up when 'show friends/bookmarks in a different colour' is selected
* Sped up Imgur previews
* Minor UI design adjustments for user names and badges
## 1.9.0

View File

@ -127,7 +127,7 @@
@Hook('mounted')
onMounted(): void {
async onMounted(): Promise<void> {
console.info('Mounted ImagePreview');
// tslint:disable-next-line:no-floating-promises
@ -176,6 +176,12 @@
const webview = this.getWebview();
// clear preview cache, particularly cookies
// setInterval(
// () => remote.webContents.fromId(webview.getWebContentsId()).session.clearStorageData({storages: ['cookies', 'indexdb']}),
// 5000
// );
webview.addEventListener(
'update-target-url', // 'did-navigate', // 'dom-ready',
(event: EventBusEvent) => {
@ -447,7 +453,7 @@
this.debugLog('ImagePreview: show.exec', url);
const due = ((url === this.exitUrl) && (this.exitInterval)) ? 0 : 100;
const due = ((url === this.exitUrl) && (this.exitInterval)) ? 0 : 200;
this.url = url;
this.domain = domain(url);

View File

@ -13,7 +13,9 @@ export class ImageUrlMutator {
private solvers: UrlSolver[] = [];
private static IMGUR_CLIENT_ID = 'd60e27140a73b2e';
private static readonly IMGUR_CLIENT_ID = 'd60e27140a73b2e';
private static readonly IMGUR_IMAGE_URL_REGEX = /^https?:\/\/i.imgur.com\/([a-zA-Z0-9]+)(\.[a-z0-9A-Z]+)(.*)$/;
private debug: boolean;
@ -122,7 +124,7 @@ export class ImageUrlMutator {
if (this.debug)
console.log('Imgur gallery', url, imageUrl, imageCount);
return `${imageUrl}?flist_gallery_image_count=${imageCount}`;
return this.getOptimizedImgurUrlFromUrl(`${imageUrl}?flist_gallery_image_count=${imageCount}`);
} catch (err) {
console.error('Imgur Gallery Failure', url, err);
@ -158,7 +160,7 @@ export class ImageUrlMutator {
if (this.debug)
console.log('Imgur album', url, imageUrl, imageCount);
return `${imageUrl}?flist_gallery_image_count=${imageCount}`;
return this.getOptimizedImgurUrlFromUrl(`${imageUrl}?flist_gallery_image_count=${imageCount}`);
} catch (err) {
console.error('Imgur Album Failure', url, err);
@ -197,7 +199,30 @@ export class ImageUrlMutator {
}
);
// Load large thumbnail instead of the full size picture when possible
this.add(ImageUrlMutator.IMGUR_IMAGE_URL_REGEX,
async(_url: string, match: RegExpMatchArray) => this.getOptimizedImgUrlFromMatch(match)
);
}
getOptimizedImgUrlFromMatch(match: RegExpMatchArray): string {
const imageId = match[1];
const ext = match[2];
const rest = match[3];
const finalExt = ((ext === '.gif') || (ext === '.gifv'))
? '.mp4'
: ext;
return `https://i.imgur.com/${imageId}${((imageId.length <= 7) && (finalExt !== '.mp4')) ? 'l' : ''}${finalExt}${rest}`;
}
getOptimizedImgurUrlFromUrl(url: string): string {
const m = url.match(ImageUrlMutator.IMGUR_IMAGE_URL_REGEX);
return m ? this.getOptimizedImgUrlFromMatch(m) : url;
}