私はスクリプトに取り組んでおり、Chrome に問題があります。
私がやっていることは次のとおりです。 1.大きな画像をDIVにロードします。2. DIV のサイズに合わせて画像をスケーリングします。3. ブラウザのリサイズを行うと、ブラウザに合わせて画像が拡大縮小されます。
Chrome を除くすべてのブラウザで、すべてが 100% 機能しています。
Chrome でプロファイラーを確認しましたが、異常はありません。これらは大きな画像ですが、他のすべてのブラウザーでは問題なく (ライブでも) 動作します。
Chrome で縮小サイズの画像を使用する場合にこの問題が指摘されている多くの場所を読みましたが、解決策ではありません。
を使用するだけで、特別なことは何も起こりません
var img=new Image();
$(img).load(function(){ .... {);
Chromeで機能する回避策または解決策を知っている人はいますか? ありがとう！
どのように画像のサイズを変更していますか? 高さ/幅または CSS 変換を使用していますか? 後者の方がパフォーマンスが向上する場合があります。
Chrome での画像のサイズ変更とデコードに関する問題をプロファイリングする場合は、Developer Tools のタイムラインを使用することをお勧めします。これにより、デコードに長い時間がかかった正確な内容に関する比較的正確な統計を得ることができます。
ダウンサイジング (またはサイズ変更) には、Chrome で送信する画像 (JPEG/PNG/GIF) をデコードし、表示したいコンテナー (div) にその画像のサイズを変更する追加の作業が必要です。可能であれば、Chrome チームからのアドバイスは、画像を必要な正しい幅/高さに事前にスケーリングすることです。
さて、あなたは疑問に思っているかもしれません: 確かに、この問題はデスクトップの Chrome がうまくいかないことに起因しているのではないでしょうか? それはそれほど明確ではありません。特に、ブラウザーが強力な GPU/CPU にあまりアクセスできないモバイル デバイスでは、それらのサイズ変更操作を同じように実行するとコストがかかります。要するに、はい、Chrome では大きな画像のサイズ変更が遅くなることがあります。可能な場合は事前スケーリングを試みてください。そうすれば、これらのパフォーマンスのボトルネックはなくなります。