JS und CSS kombinieren

  • tomjoad2023

    (@tomjoad2023)


    vor 2 Wochen, 3 Tage

    Hallo,

    meine Website ist manchmal super schnell und in mind. 50% der Fälle sehr langsam: Hier der Screenshot einer Analyse bei Pingdom Tools:

    https://thomas-graf-lebenskunst.de/wp-content/uploads/2024/08/1.png

    Meine Anfrage beim Host ONLYDOMAINS ergab: „The most impactful would be to combine the JS and CSS requests to reduce the amount of back-and-forth HTTP requests required to load the website.„

    Ich habe nun gegoggelt, wie ich JS und CSS kombinieren kann. Mein Problem: Ich arbeite bislang nur mit der WordPress-Oberfläche, nichht mit den einzelnen Codes in cpanel – das traue ich mir zwar auch zu, ich müsste dann aber genau wisen, wo ich was verändere.

    Ich weiß also im Moment nicht, was ich tun muss, um JS und CSS zu kombinieren.

    Vielen Dank vorab und Grüße,
    Thomas

    ` wp-core

    version: 6.6.1
    site_language: de_DE
    user_language: de_DE
    timezone: +00:00
    permalink: /%postname%/
    https_status: true
    multisite: false
    user_registration: 0
    blog_public: 1
    default_comment_status: open
    environment_type: production
    user_count: 1
    dotorg_communication: true wp-paths-sizes

    wordpress_path: /home/m1elszqx/thomas-graf-lebenskunst.de
    wordpress_size: loading…
    uploads_path: /home/m1elszqx/thomas-graf-lebenskunst.de/wp-content/uploads
    uploads_size: loading…
    themes_path: /home/m1elszqx/thomas-graf-lebenskunst.de/wp-content/themes
    themes_size: loading…
    plugins_path: /home/m1elszqx/thomas-graf-lebenskunst.de/wp-content/plugins
    plugins_size: loading…
    fonts_path: /home/m1elszqx/thomas-graf-lebenskunst.de/wp-content/uploads/fonts
    fonts_size: loading…
    database_size: loading…
    total_size: loading… wp-dropins (2)

    advanced-cache.php: true
    object-cache.php: true wp-active-theme

    name: OceanWP (oceanwp)
    version: 3.5.9
    author: OceanWP
    author_website: https://oceanwp.org/about-oceanwp/
    parent_theme: none
    theme_features: core-block-patterns, widgets-block-editor, align-wide, wp-block-styles, responsive-embeds, editor-styles, editor-style, menus, post-formats, title-tag, automatic-feed-links, post-thumbnails, custom-header, custom-logo, html5, woocommerce, wc-product-gallery-zoom, wc-product-gallery-lightbox, wc-product-gallery-slider, customize-selective-refresh-widgets, widgets
    theme_path: /home/m1elszqx/thomas-graf-lebenskunst.de/wp-content/themes/oceanwp
    auto_update: Deaktiviert wp-themes-inactive (1)

    Twenty Twenty-Four: version: 1.2, author: Das WordPress-Team, Automatische Aktualisierungen deaktiviert wp-mu-plugins (1)

    Health Check Troubleshooting Mode: author: (undefined), version: 1.9.1 wp-plugins-active (22)

    Backuply: version: 1.3.3, author: Softaculous, Automatische Aktualisierungen aktiviert
    Contact Form 7: version: 5.9.8, author: Takayuki Miyoshi, Automatische Aktualisierungen aktiviert
    Elementor: version: 3.23.4, author: Elementor.com, Automatische Aktualisierungen aktiviert
    Elementor Header & Footer Builder: version: 1.6.40, author: Brainstorm Force, Nikhil Chavan, Automatische Aktualisierungen aktiviert
    Envato Elements: version: 2.0.14, author: Envato, Automatische Aktualisierungen deaktiviert
    FileOrganizer: version: 1.0.9, author: Softaculous Team, Automatische Aktualisierungen deaktiviert
    GoSMTP: version: 1.0.7, author: Softaculous Team, Automatische Aktualisierungen deaktiviert
    Health Check & Troubleshooting: version: 1.7.1, author: The WordPress.org community, Automatische Aktualisierungen deaktiviert
    Heartbeat Control by WP Rocket: version: 2.0.1, author: WP Rocket, Automatische Aktualisierungen deaktiviert
    Image Optimizer by Elementor – Compress, Resize and Optimize Images: version: 1.5.2, author: Elementor.com, Automatische Aktualisierungen deaktiviert
    Loginizer: version: 1.9.1, author: Softaculous, Automatische Aktualisierungen aktiviert
    My Sticky Bar: version: 2.7.7, author: Premio, Automatische Aktualisierungen aktiviert
    Ocean Extra: version: 2.3.0, author: OceanWP, Automatische Aktualisierungen aktiviert
    Performance Lab: version: 3.4.0, author: WordPress Performance Team, Automatische Aktualisierungen aktiviert
    Premium Addons for Elementor: version: 4.10.49, author: Leap13, Automatische Aktualisierungen deaktiviert
    Profiler - What Slowing Down Your WP: version: 1.0.0, author: SWIT, Sandi Winter, Automatische Aktualisierungen deaktiviert
    Real Cookie Banner: version: 4.7.15, author: devowl.io, Automatische Aktualisierungen aktiviert
    Site Kit by Google: version: 1.134.0, author: Google, Automatische Aktualisierungen aktiviert
    UpdraftPlus - Backup/Restore: version: 1.24.4, author: UpdraftPlus.Com, DavidAnderson, Automatische Aktualisierungen deaktiviert
    Wordfence Security: version: 7.11.7, author: Wordfence, Automatische Aktualisierungen deaktiviert
    WP-Optimize - Clean, Compress, Cache: version: 3.5.0, author: David Anderson, Ruhani Rabin, Team Updraft, Automatische Aktualisierungen aktiviert
    Yoast SEO: version: 23.3, author: Team Yoast, Automatische Aktualisierungen aktiviert wp-media

    image_editor: WP_Image_Editor_Imagick
    imagick_module_version: 1809
    imagemagick_version: ImageMagick 7.1.1-19 Q16-HDRI x86_64 21601 https://imagemagick.org
    imagick_version: 3.7.0
    file_uploads: 1
    post_max_size: 256M
    upload_max_filesize: 256M
    max_effective_size: 256 MB
    max_file_uploads: 20
    imagick_limits:
    imagick::RESOURCETYPE_AREA: 122 GB
    imagick::RESOURCETYPE_DISK: 9.2233720368548E+18
    imagick::RESOURCETYPE_FILE: 196608
    imagick::RESOURCETYPE_MAP: 61 GB
    imagick::RESOURCETYPE_MEMORY: 31 GB
    imagick::RESOURCETYPE_THREAD: 1
    imagick::RESOURCETYPE_TIME: 9.2233720368548E+18
    imagemagick_file_formats: 3FR, 3G2, 3GP, A, AAI, AI, APNG, ART, ARW, ASHLAR, AVI, AVIF, AVS, B, BAYER, BAYERA, BGR, BGRA, BGRO, BIE, BMP, BMP2, BMP3, BRF, C, CAL, CALS, CANVAS, CAPTION, CIN, CIP, CLIP, CMYK, CMYKA, CR2, CR3, CRW, CUBE, CUR, CUT, DATA, DCM, DCR, DCRAW, DCX, DDS, DFONT, DNG, DOT, DPX, DXT1, DXT5, EPDF, EPI, EPS, EPS2, EPS3, EPSF, EPSI, EPT, EPT2, EPT3, ERF, EXR, FARBFELD, FAX, FF, FILE, FITS, FL32, FLV, FRACTAL, FTP, FTS, FTXT, G, G3, G4, GIF, GIF87, GRADIENT, GRAY, GRAYA, GROUP4, GV, HALD, HDR, HEIC, HEIF, HISTOGRAM, HRZ, HTM, HTML, HTTP, HTTPS, ICB, ICO, ICON, IIQ, INFO, INLINE, IPL, ISOBRL, ISOBRL6, J2C, J2K, JBG, JBIG, JNG, JNX, JP2, JPC, JPE, JPEG, JPG, JPM, JPS, JPT, JSON, K, K25, KDC, LABEL, M, M2V, M4V, MAC, MAP, MASK, MAT, MATTE, MEF, MIFF, MKV, MNG, MONO, MOV, MP4, MPC, MPEG, MPG, MPO, MRW, MSL, MSVG, MTV, MVG, NEF, NRW, NULL, O, ORA, ORF, OTB, OTF, PAL, PALM, PAM, PANGO, PATTERN, PBM, PCD, PCDS, PCL, PCT, PCX, PDB, PDF, PDFA, PEF, PES, PFA, PFB, PFM, PGM, PGX, PHM, PICON, PICT, PIX, PJPEG, PLASMA, PNG, PNG00, PNG24, PNG32, PNG48, PNG64, PNG8, PNM, POCKETMOD, PPM, PS, PS2, PS3, PSB, PSD, PTIF, PWP, QOI, R, RADIAL-GRADIENT, RAF, RAS, RAW, RGB, RGB565, RGBA, RGBO, RGF, RLA, RLE, RMF, RSVG, RW2, SCR, SCREENSHOT, SCT, SFW, SGI, SHTML, SIX, SIXEL, SPARSE-COLOR, SR2, SRF, STEGANO, STRIMG, SUN, SVG, SVGZ, TEXT, TGA, THUMBNAIL, TIFF, TIFF64, TILE, TIM, TM2, TTC, TTF, TXT, UBRL, UBRL6, UIL, UYVY, VDA, VICAR, VID, VIFF, VIPS, VST, WBMP, WEBM, WEBP, WMF, WMV, WMZ, WPG, X, X3F, XBM, XC, XCF, XPM, XPS, XV, XWD, Y, YAML, YCbCr, YCbCrA, YUV
    gd_version: 2.3.3
    gd_formats: GIF, JPEG, PNG, WebP, BMP, AVIF, XPM
    ghostscript_version: 9.27 wp-server

    server_architecture: Linux 4.18.0-513.11.1.lve.el8.x86_64 x86_64
    httpd_software: LiteSpeed
    php_version: 8.1.29 64bit
    php_sapi: litespeed
    max_input_variables: 1000
    time_limit: 300
    memory_limit: 512M
    max_input_time: 600
    upload_max_filesize: 256M
    php_post_max_size: 256M
    curl_version: 7.87.0 OpenSSL/1.1.1w
    suhosin: false
    imagick_availability: true
    pretty_permalinks: true
    htaccess_extra_rules: true
    current: 2024-08-28T08:13:38+00:00
    utc-time: Wednesday, 28-Aug-24 08:13:38 UTC
    server-time: 2024-08-28T08:13:35+00:00 wp-database

    extension: mysqli
    server_version: 10.6.18-MariaDB
    client_version: 10.6.18-MariaDB
    max_allowed_packet: 536870912
    max_connections: 1000 wp-constants

    WP_HOME: undefined
    WP_SITEURL: undefined
    WP_CONTENT_DIR: /home/m1elszqx/thomas-graf-lebenskunst.de/wp-content
    WP_PLUGIN_DIR: /home/m1elszqx/thomas-graf-lebenskunst.de/wp-content/plugins
    WP_MEMORY_LIMIT: 40M
    WP_MAX_MEMORY_LIMIT: 512M
    WP_DEBUG: false
    WP_DEBUG_DISPLAY: true
    WP_DEBUG_LOG: false
    SCRIPT_DEBUG: false
    WP_CACHE: true
    CONCATENATE_SCRIPTS: undefined
    COMPRESS_SCRIPTS: undefined
    COMPRESS_CSS: undefined
    WP_ENVIRONMENT_TYPE: Nicht definiert
    WP_DEVELOPMENT_MODE: undefined
    DB_CHARSET: utf8mb4
    DB_COLLATE: undefined wp-filesystem

    wordpress: writable
    wp-content: writable
    uploads: writable
    plugins: writable
    themes: writable
    fonts: not writable
    mu-plugins: writable google-site-kit

    version: 1.134.0
    php_version: 8.1.29
    wp_version: 6.6.1
    reference_url: https://thomas-graf-lebenskunst.de
    amp_mode: no
    site_status: connected-site
    user_status: authenticated
    verification_status: verified-file
    connected_user_count: 1
    active_modules: site-verification, search-console, analytics-4, pagespeed-insights
    recoverable_modules: none
    required_scopes:
    openid: ✅
    https://www.googleapis.com/auth/userinfo.profile: ✅
    https://www.googleapis.com/auth/userinfo.email: ✅
    https://www.googleapis.com/auth/siteverification: ✅
    https://www.googleapis.com/auth/webmasters: ✅
    https://www.googleapis.com/auth/analytics.readonly: ✅
    https://www.googleapis.com/auth/tagmanager.readonly: ✅
    capabilities:
    googlesitekit_authenticate: ✅
    googlesitekit_setup: ✅
    googlesitekit_view_posts_insights: ✅
    googlesitekit_view_dashboard: ✅
    googlesitekit_manage_options: ✅
    googlesitekit_update_plugins: ✅
    googlesitekit_view_splash: ✅
    googlesitekit_view_authenticated_dashboard: ✅
    googlesitekit_view_wp_dashboard_widget: ✅
    googlesitekit_view_admin_bar_menu: ✅
    googlesitekit_view_shared_dashboard: ⭕
    googlesitekit_read_shared_module_data::["search-console"]: ⭕
    googlesitekit_read_shared_module_data::["analytics-4"]: ⭕
    googlesitekit_read_shared_module_data::["pagespeed-insights"]: ⭕
    googlesitekit_manage_module_sharing_options::["search-console"]: ✅
    googlesitekit_manage_module_sharing_options::["analytics-4"]: ✅
    googlesitekit_manage_module_sharing_options::["pagespeed-insights"]: ✅
    googlesitekit_delegate_module_sharing_management::["search-console"]: ✅
    googlesitekit_delegate_module_sharing_management::["analytics-4"]: ✅
    googlesitekit_delegate_module_sharing_management::["pagespeed-insights"]: ⭕
    enabled_features:
    adsPax: ⭕
    audienceSegmentation: ⭕
    conversionInfra: ✅
    gm3Components: ⭕
    privacySandboxModule: ⭕
    rrmModule: ⭕
    active_conversion_event_providers:
    contact-form-7: contact
    consent_mode: disabled
    consent_api: not-detected
    search-console_shared_roles: none
    search-console_management: owner
    analytics-4_shared_roles: none
    analytics-4_management: owner
    pagespeed-insights_shared_roles: none
    pagespeed-insights_management: all_admins
    search_console_property: https://thomas-graf-lebenskunst.de/
    analytics_4_account_id: 3259•••••
    analytics_4_property_id: 4551437••
    analytics_4_web_data_stream_id: 8587••••••
    analytics_4_measurement_id: G-X4••••••••
    analytics_4_use_snippet: yes
    analytics_4_ads_conversion_id: none
    analytics_4_available_custom_dimensions: none
    analytics_4_ads_linked: false
    analytics_4_ads_linked_last_synced_at: 1724699435

    Die Seite, für die ich Hilfe brauche: [Anmelden, um den Link zu sehen]

Ansicht von 11 Antworten – 1 bis 11 (von insgesamt 11)
  • Moderator Angelika Reisiger

    (@la-geek)

    vor 2 Wochen, 3 Tage

    Die meisten Cache-Plugins bieten die Option an, CSS und JS zu kombinieren.
    https://de.wordpress.org/plugins/search/Cache/

    threadi

    (@threadi)

    vor 1 Woche, 5 Tage

    Du hast mit „WP-Optimize“ bereits ein Optimierungsplugin in deinem Projekt was dir die Möglichkeit geben könnte. Die haben dazu hier eine Hilfe: https://getwpo.com/faqs/how-do-i-merge-but-not-minify-my-css-files-or-only-minify-and-not-merge-my-css-files/

    Noch als Hinweis: das Plugin „Performance Lab“ brauchst Du nicht in einem Live-Projekt einsetzen. Das Plugin dient dazu potentielle neue Funktionen für WordPress zu testen, etwas was du nicht in einem Live-Projekt machen solltest. Zudem überschneidet es sich Funktional ggfs. mit WP Optimize, was man vermeiden sollte.

    Ebenso hast Du mit Backuply und UpdraftPlus 2 weitere sich funktional überschneidende Plugins im Einsatz. Verzichte auf eines davon.

    Moderator Bego Mario Garde

    (@pixolin)

    vor 1 Woche, 5 Tage

    Ein zusätzliches Plugin für serverseitigen, persistent Cache (z.B. OPcache Manager) könnte die Performance noch ein wenig verbessern – vorausgesetzt, der Webhoster unterstützt einen Cache wie z.B. OpCache. Das sollte in Werkzeuge > Website-Zustand auch angezeigt werden.

    Mit dem Plugin Query Monitor kannst du herausfinden, ob es bei bestimmten Seiten zu besonders langen Laufzeiten kommt und welche Skripte dabei eine Rolle spielen. Das Plugin wendet sich an professionelle Nutzer und liefert entsprechend viele Informationen.

    Thread-Starter tomjoad2023

    (@tomjoad2023)

    vor 1 Woche, 5 Tage

    Vielen herzlichen Dank für die wertvollen Tipps. Werde ich gleich morgen checken, wenn ich zurück am Schreibtisch bin.

    Viele Grüße Thomas

    Moderator Bego Mario Garde

    (@pixolin)

    vor 1 Woche, 4 Tage

    Nach dem theoretischen Tipp habe ich mir nun nochmal die Webseiten selbst angeschaut.

    Der erste Ladeversuch brauchte tatsächlich ungewöhnlich lange (sicherlich über zwanzig Sekunden), während weitere Aufrufe in anderthalb Sekunden die Webseiten anzeigten. Solches Verhalten kenne ich vor allem von Websites auf einem Shared-Hosting-Server, bei dem die Anfragen zu diversen Websites stapelweise abgearbeitet werden. Wenn du Pech hast, liegt eine Anfrage zu einer Webseite mit einem sehr hohen Datenvolumen oder auch langen Skript-Laufzeiten oben auf (deine Anfrage dauert sehr lange) oder eben im besten Fall nichts (Anfrage wird sofort beanwortet, Webseite ist direkt da). In solchen Fällen hilft eine Rückfrage beim Webhoster, die eine Auslastung des Webservers protokollieren können und dich im Zweifelsfall auf einen anderen Webserver umziehen.

    Eine Analyse mit GTMetrix.com ergibt einen eher mäßigen Performance-Wert – hier geht sicher noch mehr. Page-Builder wie Elementor erzeugen oft einen unnötig verschachtelten HTML-Code, der sich negativ auf die Performance ausübt. Der Ansatz, ein Cache-Plugin zu nutzen, ist schon mal gut. Ob WP-Optimize (das ursprünglich zur Optimierung der Datenbank entwickelt wurde, daher der Name) nun das optimale Werkzeug ist, müsste man im Vergleich zu anderen Plugins austesten. Für Anwender, die sich wenig mit Einstellungen abmühen wollen, ist Surge eine interessante Alternative. Wer sich nicht vor ein paar Einstellungen scheut, ist bei Comet Cache gut aufgehoben, weil Dinge wie die in Pingdom reklamierte fehlende Datenkompression gut erklärt werden. Wenn ein paar Euro für ein kommerzielles Tool im Website-Budget übrig sind, ist auch WP-Rocket (59€/Jahr) ein gutes Werkzeug, um die Performance zu optimieren.

    Performance-Lab bietet einige interessante Features, die es vielleicht irgendwann mal in den WordPress Core schaffen werden. Die Entwickler empfehlen trotzdem, „mit Vorsicht vorzugehen und sich darüber im Klaren zu sein, dass [die Nutzung des Plugins] auf eigenes Risiko geschieht“. Im Zweifelsfall hast du irgendwann einen unnötigen Mehraufwand, weil z.B. doch plötzlich ein anderes Bildformat verwendet wird und die vorhandenen Bilder ausgetauscht werden müssen. Für die oben aufgeführten Performance-Probleme ist das Plugin ohnehin keine Lösung.

    Moderator Angelika Reisiger

    (@la-geek)

    vor 1 Woche, 4 Tage

    Ob WP-Optimize (das ursprünglich zur Optimierung der Datenbank entwickelt wurde, daher der Name) nun das optimale Werkzeug ist, müsste man im Vergleich zu anderen Plugins austesten.

    Ja genau das wollte ich mit meiner knappen Antwort ausdrücken. Ich bin davon ausgegangen, dass durch die Installation von WP Optimize sowie der Problemstellung (Komprimierung) bereits einiges an Tests mit dem Plugin erfolgt ist.

    Leider sind Cache-Plugins nicht so einfach zu konfigurieren, oft genug habe ich so einige wieder entfernt, weil es irgendwo dann wieder hakte. Hier hilft nur „ausprobieren“. Bego hat ja bereits gute Plugins genannt.

    Thread-Starter tomjoad2023

    (@tomjoad2023)

    vor 1 Woche, 4 Tage

    So, ich habe nun zunächst mal folgendes von euren super wertvollen Tipps umgesetzt:

    1. Plugins „Updraft Plus“ und „Performance Lab“ deaktiviert.
    2. WP-Optimize: Die beiden CSS-Checkboxes „Enable minification of CSS Files“ und „Enable merging of CSS Files“ der Anleitung entsprechend deaktiviert – war das richtig so?
    3. „Surge“ behalte ich mal als Alternative zu WP-Optimizer im Hinterkopf.
    4. „OPcache Manager“ habe ich installiert und aktiviert.
    • Diese Antwort wurde geändert vor 1 Woche, 4 Tage von tomjoad2023.
    • Diese Antwort wurde geändert vor 1 Woche, 4 Tage von tomjoad2023.
    tatort

    (@tatort)

    vor 1 Woche, 4 Tage

    Hi,
    mal eine ganz andere Frage. Wenn ich es richtig sehe hat die Webseite nur sehr wenig einzelne Seiten.
    Vielleicht ist da ein einfacher HTML Dump viel einfacher und „Wartungsarm“ als sich hier mit WP herum zu schlagen….

    Da braucht es dann auch keine Plugins mit Abo. Fiverr oder eine der KIs hübst den Quelltext noch auf und fasst die CSS/JS Datein zusammen „fertig“.

    Thread-Starter tomjoad2023

    (@tomjoad2023)

    vor 1 Woche, 2 Tage

    „Updraft Plus“ musste ich wieder aktivieren…sonst kommt die Seite nicht bzw. eine Fehlermeldung stattdessen.

    Aber ich habe jetzt mal „Backuply“ deaktiviert, da scheint zu gehen.

    • Diese Antwort wurde geändert vor 1 Woche, 2 Tage von tomjoad2023.
    Thread-Starter tomjoad2023

    (@tomjoad2023)

    vor 1 Woche, 2 Tage

    WP-Optimize habe ich jetzt auch mal deaktiviert und Begos Tip folgend Comect Cache aktiviert. Erster Eindruck ist: alles läuft schneller.

    Thread-Starter tomjoad2023

    (@tomjoad2023)

    vor 1 Woche, 1 Tag

    Hallo, letztlich hat Comet Cache das Problem mit der langsamen Seite auch nicht gelöst. Da es im Gegensatz zu WP-Optimize keinen Image-Kompressor hat, bin ich jetzt wieder zu WM-Optimize zurückgekehrt.

    Den OPCache_Manager hab ich aktiviert – das war ja einer euer Tipps – ebenso wie den Object Cache 4 Everyone. Ich verstehe nicht, was die Plugins machen, habe sie einfach nur „mechanisch“ aktiviert und hoffe, dass das Sinn macht.

    Query Monitor habe ich ebenfalls installiert. Das zeigt an: „Während einer Ajax-Anfrage wurden PHP-Fehler ausgelöst. Weitere Informationen finden sich in der Entwicklerkonsole deines Browsers.“ Im Unterpunkt „PHP-Fehler“ stehen zwei mit denen ich nichts anzufangen weiß: (1) Creation of dynamic property WP_Object_Cache::$cmd_set is deprecated und (2) Constant FILTER_SANITIZE_STRING is deprecated. Ob das jetzt der Grund fr die langsame Website ist.. keine Ahnung.

    Beim Host Onlydomains habe ich wegen Server Performance Daten angefragt, sie reagieren bislang darauf aber nicht. Ich bleibe dran.

    Thread als beantwortet markieren?

    Auch wenn mein Problem – langsame Website – bestehen bleibt, wurde die ursprüngliche Frage in meinem Thread beantwortet (JS und CSS kombinieren). Deshalb würde ich mit Rücksicht auf die Foren-Regeln bzw. der Sauberkeit der einzelnen Threads jetzt diesen Thread auf „gelöst“ markieren, oder? Ich kann dann ja einen anderen Thread aufmachen.

Ansicht von 11 Antworten – 1 bis 11 (von insgesamt 11)