質問やフィードバックがありましたら、フォームからお願いします
本文は台湾華語で、ChatGPT で翻訳している記事なので、不確かな部分や間違いがあるかもしれません。ご了承ください
この記事は、flv.jsの作者の物語を読んで感じたことを記録したものです。
現在、ライブサービスや動画サービスに関連するウェブ開発で最も人気があるのは、hls.jsやflv.jsです。ブラウザのネイティブvideoはこれらのフォーマットをサポートしていないため、独自にデコードする必要があります。
以前はFlashが主流だったため、ほとんどの問題はFlashで解決できましたが、Flashが次第に廃止されるにつれて、他の解決策を考える必要が出てきました。ここ数年で提案されたMedia Source Extensionはこの問題を解決しましたが、自分でドキュメントを読む必要があり、オンラインではMSEについてあまり詳しく言及されていないため、最も便利な方法は既存のライブラリを使用することです。
当時最も有名だったのはBilibiliのflv.jsとhls.jsです。
flvとhlsの違い
flvは、Flashで出力されたswfファイルのサイズが大きすぎるため、インターネット上で効率的に利用するために提案された動画フォーマットです。それでは、なぜインターネットを通じて伝送できるのでしょうか?
一般的に、RMTPを通じてウェブ上で再生するには、Adobe Flashを使用してデコードする必要があります。これはHTML5が成熟する前の解決策でした。しかし、Flashが歴史に入り、各ブラウザがFlashをブロックするため、異なる方法で解決する必要があります。RTMPプロトコルはファイアウォールにブロックされるため、HTTPを使用するのが最も適切な方法で、現在ほとんどのライブプロトコルはHTTP-FLVをベースにしています。
MSE
一般的なvideoタグは特定のファイルフォーマット(またはコンテナ)のみをサポートしています。したがって、RMTPやm3u8などのサポートされていないフォーマットは、直接videoで再生することができません。
既存のaudioやvideoにさらなる拡張を加えるために、ブラウザがサポートしている場合、MSEのAPIを使用して動画の内容を変更または読み取ることができ、デコードしてvideoタグに表示することができます。この作業は通常、プロトコル自体を理解している必要があり、映像エンコーディングに関する基本的な知識を持っている必要があります。また、メンテナンスやデバッグに時間がかかるため、flv.jsやhls.jsが際立つ理由でもあります。彼らはフロントエンドの音声と映像再生におけるニーズを効果的に解決しました。
ストリーミングを扱うことや、hlsのようなエンコーディングは簡単なことではありません。
開発者の物語について
これはコア開発者の謙謙がブログに投稿した記事です。彼は高校生の時にflvをmp4にパッケージ化してウェブで再生するアイデアを持っていて、私はまだ何もしていませんでした。
当時はすでにhlsがありましたが、hlsの構造はflvのような段階的に解析する必要がある要求には適していなかったため、別の構造を設計する必要がありました。開発上の最大の問題は、ブラウザのサポートでした。開発時は2015年から2016年頃で、様々なブラウザのサポートはまだ安定していませんでした。flv.jsを開発するために、作者はchromium/mediaのソースコードを見に行きました。
現在の仕事に退屈を感じていたため、作者はflv.jsの開発に集中するための転職を提案しました。flv.jsがオンラインになりましたが、上司以外は成果をあまり気にせず、最終的なパフォーマンス評価はCでした。
「二人の社員がいます。一人は比較的簡単な業務を大量に執筆し、継続的に成果を出しています。もう一人はコアライブラリを独立して開発し、難易度が高く、工数も多く、開発期間が長いです。外部の理由でブロックされ、予定通りにリリースできませんでした。最終的に、一人目の社員は高いパフォーマンス評価を受け、二人目は極めて低いスコアを得ました。これは公正ですか?」
このビジネス志向の会社が技術的な成果を気にしないことを理解した後、作者は密かに退職計画を立て、flv.jsをオープンソースにしようと考えました。
また、開発者自身も人間であり、感情があり、現状に不満を感じることがあります。私自身もキャリアの初期に非常に挑戦的な会社に参加できたことを嬉しく思っており、自分がやりたいことを達成し、異なる分野に携わることができました。
結論
現在、ほとんどのライブサービスはflv.jsで処理されています。自主開発の場合でも、多くのflv内のコードを参考にしていると思われ、彼がソフトウェア界とライブストリーミングに与えた貢献を想像できます。これらすべては、素晴らしいアイデアと実行から生まれたものです。
私が見た最初の感想は、かなり残念でした。flv.jsを利用した開発者は、彼がHTML5ライブストリーミング分野に与えた貢献の大きさを理解しているはずですが、この結果が会社にとってCのパフォーマンス評価であることは驚きです。
同時に私は反省し始めました。今、ますます多くのブラウザがサポートするAPIや、最近非常に注目を集めているWebAssemblyがあります。最近ではトレンドが高まってきていますが、まだ「xxx言語をコンパイルしてWebAssemblyにした」という段階にとどまっており、具体的な応用には至っていません。
反省
26歳を迎えようとしている今、日本での生活は確かに改善されましたが、私が想像していたものとは異なります。Tech Leadに就任してからは、仕事の効率がほとんど書類作成や進捗確認に縛られ、プログラミングに集中する時間が取れず、長期的には少し疲れてきて、精神的にも衰えを感じています。
幸い、ここでは新しいことを学ぶための柔軟性があり、上司も自分がやりたいことをするように励ましてくれ、パフォーマンス評価に対するプレッシャーはそれほど大きくありません。しかし、この数年の学びは、フロントエンド以外のものに触れることが増えただけで、大きな進展はありません。
卒業後は、しっかりとした知識を学ぶための時間がほとんど取れず、これは私にとって不安やプレッシャーの原因となっています。以前は技術やツールの進化に非常に気を使っていましたが、最近の数年間はあまり関心を持てなくなってきました。もしかしたら、いつかリソースが充足した時に、学校に戻って初めてしっかり学べなかった基礎知識や書きたいプログラムを補完することになるかもしれません。この部分は運に任せるしかありません。
この記事が役に立ったと思ったら、下のリンクからコーヒーを奢ってくれると嬉しいです ☕ 私の普通の一日が輝かしいものになります ✨
☕Buy me a coffee