4EVERLAND + Livepeer

Livepeer is an Ethereum-based protocol that distributes video transcoding work throughout its decentralised network. The protocol aims to provide cost efficient, secure, and reliable infrastructure that can handle today's high demand for video streaming. For projects involving both live and recorded video, transcoded video from Arweave can be easily played using livepeer.js, so the combination of Livepeer and 4EVERLAND storage allows you to optimise video delivery for each unique client.

Arweave

Arweave is a Web3 protocol that offers data storage on a decentralised network of devices. It has a set of nodes that are incentivised to store data permanently and access the content stored on the network via the Arweave gateway.

What is Transcoding

Transcoding (which is a process of decoding, reformatting, and re-encoding files) takes source footage of various types and recodes it into a single video codec or file format. More specifically, transcoding is the process of taking an encoded digital media file and unencoding it to change the file size (transize) or bitrate (transrate).

Diversifying bitrates and resolutions makes it possible to not only reach more devices, but also stream more effectively (and at the highest possible quality) across those devices. Your stream (live or otherwise) will no longer be at the mercy of heavy buffering caused by unexpected dips in bandwidth.

The following example uses the player's built-in functionality to transcode Arweave content without any additional configuration.

Setup

To get started, you'll need to create an API key first.

If you're working with React, you can install the Livepeer React SDK with:

npm @livepeer/react

Upload files to Arweave

You can upload your video files to Arweave via 4EVERLAND in a number of optional ways:

• 4EVERLAND Dashboard

• CLI: /v2/documentation/api/latest/reference/s3/index.html

• SDK: /developer/tools/

• 4EVERLAND API (S3-Compatile API, Pinning Services API)

• Various tools: /storage/bucket/bucket-tools

Trascoding a Video Stored On Arweave

Using the <Player> tag from the Livepeer SDK, embed an Arweave URL. Add text input for AR Hash or an Arweave HTTP gateway URL as well.

Arweave URL

ar://v3FdXvU53nplZ8_1JcrBissGdwF_2h3J9NX73l0Fsqs

or

https://arweave.net/v3FdXvU53nplZ8_1JcrBissGdwF_2h3J9NX73l0Fsqs

The first time Livepeer encounters a URL, it will transcode the file and the transcoded version will be stored in the account tied to your API key. The transcoded file will be retained as long as your account is active.

<Player

title="4EVER SDK For NodeJs"

src="ar://..." //Arweave URL

autoPlay

muted

/>

The Player component must have access to a Livepeer client with a valid API key in order to successfully transcode your video. The provider pattern and the LivepeerConfig component are recommended.

For example, to make the client available to all child components in your app, you would structure your index.js file as follows.

import React from "react";

import ReactDOM from "react-dom/client";

import "./index.css";

import App from "./App";

import { LivepeerConfig, createReactClient, studioProvider } from "@livepeer/react";

const livepeerClient = createReactClient({

provider: studioProvider({

apiKey: process.env.LIVEPEER_API_KEY,

}),

});

const root = ReactDOM.createRoot(document.getElementById("root"));

root.render(

<LivepeerConfig client={livepeerClient}>

<App />

</LivepeerConfig>,

);

To conclude

That's it! You have just used a few lines of code to combine 4EVERLAND+Livepeeer into a caching and transcoding layer on Arweave.