Preload previous/next chapter in reader

src/modules/reader/services/ReaderControls.ts

@@ -236,6 +236,8 @@ export class ReaderControls {
                                 prevState,
                                 chapterToOpen.sourceOrder,
                                 scrollIntoView,
+                                isPreviousChapter ? false : undefined,
+                                !isPreviousChapter ? false : undefined,
                             ),
                         );
 
@@ -448,8 +450,15 @@ export class ReaderControls {
         endReached?: boolean,
     ) => void {
         const { currentPageIndex, setCurrentPageIndex } = userReaderStatePagesContext();
-        const { chapterForDuplicatesHandling, currentChapter, nextChapter, mangaChapters } =
-            useReaderStateChaptersContext();
+        const {
+            chapterForDuplicatesHandling,
+            currentChapter,
+            previousChapter,
+            nextChapter,
+            mangaChapters,
+            visibleChapters,
+            setReaderStateChapters,
+        } = useReaderStateChaptersContext();
         const updateChapter = ReaderService.useUpdateChapter();
         const { shouldSkipDupChapters } = ReaderService.useSettings();
         const {
@@ -470,13 +479,28 @@ export class ReaderControls {
 
         return useCallback(
             (pageIndex, debounceChapterUpdate = true, endReached = false) => {
+                if (pageIndex === currentPageIndex) {
+                    return;
+                }
+
                 setCurrentPageIndex(pageIndex);
 
                 if (!currentChapter) {
                     return;
                 }
 
+                const direction = currentPageIndex > pageIndex ? DirectionOffset.PREVIOUS : DirectionOffset.NEXT;
+
                 ReaderService.downloadAhead(currentChapter, nextChapter, nextChapters, pageIndex, downloadAheadLimit);
+                ReaderService.preloadChapter(
+                    pageIndex,
+                    currentChapter.pageCount,
+                    direction === DirectionOffset.NEXT ? nextChapter : previousChapter,
+                    visibleChapters.lastLeadingChapterSourceOrder,
+                    visibleChapters.lastTrailingChapterSourceOrder,
+                    setReaderStateChapters,
+                    direction,
+                );
 
                 const handleCurrentPageIndexChange = () => {
                     const currentChapterUpToDate = getReaderChapterFromCache(currentChapter.id);
@@ -501,7 +525,15 @@ export class ReaderControls {
 
                 handleCurrentPageIndexChange();
             },
-            [currentChapter?.id, nextChapter?.id, nextChapters, currentPageIndex, downloadAheadLimit],
+            [
+                currentChapter?.id,
+                previousChapter?.id,
+                nextChapter?.id,
+                nextChapters,
+                currentPageIndex,
+                downloadAheadLimit,
+                visibleChapters,
+            ],
         );
     }
 

src/modules/reader/services/ReaderService.ts

@@ -18,6 +18,7 @@ import {
     ReaderExitMode,
     ReaderOverlayMode,
     ReaderResumeMode,
+    ReaderStateChapters,
     ReadingDirection,
     ReadingMode,
 } from '@/modules/reader/types/Reader.types.ts';
@@ -44,6 +45,8 @@ import {
     getChapterIdsForDownloadAhead,
     getChapterIdsToDeleteForChapterUpdate,
     getReaderChapterFromCache,
+    isInDownloadAheadRange,
+    updateReaderStateVisibleChapters,
 } from '@/modules/reader/utils/Reader.utils.ts';
 import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
 import { Queue } from '@/lib/Queue.ts';
@@ -118,6 +121,42 @@ export class ReaderService {
         });
     }
 
+    static preloadChapter(
+        pageIndex: number,
+        pageCount: number,
+        chapter: TChapterReader | undefined | null,
+        lastLeadingChapterSourceOrder: number,
+        lastTrailingChapterSourceOrder: number,
+        setReaderStateChapters: ReaderStateChapters['setReaderStateChapters'],
+        direction: DirectionOffset,
+    ): void {
+        if (!chapter) {
+            return;
+        }
+
+        const isPreviousChapter = direction === DirectionOffset.PREVIOUS;
+        const isNextChapter = direction === DirectionOffset.NEXT;
+
+        const isAlreadyPreloaded =
+            (isPreviousChapter && lastLeadingChapterSourceOrder <= chapter.sourceOrder) ||
+            (isNextChapter && lastTrailingChapterSourceOrder >= chapter.sourceOrder);
+        const shouldPreload = !isAlreadyPreloaded && isInDownloadAheadRange(pageIndex, pageCount, direction);
+        if (!shouldPreload) {
+            return;
+        }
+
+        setReaderStateChapters((state) =>
+            updateReaderStateVisibleChapters(
+                isPreviousChapter,
+                state,
+                chapter.sourceOrder,
+                false,
+                isPreviousChapter ? true : undefined,
+                isNextChapter ? true : undefined,
+            ),
+        );
+    }
+
     static useUpdateChapter(): (patch: UpdateChapterPatchInput) => void {
         const { manga } = useReaderStateMangaContext();
         const { chapterForDuplicatesHandling, currentChapter, mangaChapters } = useReaderStateChaptersContext();