Erstellen von CSS-Sprites für dynamische Bilder

Question

Ich habe eine Webseite, die etwa 20 - 50 dynamische Bilder enthält (Bilder von einer nicht-statischen Quelle). Diese Bilder werden basierend auf der Anforderungs-URL über ein Servlet bereitgestellt. Dies führt dazu, dass eine Anforderung pro Bild erzeugt wird, was zu einem Leistungsabfall führt.

Wenn diese Bilder statisch wären, würde ich ein CSS-Sprite erstellen und die 50 Anfragen durch eine einzige ersetzen. Da sie dynamisch sind, ist das natürlich nicht so einfach. Ich suche nach einem Werkzeug/einer Bibliothek/Methode, die ich verwenden kann, um diese Bilder zur Laufzeit in einem einzigen Sprite zu aggregieren. Glücklicherweise ist die Bildgröße konstant und für alle gleich, was dies viel einfacher machen sollte.

Irgendwelche Vorschläge?

Answer 1

Sie können überprüfen und versuchen Jaehr (https://jawr.dev.java.net/) Bibliothek zum Generieren/Ändern (auch Komprimieren, Zusammenführen) CSS-Dateien auf Servlet. Es hat die Möglichkeit, Hintergrundbilder dynamisch zu ändern. Sie können Bundles für den Wechsel der CSS-Datei (en) zum Wechseln der Haut (n) arrangieren.

Plus Seite: Sie können auch Ihre .js-Dateien verwalten und arrangieren!

Answer 2

Sie können Bilder mit der freien ImageMagick-Bibliothek über einen Aufruf an die Systembefehlszeile anhängen, so dass Sie viel weniger in Java programmieren müssen und es schneller ist.

Für horizontal anhängt, verwenden Sie diesen Befehl:

convert image1.gif image2.gif image3.gif +append result.gif 

Für vertikal angehängt wird, verwenden Sie diesen Befehl:

convert image1.gif image2.gif image3.gif -append result.gif 

Für mehr Informationen: http://www.imagemagick.org/Usage/layers/#append

mit CSS So können Sie sich anzeigen lassen Die Sprites verwenden ein einzelnes Bild mit einem einfachen Versatz (Sie können die CSS- "Hintergrund" -Art verwenden, um das Bild zu laden und den Versatz des einzelnen Bildes festzulegen Sprite, das angezeigt werden soll). Kein JavaScript ist erforderlich, wenn Sie nur einfache Dinge tun.

Answer 3

Lohnt sich der Verarbeitungsaufwand auf dem Server?

Ich denke darüber jetzt für C#, Trading der zusätzlichen Komplexität, die dynamische Bilder erstellen und sie an den Client senden, mit der Reduzierung der einzelnen Bildzugriffe.

Eine Abwägung, die ein bisschen Analyse verdient.