2017-10-11 6 views
0

私はmp4ビデオとjpgポスターでウェブサイトを持っていますが、vidsの読み込み速度はそれほど遅くなります。 IVは、ファイル名の名前を変更したが、ここに私のコードです:動画の読み込みが遅い

<div class="w3-row-padding" style="margin-bottom:128px"> 
 
    <div class="w3-half w3-center"> 
 
    <video controls height="380" width="512" class="video" poster="Images/image.jpg" controlsList="nodownload noaudio"> 
 
      <source src="videos/video.mp4" type="video/mp4"> Your browser does not support the video tag. 
 
      </video> 
 
    <video controls height="380" width="512" class="video" poster="Images/image.jpg" controlsList="nodownload noaudio"> 
 
      <source src="videos/video.mp4" type="video/mp4"> Your browser does not support the video tag. 
 
      </video> 
 
    <video controls height="380" width="512" class="video" poster="Images/image.jpg" controlsList="nodownload noaudio"> 
 
      <source src="videos/video.mp4" type="video/mp4"> Your browser does not support the video tag. 
 
      </video> 
 
    <video controls height="380" width="512" class="video" poster="Images/image.jpg" controlsList="nodownload noaudio"> 
 
      <source src="videos/video.mp4" type="video/mp4"> Your browser does not support the video tag. 
 
      </video> 
 
    </div> 
 
    <div class="w3-half w3-center"> 
 
    <video controls height="380" width="512" class="video" poster="Images/image.jpg" controlsList="nodownload noaudio"> 
 
      <source src="videos/video.mp4" type="video/mp4"> Your browser does not support the video tag. 
 
      </video> 
 
    <video controls height="380" width="512" class="video" poster="Images/image.jpg" controlsList="nodownload noaudio"> 
 
      <source src="videos/video.mp4" type="video/mp4"> Your browser does not support the video tag. 
 
      </video> 
 
    <video controls height="380" width="512" class="video" poster="Images/image.jpg" controlsList="nodownload noaudio"> 
 
     <source src="videos/video.mp4" type="video/mp4"> Your browser does not support the video tag. 
 
      </video> 
 
    <video controls height="380" width="512" class="video" poster="Images/image.jpg" controlsList="nodownload noaudio"> 
 
      <source src="videos/video.mp4" type="video/mp4"> Your browser does not support the video tag. 
 
      </video> 
 

 
    <br> 
 
    <br> 
 
    <br> 
 
    <div class="w3-right"> 
 
     <a title="Next" href="page-2.html" class="w3-button border">Next</a> 
 
     <a style="margin-right: 100px;" href="page-2.html" class="w3-button border">2</a> 
 
    </div> 
 
    </div> 
 
</div>

+1

モバイルの負荷速度を向上させる唯一の方法は、モバイルの品質を低下させること、または接続を改善することです。 –

+0

@Seanおそらくメタデータの問題です。あなたのファイルの最後に配置されている場合は、他のすべてのバイトをダウンロードしてメタに到達する必要があります。 MP4ビデオを正しく再生するには、MPEGデコーダが必要です。 MP4ファイルの1つをディスクに保存していますか?はいの場合は、ファイルバイトを表示するには[** hex editor **](https://www.onlinehexeditor.com/)で開きます。最初の5行の中で最初に 'moov'を見るのではなく、最初に' mdat'という言葉が見えたら、あなたのメタデータが総ファイルバイトの後ろ/最後にあることを意味します。いくつかのエディタツールを使用して前面に移動する必要があります。 '修復mp4 moovを前面に' '... –

+0

@sean 1つの低速mp4へのリンクを得ましたか?これは古典的なMP4の問題です。メタデータが前面にある場合、メタはすべてのプレーヤーに**ファイルバイト**が**実際の**ビデオフレームとオーディオフレームなどであることを伝えるので、ビデオは早く再生できます(またはすぐに画像を表示します)。基本的なチェックを行い、いくつかのフリーツールで修正すると、そのようなWeb開発者とその顧客またはエンドユーザーにはごめんなさい。 –

答えて

0

(1)あなたの<video>タグの設定で最後のパラメータとしてpreload="none"を追加してみてください。

<video controls height="380" width="512" class="video" poster="Images/thg.jpg" controlsList="nodownload noaudio" preload="none"> 
<source src="videos/Comp 1.mp4" type="video/mp4"> Your browser does not support the video tag. 
</video> 

問題は、ページ上のすべてのあなたのビデオはすべてを遅く、一度にすべて/負荷をバッファリングしてみてくださいです。 preload = "none"を使用すると、ユーザーが再生を選択するまで(どれも速く読み込まれます)、プリロードが停止します。

もう1つは、サーバーの速度が遅いことです。 1つのビデオファイルはわずか500-KBであったが、小さなチャンクでまだバッファされていた。私のインターネットでは、500 KBのデータが一瞬で完全に読み込まれると思います。

ファイルリクエストが行われたときに、サーバープロバイダが何らかの理由で送信パケットの速度/サイズを制限または抑制していないかどうかを確認します。

(2)スペース/quotes/colons/bracketなどをWeb URLに使用しないでください。
ファイルをvid%201.mp4として覚えていない限り、一部のブラウザでこれを修正している可能性があります(リンク/ URLのスペースは%20になるように編集されています)、他のアプリがvid 1.mp4を受け入れる保証はありません。アンダースコアvid_1.mp4またはダッシュvid-1.mp4を使用するか、またはスペースを単にvid1.mp4として使用しないでください。

+0

どこにvid 1.mp4がありますか?スペースは、このようなほとんどの事のためには何の仕事もしていません。なぜなら、もし私が私にそれを修正できる場所を教えてください。また、上記のように、あなたのポストに速くロードされることを期待して、それぞれのpreload = "none"を追加しました。私は何かを見つけました...彼らは演奏をクリックするとバッファリングし、彼らは半分をバッファリングせず、完全にバッファリングして再生します。なぜならモバイルでは遅い理由があります。 – Sean

+0

あなたのポートフォリオHTMLのソースコードを見てください。ビデオタグ番号1,2,3,5および8はすべてファイル名にスペースを使用します。それらの 'src'パラメータを参照してください。PS:モバイルではなくデスクトップでテストしましたが、ビデオの読み込みが遅くなりました。数秒間の少数のKBビデオが少なくとも5回停止するのはなぜですか?停止するたびに3秒ほどかかります。これがあなたのサーバーを疑う理由です。 –

+0

スペースにスペースがありませんか?わかりません?どこを指摘してください?よくわかりません?私はスペースがないので、あなたはどこにいるのですか? – Sean

関連する問題