ChoChoX/suwayomi-material-you-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add prioritization to image requests (#671)

Browse Source 
In the reader the preloaded page requests were triggered before the actual page got rendered and thus, the image request of the rendered page had to wait for all the preloaded images to finish
This commit is contained in:
schroda
2024-03-24 19:08:36 +01:00
committed by GitHub
parent 34aeac9c33
commit 06b2bca340
4 changed files with 125 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/lib/requests/RequestManager.ts
View File

@@ -27,7 +27,6 @@ import {
} from '@apollo/client';
import { OperationVariables } from '@apollo/client/core';
import { useEffect, useMemo, useRef, useState } from 'react';
import pLimit from 'p-limit';
import { IRestClient, RestClient } from '@/lib/requests/client/RestClient.ts';
import { GraphQLClient } from '@/lib/requests/client/GraphQLClient.ts';
import {
@@ -257,6 +256,7 @@ import { RESET_WEBUI_UPDATE_STATUS, UPDATE_WEBUI } from '@/lib/graphql/mutations
import { WEBUI_UPDATE_SUBSCRIPTION } from '@/lib/graphql/subscriptions/ServerInfoSubscription.ts';
import { GET_DOWNLOAD_STATUS } from '@/lib/graphql/queries/DownloaderQuery.ts';
import { defaultPromiseErrorHandler } from '@/util/defaultPromiseErrorHandler.ts';
import { Queue, QueuePriority } from '@/lib/Queue.ts';
enum GQLMethod {
QUERY = 'QUERY',
@@ -366,7 +366,7 @@ export class RequestManager {
private readonly cache = new CustomCache();
private readonly imageQueue = pLimit(5);
private readonly imageQueue = new Queue(5);
public getClient(): IRestClient {
return this.restClient;
@@ -768,20 +768,23 @@ export class RequestManager {
* img.src = imageUrl;
*
*/
public requestImage(url: string): { response: Promise<string> } & AbortableRequest {
public requestImage(url: string, priority?: QueuePriority): { response: Promise<string> } & AbortableRequest {
const { abortRequest, signal } = this.createAbortController();
const response = this.imageQueue(() =>
this.restClient
.fetcher(url, {
checkResponseIsJson: false,
config: {
signal,
// @ts-ignore - typing has not been updated yet
priority: 'low',
},
})
.then((data) => data.blob())
.then((data) => URL.createObjectURL(data)),
const response = this.imageQueue.enqueue(
url,
() =>
this.restClient
.fetcher(url, {
checkResponseIsJson: false,
config: {
signal,
// @ts-ignore - typing has not been updated yet
priority: 'low',
},
})
.then((data) => data.blob())
.then((data) => URL.createObjectURL(data)),
priority,
);
return { response, abortRequest };