HLS player video dynamic ffmpeg

I would like here to have explanations and suggestions on how I could manage the time jump in my reader, to improve my approach.

HLS does not allow to go to the segment before encoding, forced to relaunch the command ffmpeg, how to improve my code to do it better ?

the idea would be to do something like Emby, Jellyfin, Plex.

For communication between the two I have a simple php script,

my video player recovers the actual duration of the video in a JSON rather than displayed the time of the m3u8 segments.

my JS that I launch with node :

const { spawn } = require('child_process');

const inputFilePath = process.argv[2];
const subtitleFilePath = process.argv[3];
const outputDirectoryPath = process.argv[4];
const startTime = process.argv[5];

const escapedSubtitleFilePath = subtitleFilePath.replace(/[^\w\s]/gi, '\\$&');

const args = [
  '-ss', startTime,
  '-i', inputFilePath,
  '-vf', `subtitles='${escapedSubtitleFilePath}':force_style='Default'`,
  '-c:v', 'libx264',
  '-preset', 'veryfast',
  '-crf', '17',
  '-c:a', 'aac',
  '-hls_time', '30',
  '-hls_list_size', '0',
  '-f', 'hls',
  `${outputDirectoryPath}/stream.m3u8`
];

const ffmpegProcess = spawn('ffmpeg', args);

ffmpegProcess.stdout.on('data', (data) => {
  console.log(`stdout: ${data}`);
});

ffmpegProcess.stderr.on('data', (data) => {
  console.error(`stderr: ${data}`);
});

ffmpegProcess.on('close', (code) => {
  console.log(`child process exited with code ${code}`);
});

my video player :

<script type="text/javascript" src="https://cdn.plyr.io/3.6.8/plyr.js"></script>
<link rel="stylesheet" href="https://cdn.plyr.io/3.6.8/plyr.css" />
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>

<video id="player" playsinline controls>
  <source src="http://localhost/temp/stream.m3u8" type="application/x-mpegURL" />
</video>

<script type="text/javascript">


(function() {
  var video = document.querySelector('#player');
  var src = 'http://localhost/temp/stream.m3u8';

  if (Hls.isSupported()) {
    var hls = new Hls();
    hls.loadSource(src);
    hls.attachMedia(video);
    hls.on(Hls.Events.MANIFEST_PARSED, function() {
      video.play();
    });
  } else if (video.canPlayType('application/vnd.apple.mpegurl')) {
    video.src = src;
    video.addEventListener('loadedmetadata', function() {
      video.play();
    });
  }

  (async function() {
    const response = await fetch('temp/video_info.json');
    const data = await response.json();
    const duration = parseFloat(data.format.duration);

    const player = new Plyr('#player', {
      tooltips: {
        controls: true,
        seek: true
      },
   
      duration: duration
    });

    player.on('click', function(event) {
 
      const time = player.currentTime;
      console.log(`Temps de la vidéo: ${time}`);

      const hours = Math.floor(time / 3600);
      const minutes = Math.floor((time - hours * 3600) / 60);
      const seconds = Math.floor(time - hours * 3600 - minutes * 60);
      const formattedTime = `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
      console.log(`Temps de la vidéo: ${formattedTime}`);

      fetch('/transcode.php', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json'
        },
        body: JSON.stringify({
          inputFilePath: '.../Spy Kyoushitsu/Spy Kyoushitsu 01.mkv',
          subtitleFilePath: '.../Spy Kyoushitsu/Spy Kyoushitsu 01.mkv',
          outputDirectoryPath: 'formattedTime',
          time: time
        })
      }).then(response => {
        console.log(response);
      }).catch(error => {
        console.error(error);
      });

    });
  })();
})();


</script>

I try to manage the ffmpeg better thanks to the flexibility of the jump time on the timeline, which avoids waiting for a total transcoding.

source https://stackoverflow.com/questions/76047966/hls-player-video-dynamic-ffmpeg