使い方
- インストールコマンドをコピーし、自分の環境へ導入する前にソースを確認します。
- 必要なツール、認証情報、対応環境を原文で確認します。
- 入力と成果物を指定し、出力を資料と照合します。
npx skills add https://github.com/mattpocock/course-video-manager --skill optimize-loader開始前の確認
- 導入にはモデル契約、API枠、ファイルへのアクセス許可は含まれません。
- スター数や導入数は活動の指標であり、独立した品質・安全性試験ではありません。
リポジトリの原文
見出し、例、コード、表、リンク、参照画像を含む原文を表示しています。
Optimize Loader
Anti-patterns to catch
1. Re-fetching data the caller already has
If a loader fetches a record (e.g. getVideoWithClipsById) and then passes just the ID to a downstream function that re-fetches the same record internally — change the downstream function's signature to accept the already-fetched object.
typescript
// BAD — getNextVideoId internally calls getVideoWithClipsById again
const video = yield * db.getVideoWithClipsById(videoId);
const nextId = yield * db.getNextVideoId(videoId);
// GOOD — pass the already-fetched video
const video = yield * db.getVideoWithClipsById(videoId);
const nextId = yield * db.getNextVideoId(video);When refactoring signatures, type the parameter as the minimal shape needed, not the full return type:
typescript
// Accept only what the function actually reads
function* (currentVideo: {
id: string;
lesson: {
id: string;
videos: Array<{ id: string; path: string }>;
section: { repoVersion: { repo: { id: string } } };
} | null;
})2. Over-fetching nested relations
If a function only needs IDs and paths for navigation but loads full nested trees including clips, transcripts, etc. — create a slim query variant.
typescript
// BAD — loads clips, chapters, thumbnails etc. just to get video IDs
const course = yield * getCourseWithSectionsById(repoId);
// GOOD — dedicated lightweight query
const course = yield * getCourseNavigationData(repoId);Slim query checklist:
columns: { id: true, path: true }— only select needed columns on leaf relationslimit: 1on relations like versions where you only need the latest- Omit
with:for relations you don't traverse (clips, chapters, thumbnails) - Keep
where:filters (e.g.archived = false) andorderByintact
3. Sequential independent queries
If a loader runs multiple independent DB calls sequentially, parallelize with Effect.all:
typescript
// BAD — sequential, total time = sum of both
const nextVideoId = yield * db.getNextVideoId(video);
const previousVideoId = yield * db.getPreviousVideoId(video);
// GOOD — parallel, total time = max of both
const [nextVideoId, previousVideoId] =
yield * Effect.all([db.getNextVideoId(video), db.getPreviousVideoId(video)]);Dependency injection pattern
When adding a new query (like getCourseNavigationData) that lives in course operations but is used by video operations:
- Add the query to
db-course-operations.server.tsand export it - Declare the cross-domain dependency in
VideoOperationsService'seffectblock viayield* CourseOperationsService - The Effect Layer system resolves cross-domain dependencies automatically
