Une expérience Netflix pour vos propres vidéos

Je télécharge des séries libres de droit sur Internet Archive, la bibliothèque qui héberge aussi la Wayback Machine. Pour les partager sans charger leurs serveurs, je passe par le torrent : un VPS à 5 € par mois, le client minimaliste Transmission, et un serveur SFTP pour récupérer les fichiers. Ce soir-là chez Algolia, j'ai raconté comment cette routine m'a mené à construire netrise, une expérience Netflix pour mes propres fichiers vidéo.

Le problème : une arborescence de fichiers

Mon parcours tenait en 4 étapes. Je lance le torrent d'une série, par exemple Les Aventures de Superman de 1952, depuis l'interface web de Transmission. Le serveur la télécharge puis la partage. Je la rapatrie ensuite sur mon ordinateur avec un client SFTP comme FileZilla, puis je la regarde dans VLC.

C'est la 3e étape qui me fatiguait. Naviguer dans une arborescence de dossiers pour choisir quoi regarder avec un ami, ça ne donne envie de rien. Je voulais remplacer cet écran par une interface qui donne envie, celle que les designers de Netflix ont déjà pensée.

Les besoins, réduits à un MVP

Je travaille seul sur ce projet, donc j'ai découpé le minimum utile, sur une stack 100 % JavaScript.

Regarder partout. L'idéal serait mobile, tablette, ordinateur et télé. Pour le MVP, un serveur distant centralise les fichiers et l'app y accède en SFTP.
Retrouver l'expérience Netflix. Affiches, synopsis, acteurs, notes : Allociné n'a pas d'API, mais TMDB en expose une gratuite. C'est le Wikipédia des films et des séries, que chacun peut enrichir. L'interface est une single page application, pour une navigation fluide.
Lire en streaming ou hors ligne. Je ne voulais pas recoder un lecteur avec ses sous-titres, alors je garde VLC. Je ne le savais pas avant ce projet : VLC accepte une adresse sftp:// suivie du chemin du fichier, et lit la vidéo en streaming sans la télécharger. Pour le hors ligne, il faut stocker plusieurs Go sur le disque.

1re tentative : un site web

J'ai commencé par un site, avec SvelteKit (Vite, Svelte et Node.js) et la bibliothèque ssh2-sftp-client pour parler au serveur. L'architecture est simple : le serveur distant, le site, et l'API de TMDB pour les illustrations.

2 obstacles m'ont arrêté.

Lancer VLC depuis un navigateur. Sur un serveur local, je peux lancer un processus VLC avec spawn. Mais ça ne se distribue pas, et je ne voulais pas écrire mon propre lecteur dès le départ.

Le stockage du navigateur. Netflix ne propose pas le téléchargement sur le web, YouTube Premium si. En fouillant, j'ai vu que YouTube range les morceaux de vidéo dans IndexedDB. Le navigateur plafonne ce stockage, et navigator.storage.estimate() donne la limite : chez moi, Chrome annonçait environ 74 Go. L'API File System Access va plus loin et donne au site l'accès au disque. Mais seul Chrome la prend en charge entièrement, et elle demande une permission à l'arrivée. Cette friction, je n'en voulais pas.

J'ai donc choisi une app desktop pour le MVP. Le multiplateforme est sorti du périmètre.

Electron ou Tauri

Electron est mature : VS Code et Spotify l'utilisent. Son défaut, c'est le poids de l'app, qui embarque tout dès le départ.
Tauri est écrit en Rust et expose une API JavaScript. Mais cette API est forcément limitée, car l'équipe doit tout recoder de ce que Node.js offre déjà. Je n'y ai rien trouvé pour le SFTP, et son showcase ne montrait pas encore d'app mature.

Je voulais avoir vite mon interface, alors j'ai pris Electron. L'architecture ne change pas : Electron remplace simplement le site.

Sous le capot

La stack. Electron fait tourner Node.js et affiche l'interface dans Chromium. Le front est en Svelte, bundlé avec Vite. Le CSS et les icônes passent par UnoCSS.
Pas de base de données. Une app desktop peut écrire dans son dossier de données (le fameux appData). Tout tient dans un gros fichier JSON : la config SFTP, les chemins des fichiers distants et les infos des séries, reliées à ces chemins.
Le 1er lancement. Une commande SSH liste tous les chemins de vidéos du serveur. L'app analyse chaque nom de fichier : « Adventures of Superman » donne la série à chercher sur TMDB, « S01E01 » donne la saison et l'épisode pour remettre les épisodes dans l'ordre. Il ne reste qu'à afficher.

Pendant la démo, une série en streaming démarrait depuis le serveur. Un épisode déjà téléchargé, le replay du précédent Node.js Paris, se lançait instantanément. Les illustrations venaient de TMDB.

Ce que la salle a demandé

Pourquoi Internet Archive ? Au-delà de la Wayback Machine, le site propose une grande médiathèque libre de droit. C'était parfait pour une démo publique.
Et l'authentification SFTP ? Pour l'instant, un simple nom d'utilisateur et un mot de passe, sans clé SSH. L'app est personnelle et collée à ma config.
La suite ? La plupart de mes projets perso meurent quand la motivation retombe. Celui-là, je sais que je ne l'abandonnerai pas, parce que je m'en sers tous les jours. Le backlog est long. Plusieurs personnes m'ont demandé de le distribuer, ce qui m'encourage. Avant ça, il faut découpler l'app de ma config : saisir ses propres accès SFTP, ou pointer un dossier local parcouru récursivement.

Ce que j'en retiens

Le web n'était pas le mauvais choix par principe, il butait sur 2 limites précises : lancer un lecteur et stocker beaucoup. Les identifier tôt m'a fait gagner du temps. Et un MVP qu'on utilise vraiment, même étroit, tient mieux la distance qu'un projet parfait sur le papier.

Description

Article