wordpress jQuery verursacht fehlgeschlagen chrome Audit-Tool - Rendern blockieren

Ich arbeite an meinem Thema, und testen Sie hier und da in Chrome-Audits, um zu sehen, wie es aussieht, wie ich auf der Website arbeite.wordpress jQuery verursacht fehlgeschlagen chrome Audit-Tool - Rendern blockieren

Ich bemerkte, dass bei der Verwendung von jQuery als abhängig von einem Skript, fehlschlägt Chrom Audit und sagt, dass das Skript Render-Blockierung ist. Gibt es einen anderen Weg oder eine andere Möglichkeit, die ich in mein Enqueue-Skript einfügen sollte, um dies zu verhindern.

Mein Code. (Zum leichteren Lesen Verkürzte)

functions.php

function site_assets() {  
    wp_enqueue_script('force-easy-scroll', get_template_directory_uri() . '/js/force.min.js', array('jquery'), null, true); 
} 

add_action('wp_enqueue_scripts', 'site_assets');

TRUG HTML

<!-- END MAIN SITE CONTENT --> 
    <footer> 

    </footer> 
    <script type='text/javascript' src='http://smtg-new/wp-content/themes/SMTG_THEME/js/force.min.js'></script> 

    </body> 

</html>

CHROMES AUDIT

Jetzt für Testi Zu diesem Zweck habe ich 4 Skripte, die ich jetzt in die Warteschlange einfüge, die alle direkt vor dem schließenden Body-Tag stehen. Alles abhängig von jQuery. Ich werde sie später kombinieren. Aber keine von denen zeigt als Render-Blocking, da unten auf der Seite.

Wie kann ich die eingebaute jQuery von wordpress bekommen, um nicht zu blockieren? Es macht einen ziemlich großen Treffer in der Zeit und es ist frustrierend. Ich entziehe seine eigene Version von jQuery lieber nicht und benutze meine. Ich mache keine ausgefallenen Sachen damit ich nicht die neueste Version brauche. Da ist die Version völlig in Ordnung.

Quelle

2017-11-02 grimesd

Versuchen Sie es mit dem Autoprimize-Plugin - https://wordpress.org/plugins/autoptimize/. Das Plugin bietet eine Option (unter den erweiterten Einstellungen), um das Laden von jquery im Kopfteil zu deaktivieren. Bitte beachten Sie, dass dies zu Problemen führen kann (am wahrscheinlichsten mit Plug-ins, die jquery-abhängig sind - wie etwa Gravity Forms). Bitte lassen Sie mich wissen, wenn Sie weitere Informationen benötigen.

Quelle

2017-11-02 14:49:42

Danke für die Info, sah ich dieses Plugin irgendwo in meiner Forschung. Gibt es einen "non plugin" Weg dies zu tun? Ich kann meine js und css auf eigene Faust minimieren. Ich möchte nicht wirklich ein Plugin für diese Funktionalität installieren, nur um eine Sache darin zu verwenden. Es scheint mir eine Verschwendung von wertvollem Raum und Ladezeit zu sein. – grimesd

Der Zweck von Autoptimze ist speziell, Ihre Website für Google-Seitengeschwindigkeit schneller zu machen. Aber Sie können selbst damit umgehen, indem Sie schauen, wie sie es tun, oder die JQuery herausnehmen und sie am Fuß wieder in die Warteschlange stellen. Suchen Sie in Ihrem Thema so etwas wie wp_enqueue_script ('jquery'). –

Vielen Dank für die Info. Ich werde dort Plugin herunterladen (installieren) und dann schauen, wie sie jquery dort umgehen. Ich erstelle tatsächlich mein eigenes Thema von Grund auf und neuere zu Wordpress, also Stück für Stück. – grimesd

** UPDATE ****

fand ich diese Antwort mit mehr Forschung Incase jemand möchte tut wissen, wie es zu tun.

function move_jquery_to_wpfooter() { 
    wp_scripts()->add_data('jquery', 'group', 1); 
    wp_scripts()->add_data('jquery-core', 'group', 1); 
    wp_scripts()->add_data('jquery-migrate', 'group', 1); 
} 
add_action('wp_enqueue_scripts', 'move_jquery_to_wpfooter');

Dies effektiv jquery Skripts direkt vor dem schließenden body-Tag.

Antwort wurde hier auf Stapelüberlauf gefunden.

Quelle

2017-11-02 18:30:23 grimesd

wordpress jQuery verursacht fehlgeschlagen chrome Audit-Tool - Rendern blockieren

Antwort

Verwandte Themen