mirror of
https://github.com/R0m1k3/Socialflow.git
synced 2026-10-19 13:08:12 +02:00
Claude
9b66a6dc5a
Montage (étape 3) : - Nouvelle composition ReelVideo : sous-titres animés mot à mot (3 styles : Impact, Surligné, Épuré), logo, effet de fin et fondu, en React - Le service Python prépare l'image (recadrage, HDR, stabilisation, dernière image figée) et la piste son finale (/prepare-reel) ; Remotion compose - Reels d'images sur les mêmes composants, avec le vrai minutage de la voix - Police Montserrat embarquée (plus de dépendance à Google Fonts) - REEL_RENDERER=ffmpeg conserve le rendu FFmpeg, plus rapide, en secours - Script de pré-bundle réparé (échouait en silence : require en ESM) Interface (étape 4) : - Aperçu en direct avec @remotion/player, identique au rendu final ; la voix testée cale les sous-titres, sinon minutage estimé - Choix du style de sous-titres sur les 4 pages Reel - Vraie progression : étape réelle du rendu, échecs visibles 24 h avec leur cause ; fin de la barre simulée et du faux « publié avec succès » Outillage (étape 5) : - Tests vitest (minutage identique à Python, validation, sécurité) et pytest ; CI GitHub Actions (tsc, tests, build, ruff) - Captures d'écran, out.mp4 et scripts de test retirés de la racine Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_018Ze4bs7tpF1KGWUk6ZZSZ4
86 lines
2.8 KiB
TypeScript
86 lines
2.8 KiB
TypeScript
/**
|
|
* Rendu Remotion côté serveur, commun aux Reels vidéo et images : bundle mis
|
|
* en cache, réglages d'encodage des réseaux sociaux, progression.
|
|
*/
|
|
|
|
import os from "os";
|
|
import path from "path";
|
|
import { bundle } from "@remotion/bundler";
|
|
import { renderMedia, selectComposition } from "@remotion/renderer";
|
|
|
|
let bundleCache: Promise<string> | null = null;
|
|
|
|
/** Bundle des compositions, construit une fois par processus. */
|
|
export function getRemotionBundle(): Promise<string> {
|
|
if (!bundleCache) {
|
|
// process.cwd() = /app dans Docker, racine du projet en dev
|
|
const entryPoint = path.resolve(process.cwd(), "client/src/remotion/index.ts");
|
|
console.log("📦 [Remotion] Bundle de", entryPoint);
|
|
bundleCache = bundle({
|
|
entryPoint,
|
|
// Mêmes alias que Vite : les compositions importent @shared/*
|
|
webpackOverride: (config) => ({
|
|
...config,
|
|
resolve: {
|
|
...config.resolve,
|
|
alias: {
|
|
...(config.resolve?.alias ?? {}),
|
|
"@shared": path.resolve(process.cwd(), "shared"),
|
|
},
|
|
},
|
|
}),
|
|
}).catch((error) => {
|
|
bundleCache = null; // réessayer au prochain rendu
|
|
throw error;
|
|
});
|
|
}
|
|
return bundleCache;
|
|
}
|
|
|
|
/** Rendus en parallèle dans Chromium : par défaut la moitié des cœurs, 1 au minimum. */
|
|
function renderConcurrency(): number {
|
|
const configured = Number(process.env.RENDER_CONCURRENCY);
|
|
if (Number.isFinite(configured) && configured > 0) return Math.floor(configured);
|
|
return Math.max(1, Math.floor(os.cpus().length / 2));
|
|
}
|
|
|
|
export async function renderReelComposition(options: {
|
|
compositionId: "ReelVideo" | "ImageVideo";
|
|
inputProps: Record<string, unknown>;
|
|
outputLocation: string;
|
|
onProgress?: (ratio: number) => void;
|
|
}): Promise<void> {
|
|
const serveUrl = await getRemotionBundle();
|
|
const composition = await selectComposition({
|
|
serveUrl,
|
|
id: options.compositionId,
|
|
inputProps: options.inputProps,
|
|
});
|
|
|
|
const startedAt = Date.now();
|
|
await renderMedia({
|
|
composition,
|
|
serveUrl,
|
|
inputProps: options.inputProps,
|
|
outputLocation: options.outputLocation,
|
|
codec: "h264",
|
|
// Qualité visuelle élevée, conforme aux recommandations Instagram/TikTok
|
|
crf: 18,
|
|
x264Preset: "medium",
|
|
pixelFormat: "yuv420p",
|
|
colorSpace: "bt709",
|
|
audioCodec: "aac",
|
|
audioBitrate: "192k",
|
|
concurrency: renderConcurrency(),
|
|
onProgress: ({ progress }) => options.onProgress?.(progress),
|
|
// Une image lente (décodage vidéo sur une petite machine) ne doit pas faire échouer le rendu
|
|
timeoutInMilliseconds: 60_000,
|
|
onBrowserLog: (log) => {
|
|
if (log.type === "error") console.warn("⚠️ [Remotion] Navigateur :", log.text.slice(0, 300));
|
|
},
|
|
});
|
|
console.log(
|
|
`🎞️ [Remotion] ${options.compositionId} rendu en ${((Date.now() - startedAt) / 1000).toFixed(1)} s`,
|
|
);
|
|
}
|