@cdn365/p2p-media-loader-hlsjs 1.0.0

package/lib/segment-mananger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"segment-mananger.js","sourceRoot":"","sources":["../src/segment-mananger.ts"],"names":[],"mappings":"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"}

package/lib/utils.d.ts

@@ -0,0 +1,3 @@
+import { ByteRange } from "p2p-media-loader-core";
+export declare function getSegmentRuntimeId(segmentRequestUrl: string, byteRange?: ByteRange): string;
+export declare function getByteRange(rangeStart: number | undefined, rangeEnd: number | undefined): ByteRange | undefined;

package/lib/utils.js

@@ -0,0 +1,13 @@
+export function getSegmentRuntimeId(segmentRequestUrl, byteRange) {
+    if (!byteRange)
+        return segmentRequestUrl;
+    return `${segmentRequestUrl}|${byteRange.start}-${byteRange.end}`;
+}
+export function getByteRange(rangeStart, rangeEnd) {
+    if (rangeStart !== undefined &&
+        rangeEnd !== undefined &&
+        rangeStart <= rangeEnd) {
+        return { start: rangeStart, end: rangeEnd };
+    }
+}
+//# sourceMappingURL=utils.js.map

package/lib/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,mBAAmB,CACjC,iBAAyB,EACzB,SAAqB;IAErB,IAAI,CAAC,SAAS;QAAE,OAAO,iBAAiB,CAAC;IACzC,OAAO,GAAG,iBAAiB,IAAI,SAAS,CAAC,KAAK,IAAI,SAAS,CAAC,GAAG,EAAE,CAAC;AACpE,CAAC;AAED,MAAM,UAAU,YAAY,CAC1B,UAA8B,EAC9B,QAA4B;IAE5B,IACE,UAAU,KAAK,SAAS;QACxB,QAAQ,KAAK,SAAS;QACtB,UAAU,IAAI,QAAQ,EACtB,CAAC;QACD,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAC;IAC9C,CAAC;AACH,CAAC"}

package/package.json

@@ -0,0 +1,55 @@
+{
+  "name": "@cdn365/p2p-media-loader-hlsjs",
+  "version": "1.0.0",
+  "description": "P2P Media Loader hls.js integration - CDN365 fork",
+  "license": "Apache-2.0",
+  "author": "CDN365 (original by Novage)",
+  "homepage": "https://github.com/cdn365/p2p-media-loader",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/cdn365/p2p-media-loader"
+  },
+  "bugs": {
+    "url": "https://github.com/cdn365/p2p-media-loader/issues"
+  },
+  "keywords": [
+    "p2p",
+    "peer-to-peer",
+    "hls",
+    "webrtc",
+    "video",
+    "mse",
+    "player",
+    "torrent",
+    "bittorrent",
+    "webtorrent",
+    "hlsjs",
+    "ecdn",
+    "cdn",
+    "cdn365"
+  ],
+  "files": [
+    "dist",
+    "lib",
+    "src",
+    "README.md",
+    "LICENSE"
+  ],
+  "exports": "./lib/index.js",
+  "types": "./lib/index.d.ts",
+  "sideEffects": false,
+  "type": "module",
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@cdn365/p2p-media-loader-core": "^1.0.0"
+  },
+  "peerDependencies": {
+    "hls.js": "^1.6.0"
+  },
+  "devDependencies": {
+    "@rollup/plugin-terser": "^0.4.4",
+    "hls.js": "^1.6.14"
+  }
+}

package/src/engine-static.ts

@@ -0,0 +1,43 @@
+import {
+  HlsJsP2PEngine,
+  PartialHlsJsP2PEngineConfig,
+  HlsWithP2PInstance,
+  HlsWithP2PConfig,
+} from "./engine.js";
+
+export function injectMixin<
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  HlsJsConstructor extends new (...args: any[]) => any,
+>(HlsJsClass: HlsJsConstructor) {
+  return class HlsJsWithP2PClass extends HlsJsClass {
+    #p2pEngine: HlsJsP2PEngine;
+
+    get p2pEngine() {
+      return this.#p2pEngine;
+    }
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    constructor(...args: any[]) {
+      const config = args[0] as
+        | ({
+            p2p?: PartialHlsJsP2PEngineConfig & {
+              onHlsJsCreated?: (hls: InstanceType<HlsJsConstructor>) => void;
+            };
+          } & Record<string, unknown>)
+        | undefined;
+
+      const { p2p, ...hlsJsConfig } = config ?? {};
+
+      const p2pEngine = new HlsJsP2PEngine(p2p);
+
+      super({ ...hlsJsConfig, ...p2pEngine.getConfigForHlsJs() });
+
+      p2pEngine.bindHls(this);
+
+      this.#p2pEngine = p2pEngine;
+      p2p?.onHlsJsCreated?.(this as InstanceType<HlsJsConstructor>);
+    }
+  } as new (
+    config?: HlsWithP2PConfig<HlsJsConstructor>,
+  ) => HlsWithP2PInstance<InstanceType<HlsJsConstructor>>;
+}

package/src/engine.ts

@@ -0,0 +1,400 @@
+import type Hls from "hls.js";
+import type {
+  AudioTrackLoadedData,
+  LevelUpdatedData,
+  ManifestLoadedData,
+  LevelSwitchingData,
+  PlaylistLevelType,
+  HlsConfig,
+  Events,
+} from "hls.js";
+import { FragmentLoaderBase } from "./fragment-loader.js";
+import { PlaylistLoaderBase } from "./playlist-loader.js";
+import { SegmentManager } from "./segment-mananger.js";
+import {
+  CoreConfig,
+  Core,
+  CoreEventMap,
+  DynamicCoreConfig,
+  debug,
+  DefinedCoreConfig,
+} from "p2p-media-loader-core";
+import { injectMixin } from "./engine-static.js";
+
+/** Represents the complete configuration for HlsJsP2PEngine. */
+export type HlsJsP2PEngineConfig = {
+  /** Complete core configuration settings. */
+  core: DefinedCoreConfig;
+};
+
+/** Allows for partial configuration of HlsJsP2PEngine, useful for providing overrides or partial updates. */
+export type PartialHlsJsP2PEngineConfig = Partial<
+  Omit<HlsJsP2PEngineConfig, "core">
+> & {
+  /** Partial core config */
+  core?: Partial<CoreConfig>;
+};
+
+/** Type for specifying dynamic configuration options that can be changed at runtime for the P2P engine's core. */
+export type DynamicHlsJsP2PEngineConfig = {
+  /** Dynamic core config */
+  core?: DynamicCoreConfig;
+};
+
+/**
+ * Extends a generic HLS type to include the P2P engine, integrating P2P capabilities directly into the HLS instance.
+ * @template HlsType The base HLS type that is being extended.
+ */
+export type HlsWithP2PInstance<HlsType> = HlsType & {
+  /** HlsJsP2PEngine instance */
+  readonly p2pEngine: HlsJsP2PEngine;
+};
+
+/**
+ * Configuration type for HLS instances that includes P2P settings, augmenting standard HLS configuration with P2P capabilities.
+ * @template HlsType A constructor type that produces an HLS instance.
+ */
+export type HlsWithP2PConfig<HlsType extends abstract new () => unknown> =
+  ConstructorParameters<HlsType>[0] & {
+    p2p?: PartialHlsJsP2PEngineConfig & {
+      onHlsJsCreated?: (hls: HlsWithP2PInstance<HlsType>) => void;
+    };
+  };
+
+const MAX_LIVE_SYNC_DURATION = 120;
+
+/**
+ * Represents a P2P (peer-to-peer) engine for HLS (HTTP Live Streaming) to enhance media streaming efficiency.
+ * This class integrates P2P technologies into HLS.js, enabling the distribution of media segments via a peer network
+ * alongside traditional HTTP fetching. It reduces server bandwidth costs and improves scalability by sharing the load
+ * across multiple clients.
+ *
+ * The engine manages core functionalities such as segment fetching, segment management, peer connection management,
+ * and event handling related to the P2P and HLS processes.
+ *
+ * @example
+ * // Creating an instance of HlsJsP2PEngine with custom configuration
+ * const hlsP2PEngine = new HlsJsP2PEngine({
+ *   core: {
+ *     highDemandTimeWindow: 30, // 30 seconds
+ *     simultaneousHttpDownloads: 3,
+ *     webRtcMaxMessageSize: 64 * 1024, // 64 KB
+ *     p2pNotReceivingBytesTimeoutMs: 10000, // 10 seconds
+ *     p2pInactiveLoaderDestroyTimeoutMs: 15000, // 15 seconds
+ *     httpNotReceivingBytesTimeoutMs: 8000, // 8 seconds
+ *     httpErrorRetries: 2,
+ *     p2pErrorRetries: 2,
+ *     announceTrackers: ["wss://personal.tracker.com"],
+ *     rtcConfig: {
+ *       iceServers: [{ urls: "stun:personal.stun.com" }]
+ *     },
+ *     swarmId: "example-swarm-id"
+ *   }
+ * });
+ *
+ */
+export class HlsJsP2PEngine {
+  private readonly core: Core;
+  private readonly segmentManager: SegmentManager;
+  private hlsInstanceGetter?: () => Hls;
+  private currentHlsInstance?: Hls;
+  private readonly debug = debug("p2pml-hlsjs:engine");
+
+  /**
+   * Enhances a given Hls.js class by injecting additional P2P (peer-to-peer) functionalities.
+   *
+   * @returns {HlsWithP2PInstance} - The enhanced Hls.js class with P2P functionalities.
+   *
+   * @example
+   * const HlsWithP2P = HlsJsP2PEngine.injectMixin(Hls);
+   *
+   * const hls = new HlsWithP2P({
+   *   // Hls.js configuration
+   *   startLevel: 0, // Example of Hls.js config parameter
+   *   p2p: {
+   *     core: {
+   *       // P2P core configuration
+   *     },
+   *     onHlsJsCreated(hls) {
+   *       // Do something with the Hls.js instance
+   *     },
+   *   },
+   * });
+   */
+  static injectMixin(hls: typeof Hls) {
+    return injectMixin(hls);
+  }
+
+  /**
+   * Constructs an instance of HlsJsP2PEngine.
+   * @param config Optional configuration for P2P engine setup.
+   */
+  constructor(config?: PartialHlsJsP2PEngineConfig) {
+    this.core = new Core(config?.core);
+    this.segmentManager = new SegmentManager(this.core);
+  }
+
+  /**
+   * Adds an event listener for the specified event.
+   * @param eventName The name of the event to listen for.
+   * @param listener The callback function to be invoked when the event is triggered.
+   *
+   * @example
+   * // Listening for a segment being successfully loaded
+   * p2pEngine.addEventListener('onSegmentLoaded', (details) => {
+   *   console.log('Segment Loaded:', details);
+   * });
+   *
+   * @example
+   * // Handling segment load errors
+   * p2pEngine.addEventListener('onSegmentError', (errorDetails) => {
+   *   console.error('Error loading segment:', errorDetails);
+   * });
+   *
+   * @example
+   * // Tracking data downloaded from peers
+   * p2pEngine.addEventListener('onChunkDownloaded', (bytesLength, downloadSource, peerId) => {
+   *   console.log(`Downloaded ${bytesLength} bytes from ${downloadSource} ${peerId ? 'from peer ' + peerId : 'from server'}`);
+   * });
+   */
+  addEventListener<K extends keyof CoreEventMap>(
+    eventName: K,
+    listener: CoreEventMap[K],
+  ) {
+    this.core.addEventListener(eventName, listener);
+  }
+
+  /**
+   * Removes an event listener for the specified event.
+   * @param eventName The name of the event.
+   * @param listener The callback function that was previously added.
+   */
+  removeEventListener<K extends keyof CoreEventMap>(
+    eventName: K,
+    listener: CoreEventMap[K],
+  ) {
+    this.core.removeEventListener(eventName, listener);
+  }
+
+  /**
+   * provides the Hls.js P2P specific configuration for Hls.js loaders.
+   * @returns An object with fragment loader (fLoader) and playlist loader (pLoader).
+   */
+  getConfigForHlsJs(): { fLoader: unknown; pLoader: unknown } {
+    return {
+      fLoader: this.createFragmentLoaderClass(),
+      pLoader: this.createPlaylistLoaderClass(),
+    };
+  }
+
+  /**
+   * Returns the configuration of the HLS.js P2P engine.
+   * @returns A readonly version of the HlsJsP2PEngineConfig.
+   */
+  getConfig(): HlsJsP2PEngineConfig {
+    return { core: this.core.getConfig() };
+  }
+
+  /**
+   * Applies dynamic configuration updates to the P2P engine.
+   * @param dynamicConfig Configuration changes to apply.
+   *
+   * @example
+   * // Assuming `hlsP2PEngine` is an instance of HlsJsP2PEngine
+   *
+   * const newDynamicConfig = {
+   *   core: {
+   *     // Increase the number of cached segments to 1000
+   *     cachedSegmentsCount: 1000,
+   *     // 50 minutes of segments will be downloaded further through HTTP connections if P2P fails
+   *     httpDownloadTimeWindow: 3000,
+   *     // 100 minutes of segments will be downloaded further through P2P connections
+   *     p2pDownloadTimeWindow: 6000,
+   * };
+   *
+   * hlsP2PEngine.applyDynamicConfig(newDynamicConfig);
+   */
+  applyDynamicConfig(dynamicConfig: DynamicHlsJsP2PEngineConfig) {
+    if (dynamicConfig.core) this.core.applyDynamicConfig(dynamicConfig.core);
+  }
+
+  /**
+   * Sets the HLS instance for handling media.
+   * @param hls The HLS instance or a function that returns an HLS instance.
+   */
+  bindHls<T = unknown>(hls: T | (() => T)) {
+    this.hlsInstanceGetter =
+      typeof hls === "function" ? (hls as () => Hls) : () => hls as Hls;
+  }
+
+  private initHlsEvents() {
+    const hlsInstance = this.hlsInstanceGetter?.();
+    if (this.currentHlsInstance === hlsInstance) return;
+    if (this.currentHlsInstance) this.destroy();
+    this.currentHlsInstance = hlsInstance;
+    this.updateHlsEventsHandlers("register");
+    this.updateMediaElementEventHandlers("register");
+  }
+
+  private updateHlsEventsHandlers(type: "register" | "unregister") {
+    const hls = this.currentHlsInstance;
+    if (!hls) return;
+    const method = type === "register" ? "on" : "off";
+
+    hls[method](
+      "hlsManifestLoaded" as Events.MANIFEST_LOADED,
+      this.handleManifestLoaded,
+    );
+    hls[method](
+      "hlsLevelSwitching" as Events.LEVEL_SWITCHING,
+      this.handleLevelSwitching,
+    );
+    hls[method](
+      "hlsLevelUpdated" as Events.LEVEL_UPDATED,
+      this.handleLevelUpdated,
+    );
+    hls[method](
+      "hlsAudioTrackLoaded" as Events.AUDIO_TRACK_LOADED,
+      this.handleLevelUpdated,
+    );
+    hls[method]("hlsDestroying" as Events.DESTROYING, this.destroy);
+    hls[method](
+      "hlsMediaAttaching" as Events.MEDIA_ATTACHING,
+      this.destroyCore,
+    );
+    hls[method](
+      "hlsManifestLoading" as Events.MANIFEST_LOADING,
+      this.destroyCore,
+    );
+    hls[method](
+      "hlsMediaDetached" as Events.MEDIA_DETACHED,
+      this.handleMediaDetached,
+    );
+    hls[method](
+      "hlsMediaAttached" as Events.MEDIA_ATTACHED,
+      this.handleMediaAttached,
+    );
+  }
+
+  private updateMediaElementEventHandlers = (
+    type: "register" | "unregister",
+  ) => {
+    const media = this.currentHlsInstance?.media;
+    if (!media) return;
+    const method =
+      type === "register" ? "addEventListener" : "removeEventListener";
+    media[method]("timeupdate", this.handlePlaybackUpdate);
+    media[method]("seeking", this.handlePlaybackUpdate);
+    media[method]("ratechange", this.handlePlaybackUpdate);
+  };
+
+  private handleManifestLoaded = (event: string, data: ManifestLoadedData) => {
+    // eslint-disable-next-line prefer-destructuring
+    const networkDetails: unknown = data.networkDetails;
+    if (networkDetails instanceof XMLHttpRequest) {
+      this.core.setManifestResponseUrl(networkDetails.responseURL);
+    } else if (networkDetails instanceof Response) {
+      this.core.setManifestResponseUrl(networkDetails.url);
+    }
+    this.segmentManager.processMainManifest(data);
+  };
+
+  private handleLevelSwitching = (event: string, data: LevelSwitchingData) => {
+    if (data.bitrate) this.core.setActiveLevelBitrate(data.bitrate);
+  };
+
+  private handleLevelUpdated = (
+    event: string,
+    data: LevelUpdatedData | AudioTrackLoadedData,
+  ) => {
+    if (
+      this.currentHlsInstance &&
+      data.details.live &&
+      data.details.fragments[0].type === ("main" as PlaylistLevelType) &&
+      !this.currentHlsInstance.userConfig.liveSyncDuration &&
+      !this.currentHlsInstance.userConfig.liveSyncDurationCount &&
+      data.details.fragments.length > 4
+    ) {
+      this.updateLiveSyncDurationCount(data);
+    }
+
+    this.core.setIsLive(data.details.live);
+    this.segmentManager.updatePlaylist(data);
+  };
+
+  private updateLiveSyncDurationCount(
+    data: LevelUpdatedData | AudioTrackLoadedData,
+  ) {
+    const fragmentDuration = data.details.targetduration;
+
+    const maxLiveSyncCount = Math.floor(
+      MAX_LIVE_SYNC_DURATION / fragmentDuration,
+    );
+    const newLiveSyncDurationCount = Math.min(
+      data.details.fragments.length - 1,
+      maxLiveSyncCount,
+    );
+
+    if (
+      this.currentHlsInstance &&
+      this.currentHlsInstance.config.liveSyncDurationCount !==
+        newLiveSyncDurationCount
+    ) {
+      this.debug(
+        `Setting liveSyncDurationCount to ${newLiveSyncDurationCount}`,
+      );
+      this.currentHlsInstance.config.liveSyncDurationCount =
+        newLiveSyncDurationCount;
+    }
+  }
+
+  private handleMediaAttached = () => {
+    this.updateMediaElementEventHandlers("register");
+  };
+
+  private handleMediaDetached = () => {
+    this.updateMediaElementEventHandlers("unregister");
+  };
+
+  private handlePlaybackUpdate = (event: Event) => {
+    const media = event.target as HTMLMediaElement;
+    this.core.updatePlayback(media.currentTime, media.playbackRate);
+  };
+
+  private destroyCore = () => this.core.destroy();
+
+  /** Clean up and release all resources. Unregister all event handlers. */
+  destroy = () => {
+    this.destroyCore();
+    this.updateHlsEventsHandlers("unregister");
+    this.updateMediaElementEventHandlers("unregister");
+    this.currentHlsInstance = undefined;
+  };
+
+  private createFragmentLoaderClass() {
+    const { core } = this;
+    // eslint-disable-next-line @typescript-eslint/no-this-alias
+    const engine = this;
+
+    return class FragmentLoader extends FragmentLoaderBase {
+      constructor(config: HlsConfig) {
+        super(config, core);
+      }
+
+      static getEngine() {
+        return engine;
+      }
+    };
+  }
+
+  private createPlaylistLoaderClass() {
+    // eslint-disable-next-line @typescript-eslint/no-this-alias
+    const engine = this;
+    return class PlaylistLoader extends PlaylistLoaderBase {
+      constructor(config: HlsConfig) {
+        super(config);
+        engine.initHlsEvents();
+      }
+    };
+  }
+}

package/src/fragment-loader.ts

@@ -0,0 +1,167 @@
+import type {
+  FragmentLoaderContext,
+  HlsConfig,
+  Loader,
+  LoaderCallbacks,
+  LoaderConfiguration,
+  LoaderContext,
+  LoaderStats,
+} from "hls.js";
+import * as Utils from "./utils.js";
+import { Core, SegmentResponse, CoreRequestError } from "p2p-media-loader-core";
+
+const DEFAULT_DOWNLOAD_LATENCY = 10;
+
+export class FragmentLoaderBase implements Loader<FragmentLoaderContext> {
+  context!: FragmentLoaderContext;
+  config!: LoaderConfiguration | null;
+  stats: LoaderStats;
+  #callbacks!: LoaderCallbacks<FragmentLoaderContext> | null;
+  #createDefaultLoader: () => Loader<LoaderContext>;
+  #defaultLoader?: Loader<LoaderContext>;
+  #core: Core;
+  #response?: SegmentResponse;
+  #segmentId?: string;
+
+  constructor(config: HlsConfig, core: Core) {
+    this.#core = core;
+    this.#createDefaultLoader = () => new config.loader(config);
+    this.stats = {
+      aborted: false,
+      chunkCount: 0,
+      loading: { start: 0, first: 0, end: 0 },
+      buffering: { start: 0, first: 0, end: 0 },
+      parsing: { start: 0, end: 0 },
+      // set total and loaded to 1 to prevent hls.js
+      // on progress loading monitoring in AbrController
+      total: 1,
+      loaded: 1,
+      bwEstimate: 0,
+      retry: 0,
+    };
+  }
+
+  load(
+    context: FragmentLoaderContext,
+    config: LoaderConfiguration,
+    callbacks: LoaderCallbacks<LoaderContext>,
+  ) {
+    this.context = context;
+    this.config = config;
+    this.#callbacks = callbacks;
+    const { stats } = this;
+
+    const { rangeStart: start, rangeEnd: end } = context;
+    const byteRange = Utils.getByteRange(
+      start,
+      end !== undefined ? end - 1 : undefined,
+    );
+
+    this.#segmentId = Utils.getSegmentRuntimeId(context.url, byteRange);
+    const isSegmentDownloadableByP2PCore = this.#core.isSegmentLoadable(
+      this.#segmentId,
+    );
+
+    if (
+      !this.#core.hasSegment(this.#segmentId) ||
+      !isSegmentDownloadableByP2PCore
+    ) {
+      this.#defaultLoader = this.#createDefaultLoader();
+      this.#defaultLoader.stats = this.stats;
+      this.#defaultLoader.load(context, config, callbacks);
+      return;
+    }
+
+    const onSuccess = (response: SegmentResponse) => {
+      this.#response = response;
+      const loadedBytes = this.#response.data.byteLength;
+      stats.loading = getLoadingStat(
+        this.#response.bandwidth,
+        loadedBytes,
+        performance.now(),
+      );
+      stats.total = loadedBytes;
+      stats.loaded = loadedBytes;
+
+      if (callbacks.onProgress) {
+        callbacks.onProgress(
+          this.stats,
+          context,
+          this.#response.data,
+          undefined,
+        );
+      }
+      callbacks.onSuccess(
+        { data: this.#response.data, url: context.url },
+        this.stats,
+        context,
+        undefined,
+      );
+    };
+
+    const onError = (error: unknown) => {
+      if (
+        error instanceof CoreRequestError &&
+        error.type === "aborted" &&
+        this.stats.aborted
+      ) {
+        return;
+      }
+      this.#handleError(error);
+    };
+
+    void this.#core.loadSegment(this.#segmentId, { onSuccess, onError });
+  }
+
+  #handleError(thrownError: unknown) {
+    const error = { code: 0, text: "" };
+    if (
+      thrownError instanceof CoreRequestError &&
+      thrownError.type === "failed"
+    ) {
+      // error.code = thrownError.code;
+      error.text = thrownError.message;
+    } else if (thrownError instanceof Error) {
+      error.text = thrownError.message;
+    }
+    this.#callbacks?.onError(error, this.context, null, this.stats);
+  }
+
+  #abortInternal() {
+    if (!this.#response && this.#segmentId) {
+      this.stats.aborted = true;
+      this.#core.abortSegmentLoading(this.#segmentId);
+    }
+  }
+
+  abort() {
+    if (this.#defaultLoader) {
+      this.#defaultLoader.abort();
+    } else {
+      this.#abortInternal();
+      this.#callbacks?.onAbort?.(this.stats, this.context, {});
+    }
+  }
+
+  destroy() {
+    if (this.#defaultLoader) {
+      this.#defaultLoader.destroy();
+    } else {
+      if (!this.stats.aborted) this.#abortInternal();
+      this.#callbacks = null;
+      this.config = null;
+    }
+  }
+}
+
+function getLoadingStat(
+  targetBitrate: number,
+  loadedBytes: number,
+  loadingEndTime: number,
+) {
+  const timeForLoading = (loadedBytes * 8000) / targetBitrate;
+  const first = loadingEndTime - timeForLoading;
+  const start = first - DEFAULT_DOWNLOAD_LATENCY;
+
+  return { start, first, end: loadingEndTime };
+}

package/src/index.ts

@@ -0,0 +1,9 @@
+export { HlsJsP2PEngine } from "./engine.js";
+
+export type {
+  DynamicHlsJsP2PEngineConfig,
+  HlsJsP2PEngineConfig,
+  PartialHlsJsP2PEngineConfig,
+  HlsWithP2PInstance,
+  HlsWithP2PConfig,
+} from "./engine.js";