⚡ Improve image loading by limiting them to 10 per requests

src/modules/webtoon/webtoon/models/responses/images-chunk.response.ts

@@ -0,0 +1,20 @@
+import {ApiProperty} from "@nestjs/swagger";
+
+export default class ImagesChunkResponse{
+    @ApiProperty()
+        images: string[];
+    @ApiProperty()
+        currentChunk: number;
+    @ApiProperty()
+        maxChunks: number;
+
+    constructor(
+        images: string[],
+        currentChunk: number,
+        maxChunks: number
+    ){
+        this.images = images;
+        this.currentChunk = currentChunk;
+        this.maxChunks = maxChunks;
+    }
+}

src/modules/webtoon/webtoon/webtoon-database.service.ts

@@ -13,11 +13,12 @@ import {MiscService} from "../../misc/misc.service";
 import ImageTypes from "./models/enums/image-types";
 import WebtoonResponse from "./models/responses/webtoon-response";
 import EpisodeChunkResponse from "./models/responses/episode-chunk.response";
+import ImagesChunkResponse from "./models/responses/images-chunk.response";
 
 @Injectable()
 export class WebtoonDatabaseService{
 
-    private readonly CHUNK_SIZE: number = 15;
+    private readonly CHUNK_SIZE: number = 10;
 
     constructor(
         private readonly prismaService: PrismaService,
@@ -315,15 +316,20 @@ export class WebtoonDatabaseService{
         return new EpisodeResponse(episode.title);
     }
 
-    async getEpisodeImages(episodeId: number): Promise<string[]>{
+    async getEpisodeImages(episodeId: number, chunkNumber: number): Promise<ImagesChunkResponse>{
         const episode: any = await this.prismaService.episodes.findFirst({
             where: {
                 id: episodeId
             }
         });
         if(!episode)
             throw new NotFoundException(`Episode with id ${episodeId} not found in database.`);
-        const images: any[] = await this.prismaService.episodeImages.findMany({
+        const imagesCount: number = await this.prismaService.episodeImages.count({
+            where: {
+                episode_id: episodeId
+            }
+        });
+        const dbImages: any[] = await this.prismaService.episodeImages.findMany({
             where: {
                 episode_id: episodeId
             },
@@ -332,12 +338,14 @@ export class WebtoonDatabaseService{
             },
             orderBy: {
                 number: "asc"
-            }
+            },
+            skip: (chunkNumber - 1) * this.CHUNK_SIZE,
+            take: this.CHUNK_SIZE
         });
-        const response: string[] = [];
-        for(const image of images)
-            response.push(this.miscService.bufferToDataURL(this.loadImage(image.image.sum)));
-        return response;
+        const images: string[] = [];
+        for(const image of dbImages)
+            images.push(this.miscService.bufferToDataURL(this.loadImage(image.image.sum)));
+        return new ImagesChunkResponse(images, chunkNumber, Math.ceil(imagesCount / this.CHUNK_SIZE));
     }
 
     private saveImage(image: Buffer): string{

src/modules/webtoon/webtoon/webtoon.controller.ts

@@ -9,6 +9,7 @@ import {Throttle} from "@nestjs/throttler";
 import WebtoonResponse from "./models/responses/webtoon-response";
 import EpisodeChunkResponse from "./models/responses/episode-chunk.response";
 import {ChunkNumberDto} from "./models/dto/chunk-number.dto";
+import ImagesChunkResponse from "./models/responses/images-chunk.response";
 
 @Controller("webtoons")
 @ApiTags("Webtoon")
@@ -48,8 +49,9 @@ export class WebtoonController{
     }
 
     @Get("episodes/:episodeId/images")
-    @ApiResponse({status: 200, description: "Returns a list of images for an episode", type: String, isArray: true})
-    async getEpisodeImages(@Param() episodeIdDto: EpisodeIdDto): Promise<string[]>{
-        return this.webtoonDatabaseService.getEpisodeImages(episodeIdDto.episodeId);
+    @ApiResponse({status: 200, description: "Returns a list of images for an episode", type: ImagesChunkResponse})
+    async getEpisodeImages(@Param() episodeIdDto: EpisodeIdDto, @Query() chunkNumberDto: ChunkNumberDto): Promise<ImagesChunkResponse>{
+        const chunk = chunkNumberDto.chunk ?? 1;
+        return this.webtoonDatabaseService.getEpisodeImages(episodeIdDto.episodeId, chunk);
     }
 }