問題タブ [image-optimization]

それぞれがプロファイル写真を持つオブジェクトの結果のリストを返すページを持つ Web アプリケーションを作成しています。

このページがどれくらい大きくなると予想されるかはわかりませんが、より大きなレベルになることを説明したいと思います. 現在、関連付けられた写真を含む 5 ～ 10 個のオブジェクトのみを返していますが、パフォーマンスが低下しています。

画像の最適化に関してインターネット上に多くのリソースがあることを認識しており、いくつかの調査を行いましたが、このページを最適化するために何をすべきかについてはまだわかりません.

css- sprite の使用はオプションですが、これらの写真はメンバーによって追加されているため、CSS スプライトの更新についていくことができるかどうかはわかりません。

一部の画像タイプはパフォーマンスが向上する可能性があることも認識していますが、互換性が失われる場合があります (ただし、これに反論する記事を読んだことがありますが、それは過去のものだと言います)。

私は自分のページの画像を最適化する必要があるという概念にかなり慣れていないので、初心者の開発者の能力を超える可能性があると誰かが信じているより高度な手法がある場合、それは私にとって間違っているかもしれません.

どんなアドバイスも役に立ちます。1 つ試してみて答えが見つからない場合は、いつでも別のものを試すことができます。

これは Web デザインに関する StackOverFlow の姉妹 Web サイトで使用できるものだと認識していますが、ファイルをアップロードするときに修正が必要になる可能性があるため、サーバー側も同様に入手したいと考えています。コメントはお控えください。これがどのように StackOverflow に適合しないかについて、ありがとう!

画像のサイズ変更に問題があります。

指定されたパラメータより大きいファイルをアップロードすると、画像がトリミングされ、100% の品質で保存されます。

したがって、272Kb の大きな jpeg をアップロードするとします。画像は奇数 100 ピクセル分トリミングされます。ファイルサイズは最大 1.2Mb になります。

100% の品質で画像を保存しています。これが問題の原因だと思います。画像は Photoshop から 30% の品質でエクスポートされ、ファイル サイズが縮小されます。画像を 100% の品質で再保存すると同じ画像が作成されますが、多くの冗長なファイル データが含まれていると思います。

誰もこれに遭遇したことがありますか？誰にも解決策がありますか？

これが私たちが使用しているものです。

オンラインとオフラインの画像オプティマイザーの比較番号、つまりYahoo! Smush.itとOptiPNGまたはpngcrushの比較。

それらの速度と結果の画像サイズはどのように異なりますか、そして最良の選択は何ですか？

ビットマップを処理して魚眼歪みを配置する次のクラスがあります。

TraceView を使用してアプリを実行したところ、ほぼすべての処理時間がビットマップのループに費やされていることがわかりました。
ある開発者は、float を使用しないことを提案しました。これは、グラフィックに関する処理が遅くなるからです。また、math.pow() と ceil() を使用する必要はありませんか?
現時点では、ビットマップ全体をループして効果を配置するのに約 42 秒かかります。はい、数秒です:)
float を int に置き換えてみたところ、時間が 37 秒に短縮されましたが、効果はビットマップ。
引数 k は元々 float であり、歪みのレベルを設定します (例: 0.0002F)。int を渡すと、効果が機能しません。

このプロセスを最適化する方法について、誰かが私を正しい方向に向けることができますか? 最適化したら、ビットマップ全体をループせずに、効果の周りにバウンディング ボックスを配置するか、ピクセルが半径 150 の円内にあるかどうかを判断する以下のアルゴリズムを使用することを検討したいと思います。

[更新] 配列をインスタンス変数として作成し、Filter() コンストラクターでインスタンス化しました。これはあなたが意味したものですか？アプリは 84 秒 (間違い) で実行されていましたが、現在は 69 秒で実行されています。ログアウトされたGCもないようです。

ビットマップに魚眼歪み効果を適用するアプリがあります。歪みを作成するには、ビットマップ全体をループして、特定のピクセルが円の境界内にあるかどうかを確認する必要があります。もしそうなら、私はそのピクセルを操作します。このプロセスは手間がかかり、最大 50 秒かかります。これを行うさまざまな方法を考えていたので、効果を適用するためにビットマップ全体をループする必要はありません。私が持っているアイデアの1つは、最初にビットマップを描画して表示することです。次に、効果のみを持つ 2 番目のビットマップ オーバーレイを作成します。次に、2 番目のビットマップを最初のビットマップに重ねることができます。高速化するために多くのピクセルをループせずにこの効果を適用できる方法を考えようとしています。歪みクラスを投稿します。ありがとう。

.

.

[更新] こんにちは、私はすべてのビデオを見ていません。ドングルのデータ許容量が非常に多いため、仕事で見るまで待ちます。以下のコードに変更しました。これは、ピクセル データを int 配列に格納するため、dst.setPixel への呼び出しはありません。それはまだ非常に遅いです (3.2MP カメラで 14 秒)、コードのように数秒とはまったく異なります。そのコードを共有するか、これが意図したものでないかどうか教えてください。ありがとうマット。

ユーザーがクエリを実行すると、25個の200x150pxの画像リンクがある結果ページに移動するWebサイトがあります。私の問題は、（少なくとも私のコンピューターでは）画像の前にコンテンツが読み込まれないように見えることです！

画像部分の前後にコンテンツがありますが（ヘッダーとフッターのようなもので、画像はその中間のコンテンツです）、すべての画像が転送されるまでフッターが表示されません。これは、約500ミリ秒です。前の画像が読み込まれる前は、何も表示されません。

プロキシから自分のWebサイトにアクセスしようとしましたが、結果が異なりました。画像スロットが読み込まれ、ヘッダーとフッターも読み込まれ、画像が1つずつ読み込まれましたが、他のコンテンツは読み込まれませんでした。

それでも、それらはゆっくりとロードされました... :(

この問題はMozillaFirefoxとInternetExplorerで発生しますが、ChromeやOperaでは発生しません。
これを引き起こしている可能性のあるアイデアはありますか？
さらに、私の特定の状況に対する理想的な最適化のアイデアはありますか？前もって感謝します！

乾杯！

クライアントが独自の画像を追加できるようにする管理セクションを備えたMVC 3 Webサイトに取り組んでいます。「最適化」とは、このツールが行うことと同様に、品質に目立った違いがなくサイズが小さくなるように画像ファイルを圧縮することを意味します。

http://www.imageoptimizer.net/Home.aspx

そのツールは統合にはうまく機能するように見えますが、費用がかかります。

これは別のツールで、無料ですが、このツールの問題は、実際に Web ページに埋め込む必要があることです。

http://www.webresizer.com/app/

だから私の質問は：

Web ページに埋め込む必要のない、MVC 3 Web サイトで動的に実行できる画像最適化用の無料のサードパーティ ツールを知っている人はいますか?

それは多くの要件であることを知っているので、そのようなツールが他にない場合、次に質問したいことは次のとおりです。

自分で作成できる画像圧縮アルゴリズムの良い例はありますか?

どんな助けでも大歓迎です。

OK、Imagick PHP 拡張機能を使用して大きな画像のサムネイルを生成する単純な PHP スクリプトがあります。

簡略化されたスクリプトは次のとおりです。

結果の画像は非常に醜いです (もちろんそうです!): http://dl.dropbox.com/u/16514036/thumbnail.php.jpg

しかし、サイズを見てください - それは28 KBです! がらくた、なに？

私が理解している限り、問題は Photoshop からのメタデータまたは埋め込みプレビューにあります。

問題は、サムネイルを最適化し、古いデータをすべて削除するにはどうすればよいかということです。

画像を最適化し、CSSprite を自動的に生成するには、Sprite Optimization and Image Preview 4 と呼ばれる Microsoft パッケージを使用します。

エラー

ローカルではすべてが完全に機能しますが、サイトを公開すると次のエラーが発生します。

試み

「App_Sprites」フォルダー内の問題を解決するために、次の web.config を追加しました。

「blank.gif」画像は、アプリケーションのどこにも使用されていません! フォルダー内App_Spritesには、という名前のサブフォルダーが 1 つだけありますhire。

私のウェブサイトには約2万の製品画像があります。Google Page Speed は、それらが最適化できることを教えてくれました。それは正しいです。違いは非常に大きいです。Google は同じ品質を維持し、画像サイズを 70 ～ 90% 縮小することができます。Pag​​e Speed はそれらを最適化し、最適化された画像へのリンクを提供してくれます。画像が数枚しかない場合、これは素晴らしいことですが、20k の画像を手動で更新することはできません。最適化を処理するためにプログラムを変更したくはありません。画像を最適化して既存の画像を置き換えることができるソフトウェアを使用して、すべての画像を実行したいだけです。経験者の方で、この規模の仕事をクオリティを保ってこなせる良いプログラムを教えていただければ幸いです。ありがとう。