Improve video loading speed and search responsiveness

Implement a background service to sync videos from Bunny.net every minute, optimize search debounce to 150ms, and cache videos for faster retrieval and instant search.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: d7424866-83d1-4486-a212-ac12b4c7becf
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/d7424866-83d1-4486-a212-ac12b4c7becf/F2OLMnq
This commit is contained in:
sebastjanartic
2025-08-28 17:05:27 +00:00
parent 5d36579584
commit b03df1c422
5 changed files with 147 additions and 45 deletions
+16 -44
View File
@@ -8,6 +8,7 @@ import {
} from "@shared/schema";
import { randomUUID } from "crypto";
import { BunnyService } from "./bunny";
import { videoSyncService } from "./videoSync";
import { db } from "./db";
import { eq, desc, asc, like, or, sql, and } from "drizzle-orm";
import bcrypt from "bcryptjs";
@@ -645,53 +646,24 @@ class BunnyStorage implements IStorage {
}
async getVideos(limit = 20, offset = 0, search?: string): Promise<Video[]> {
try {
console.log(`Fetching videos: limit=${limit}, offset=${offset}, search=${search}`);
// For simple pagination, get a larger batch and slice on our side
// This is more reliable than complex page calculations
const batchSize = 100; // Get more videos to handle pagination properly
const page = Math.floor(offset / batchSize) + 1;
const { videos } = await this.bunnyService.getVideos(page, batchSize);
console.log(`Bunny API returned ${videos.length} videos`);
// Apply client-side filtering
let filteredVideos = videos;
// Filter by search
if (search) {
const searchLower = search.toLowerCase();
filteredVideos = filteredVideos.filter(video =>
video.title.toLowerCase().includes(searchLower) ||
(video.description && video.description.toLowerCase().includes(searchLower))
);
console.log(`After search filtering: ${filteredVideos.length} videos`);
}
// Apply cached view counts
filteredVideos.forEach(video => {
if (this.viewsCache.has(video.id)) {
video.views += this.viewsCache.get(video.id)!;
}
});
// Simple offset/limit slicing
const startIndex = offset % batchSize;
const endIndex = startIndex + limit;
const result = filteredVideos.slice(startIndex, endIndex);
console.log(`Returning ${result.length} videos (slice ${startIndex}-${endIndex} from ${filteredVideos.length})`);
return result;
} catch (error) {
console.error('Error fetching videos from Bunny:', error);
// Fallback to empty array on error
return [];
}
console.log(`Fetching videos from cache: limit=${limit}, offset=${offset}, search=${search}`);
const result = videoSyncService.getVideos(limit, offset, search);
console.log(`Returning ${result.videos.length} videos from cache (age: ${result.cacheAge}ms)`);
return result.videos;
}
async getVideo(id: string): Promise<Video | undefined> {
// Try cache first for faster loading
const cachedVideo = videoSyncService.getVideos(100, 0).videos.find(v => v.id === id);
if (cachedVideo) {
// Apply cached view counts
if (this.viewsCache.has(cachedVideo.id)) {
cachedVideo.views += this.viewsCache.get(cachedVideo.id)!;
}
return cachedVideo;
}
// Fallback to direct API call
try {
const video = await this.bunnyService.getVideo(id);
if (!video) return undefined;