PageSpeed Optimierung

[Pünktchen]

Im Layout von Eclip steht:
< for better page speed remove this lines
cto_layout/css/framework.css
cto_layout/css/customelements.css
cto_layout/css/styles.css

Remove this lines...lächel... wenn ich diese entferne passiert wohl logischerweise was?
Ich schätze wenn man diese aus der fe_page entfernt bindet er sie ja auch nicht mehr ein? Sehe ich das richtig?
LG

[Tim]

Naja, du kannst die Dateien mit in den oben gesetzten Combiner kleben (siehe fe_page Template). Dann werden diese mit all den anderen Dateien zu einer reduziert.
Das würde ich aber nur gaaannnzzzzz am Ende machen. Weil der Performance-Gewinn ist so minimal (CSS ist mörder-schnell geparst), dass es nicht im Verhältnis steht zum ständigen Seitencache leeren bei Änderungen.

[mark]

Ich habe eine Seite bei PageSpeedInsights testen lassen.
Die Mobileseite kommt auf 8
Desktop auf 90.

Muss man hier für Mobile etwas einstellen?

WAs würdet Ihr in der .htaccess noch aktivieren?
https://help.premium-contao-themes.c...pagespeed.html
glaub das bezieht sich noch bisschen auf Contao3 oder? die default gibt es ja nicht mehr.

[Tim]

Technisch muss folgendes beachtet werden:
Webseiten Crawler sind technisch nicht in der Lage Webseiten mit Javascript auszuführen. Javascript ist ein Client-seitiges System. Sprich, es wird auf dem jeweiligen Rechner / Browser ausgeführt. Komplexe Webseiten sind auf Javascript angewiesen - besonders Contao-Webseiten - weil Contao keine korrekte Unterscheidung für mobile Darstellungen bislang liefert. Nutzt man ein eigenes Seitenlayout bzw. Template in "Mobile Darstellung" in den Seiteneinstellungen, wechselt Contao in einen Cache-freien Modus. Die Seite wird dann nicht mehr gecached. Wem das egal ist, kann dort ein striktes Seiten-Template für die Mobile-Darstellung hinterlegen, in dem das Meta viewport Tag hardcodiert gesetzt ist -> jetzt kennt es auch Google. (Von nun an ist der Seitencache deaktiviert). Wer allerdings die Seite performant gecached haben möchte, kommt an einer Javascript Lösung nicht umher.

[mark]

Würdest du aus Google-Sicht dann das Seitenlayout "Mobile Darstellung" empfehlen?
Google will natürlich auch eine Performante Seite vorfinden...

[Tom]

Das Seitenlayout "Mobile Darstellung" deaktiviert den Contao Cache. Ich würde es deshalb nicht empfehlen. Im Grunde wird nur der Page-Speed Test beeinflusst und nicht die reale Ladezeit.

[mark]

Danke hilft mir weiter

[mark]

Unter https://help.premium-contao-themes.c...pagespeed.html
steht unter Punkt 1: Die Datei .htaccess.default (im Rootverzeichnis der Contao-Installation) umbenennen in .htaccess.


Macht das bei Contao4 auch Sinn, das in die htaccess zu schreiben?

[Tom]

Hi Mark,

ja, die File in .htaccess umbenennen. Auch in C4.

Schöne Grüße
Thomas

[mark]

Servus Thomas,
bei mir gibt es die htaccess.default nicht. Installiert hatte ich mit dem Contao-manager

Ich hab nur die magere htaccess

[Tom]

Ah, stimmt. Hier gibt es nur mehr die .htaccess. Die rewrite rule ist hier bereits aktiviert. Das passt so. Muss nicht gemacht werden. Wir passen die Doku noch an. Danke!

[mark]

Ich habe heute die Page Optimierungs-Einstellungen vorgenommen.
Der größte Effekt erzielte die Einstellung:

<IfModule mod_expires.c>
  ExpiresActive on

  ##
  # Productional website
  ##
        ExpiresDefault "access plus 2 days"
        ExpiresByType text/html "access plus 6 hours"
        ExpiresByType image/gif "access plus 3 months"
        ExpiresByType image/jpeg "access plus 3 months"
        ExpiresByType image/jpg "access plus 3 months"
        ExpiresByType image/png "access plus 3 months"
        ExpiresByType image/x-png "access plus 3 months"
        ExpiresByType text/css "access plus 8 days"
        ExpiresByType text/javascript "access plus 7 days"
        ExpiresByType application/x-javascript "access plus 7 days"
        ExpiresByType application/javascript "access plus 7 days"
        ExpiresByType image/x-icon "access plus 3 months"

</IfModule

bei der optimierten initconfig.php konnte ich keinen Effekt feststellen. Oder ist das noch für Contao3?

Bei GTMetrix hab ich dann 85%

[Tim]

Die initconfig kann auch in C4 genutzt werden. Imgrunde nimmt die sämtliches autom. Laden der Module raus. Dann muss alles manuell eingebunden werden.

[mark]

also eher etwas für Fortgeschrittene...
würde ihr für die .htaccess bestimmte Inhalte empfehlen?

[mark]

Das ist mal meine htaccess

<IfModule mod_headers.c>
    # Allow access from all domains for webfonts (see contao/core-bundle#528)
    <FilesMatch "\.(ttf|ttc|otf|eot|woff2?|font\.css)$">
        Header set Access-Control-Allow-Origin "*"
    </FilesMatch>
</IfModule>

<IfModule mod_rewrite.c>
    RewriteEngine On

    # Determine the RewriteBase automatically and set it as environment variable.
    # If you are using Apache aliases to do mass virtual hosting or installed the
    # project in a subdirectory, the base path will be prepended to allow proper
    # resolution of the app.php file and to redirect to the correct URI. It will
    # work in environments without path prefix as well, providing a safe, one-size
    # fits all solution. But as you do not need it in this case, you can comment
    # the following 2 lines to eliminate the overhead.
    RewriteCond %{REQUEST_URI}::$1 ^(/.+)/(.*)::\2$
    RewriteRule ^(.*) - [E=BASE:%1]

    # Sets the HTTP_AUTHORIZATION header removed by Apache
    RewriteCond %{HTTP:Authorization} .
    RewriteRule ^ - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
    
    
    #
    # Make sure to replace "example.com" with your domain name.

    # Redirect to URI without front controller to prevent duplicate content
    # (with and without `/app.php`). Only do this redirect on the initial
    # rewrite by Apache and not on subsequent cycles. Otherwise we would get an
    # endless redirect loop (request -> rewrite to front controller ->
    # redirect -> request -> ...).
    # So in case you get a "too many redirects" error or you always get redirected
    # to the start page because your Apache does not expose the REDIRECT_STATUS
    # environment variable, you have 2 choices:
    # - disable this feature by commenting the following 2 lines or
    # - use Apache >= 2.3.9 and replace all L flags by END flags and remove the
    #   following RewriteCond (best solution)
    RewriteCond %{ENV:REDIRECT_STATUS} ^$
    RewriteRule ^app\.php(?:/(.*)|$) %{ENV:BASE}/$1 [R=301,L]

    # If the requested filename exists, simply serve it.
    # We only want to let Apache serve files and not directories.
    RewriteCond %{REQUEST_FILENAME} -f
    RewriteRule ^ - [L]

    # Rewrite all other queries to the front controller.
    RewriteRule ^ %{ENV:BASE}/app.php [L]
</IfModule>

<IfModule !mod_rewrite.c>
    <IfModule mod_alias.c>
        # When mod_rewrite is not available, we instruct a temporary redirect of
        # the start page to the front controller explicitly so that the website
        # and the generated links can still be used.
        RedirectMatch 302 ^/$ /app.php/
        # RedirectTemp cannot be used instead
    </IfModule>
</IfModule>

<IfModule mod_deflate.c>
 <IfModule mod_filter.c>
    AddOutputFilterByType DEFLATE text/html text/plain text/css application/json
    AddOutputFilterByType DEFLATE application/javascript
    AddOutputFilterByType DEFLATE text/xml application/xml text/x-component
    AddOutputFilterByType DEFLATE application/xhtml+xml application/rss+xml application/atom+xml
    AddOutputFilterByType DEFLATE image/x-icon image/svg+xml application/vnd.ms-fontobject application/x-font-ttf font/opentype
  </IfModule>
</IfModule>

AddEncoding gzip .gz
<FilesMatch "\.js\.gz$">
AddType "application/javascript" .gz
</FilesMatch>
<FilesMatch "\.css\.gz$">
AddType "text/css" .gz
</FilesMatch>
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{REQUEST_FILENAME} \.(js|css)$
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule ^(.*)$ $1.gz [QSA,L]

# Set cache-control
    <IfModule mod_expires.c>
        ExpiresActive On
        ExpiresDefault "access plus 2 days"
        ExpiresByType text/html "access plus 6 hours"
        ExpiresByType image/gif "access plus 3 months"
        ExpiresByType image/jpeg "access plus 3 months"
        ExpiresByType image/jpg "access plus 3 months"
        ExpiresByType image/png "access plus 3 months"
        ExpiresByType image/x-png "access plus 3 months"
        ExpiresByType text/css "access plus 8 days"
        ExpiresByType text/javascript "access plus 7 days"
        ExpiresByType application/x-javascript "access plus 7 days"
        ExpiresByType application/javascript "access plus 7 days"
        ExpiresByType image/x-icon "access plus 3 months"
    </IfModule>

ErrorDocument 403 /index.php
ErrorDocument 404 /index.php

Eine Änderung unter gtmetrix habe ich jedoch nur bei dem mod_expires Eintrag erzielt.
Vorher 75/73 danach 87/86
Nachdem ich noch alle Bilder über tinypng gejagt habe, bin ich jetzt auf 91/86

Jetzt motzt er nur noch über "Defer parsing of JavaScript" und "Minify JavaScript" und "Make fewe HTTP request". Skripte komprimieren ist jedoch aktiv.
Kann/muss ich noch etwas bestimmtes anpassen?