Ankündigung

Einklappen
Keine Ankündigung bisher.

Best Practice Bildverabeitung

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Best Practice Bildverabeitung

    Moin Moin

    ich wollte mal nachfragen was ihr von dem folgenden haltet und bzw. was (wenn es nicht gut ist ) die best practice ist.

    Also folgendes:
    ich möchte gerne Bilder responsive bereit stellen und auch ladezeiten, zb. für das mobile netz, verringern indem die bilder natürlich runterskaliert werden. Darüber hinaus möchte die Bilder dynmisch halten was Wasserzeichen (Wasserzeichen bestehend aus Bild und Datum der aufnahme und weiteren Daten evtl. Ortsangaben), bildnummerierung usw. betrifft.
    Ich würde es also gerne so programmieren, dass die Bilder auf dem Server in der Rohform liegen. Also zb. in 1600x1200 Pixel mit Metadaten Aufnahmedatum Ortsangabe usw. Wenn nun jemand eine Bilddatei aufruft sendet er mit JS (Jquery) Daten bezuüglich Fenster Width mit und PHP skaliert mir / bzw. baut mir das Bild auch jedesmal zusammen.

    Auch vor dem Hintergrund das ich mir meinen Webspace nicht zumülle sehe ich hier vorteile.
    Andererseits könnte die Performance des PHP skriptes leiden vermute ich.

    Über jede Form Kritik, Anregung, Vorschläge, Tipps ... wäre ich dankbar.

    Grüß HarmUb


  • #2
    Bei deiner Variante erstellst du die Bilder jedes mal, wenn sie angefordert werden Das heisst wenn 3 User auf das Bild zugreifen muss das Script jedes mal die Arbeit des Umrechnens vornehmen.

    Besser ist es du erstellst die Bilder gleich nach dem Upload in den Varianten wie du sie benötigst und speicherst diese Varianten in eigenen Ordnern.
    Das könnte so aussehen, dass Bilder ein mal als Vorschaubild und einmal in gross gespeichert werden. Dazu erstellst du dir zwei Ordner einmal thumbs und einmal big oder 205x250 und 1200X1200.
    Du hast da natürlich freie Wahl und kannst auch 3 Varianten erstellen, das ist dann egal, wichtig ist hierbei lediglich, dass die Bilder nur ein mal berechnet werden müssen.

    Jetzt kannst du die Bilder direkt aufrufen da sie ja schon einmal gerendert wurden und sparst dir damit Rechenzeit.
    Die Bilder auf die Browsergrösse hin zu optimieren halte ich für unnötig, da auch mobile Geraäte immer bessere Displays erhalten und somit was heute gut und sinnvoll erscheint morgen schon alter Kaffee ist.

    Kommentar


    • #3
      okay also keine dynamisches anpassen der Bilder?
      Macht das sinn wenn ich viele Bilder habe, dass mir mein server nicht voll gemacht wird?

      Kommentar


      • #4
        Zitat von HarmUb Beitrag anzeigen
        okay also keine dynamisches anpassen der Bilder?
        Nein.

        Zitat von HarmUb Beitrag anzeigen
        Macht das sinn wenn ich viele Bilder habe, dass mir mein server nicht voll gemacht wird?
        Den Satz verstehe ich nicht.

        Kommentar


        • #5
          MOD: Verschoben von PHP-Fortgeschritten
          PHP.de Wissenssammlung | Debugging: Finde DEINE Fehler selbst! | mysql_* ist veraltet! | Gegen Probleme beim E-Mail-Versand | Sicheres Passwort-Hashing | Includes niemals ohne __DIR__ | Kein Support per PN

          Kommentar


          • #6
            https://developer.mozilla.org/en-US/...lement/picture

            Kommentar


            • #7
              Zitat von HarmUb Beitrag anzeigen
              okay also keine dynamisches anpassen der Bilder?
              Doch, kannst du. So mache ich das auch. Es gibt zwei mir bekannte Möglichkeiten:
              - Du schaltest ein Pull-CDN/ReverseProxy dazwischen
              - Du legst die Bilder nach dem ersten Erzeugen in ein tatsächlich existierendes Verzeichnis ab und konfigurierst deinen Webserver so, dass bei nicht-vorhandensein der runtergerechneten Bilddatei deine .php Datei damit beauftragt wird.
              Standards - Best Practices - AwesomePHP - Guideline für WebApps

              Kommentar


              • #8
                Einen hint für die js Seite:
                https://github.com/BBC-News/Imager.js/

                .ht...
                Code:
                 
                  RewriteRule ^image/(.+.(jpg|gif|jpeg|png|bmp))$ /your_image_manupulation_url/?param=$1 [L,NC]
                und dann halt ein image manipulation script unter
                /your_image_manupulation_url/
                Das habe ich aus der ganzen App "ausgehängt".

                Kommentar


                • #9
                  okay das mit der rewrite rule hört sich ganz gut an. denke das ich das so machen werden!

                  Besten Dank für die Hilfe!

                  Kommentar


                  • #10
                    In einem Projekt verwenden wir folgende .htaccess:

                    PHP-Code:
                    RewriteEngine On
                    RewriteCond 
                    %{REQUEST_FILENAME} !-f
                    RewriteRule 
                    index.php [L]

                    <
                    FilesMatch "\.(jpg|jpeg|png|gif)$">
                            
                    Header set Cache-Control "max-age=2678400, public, must-revalidate"
                    </FilesMatch
                    Was macht das?
                    PHP-Code:
                    RewriteCond %{REQUEST_FILENAME} !-
                    ... wenn die angeforderte Datei nicht existiert, dann ...
                    PHP-Code:
                    RewriteRule index.php [L
                    ... leite den Request as-is an die index.php weiter.

                    In der index.php wird dann $_SERVER['REQUEST_URI'] geparst ($path = parse_url($_SERVER['REQUEST_URI'] ?? '/', PHP_URL_PATH)), das Bild erzeugt und direkt ausgegeben. Beim nächsten Request liegt das Bild dann bereits im Zielpfad und wird von Apache direkt ausgeliefert.

                    Für kleine Projekte durchaus praktikabel. Ein Fotolia wird eher auf einen ReverseProxy zurückgreifen.
                    Standards - Best Practices - AwesomePHP - Guideline für WebApps

                    Kommentar

                    Lädt...
                    X