CSS を使用して自分のサイトの YouTube 動画を変換することを検討しています。
私はjsFiddleでそうし始めたので、これが可能であることを認識していますが、これによりページの速度が遅くなりますか、またはこれが原因でどのような障害が発生する可能性がありますか?
私の使用例...
transform: scale(0.8) rotate(2deg);
CSS を使用して自分のサイトの YouTube 動画を変換することを検討しています。
私はjsFiddleでそうし始めたので、これが可能であることを認識していますが、これによりページの速度が遅くなりますか、またはこれが原因でどのような障害が発生する可能性がありますか?
私の使用例...
transform: scale(0.8) rotate(2deg);
わかりました。まず、あなたが行っている変換は 3D ではなく 2D です。タイトルでこれを修正する編集を送信しました。
あなたの質問に関しては、変換はページの読み込み速度を明らかに遅くしますが、2D 変換は 3D ほど集中的ではありません。ただし、3D 変換は実際には GPU を使用してレンダリングします (一部の人々は、GPU にレンダリングを強制するために重要でない 3D 変換を作成し、その結果、速度が向上します)。 3D 変換を使用します。
ビデオや埋め込みコンテンツに s (ぼかし、セピア、白黒、コントラストなど) を使用web-filter
しないでください。読み込み速度が遅くなるだけでなく、非常にバグが多く、見栄えが悪くなります。web-filter
ビデオではうまく機能しません。
あなたの例にはYouTubeビデオが1つしかありませんが、同じページに複数をクールな方法で配置したいと考えています. 3 つまたは 4 つ以上を読み込むことはお勧めしません。複数の埋め込まれた YouTube ビデオを読み込むと、変換自体よりも読み込み時間に負担がかかる可能性があるためです。可能であれば、プレビュー画像を介して個々のビデオにリンクします。