Cum pot amâna aceste fișiere JS?

Question

Cum pot amâna aceste fișiere JS?

19 dec. 2018, 09:06:39

Vizualizări: 3.19K

Voturi: 1

Pe site-ul meu, am folosit GTmetrix și am primit o eroare de amânare JS pentru următoarele două fișiere.

92.5KiB de JavaScript sunt analizați în timpul încărcării inițiale a paginii. Amână analizarea JavaScript pentru a reduce blocarea randării paginii.

http://mysite.url/wp-includes/js/jquery/jquery.js?ver=1.12.4 (87.0KiB)

http://mysite.url/ (5.5KiB de JavaScript inline)

În fișierul meu functions.php am următorul cod pentru a amâna js, dar se pare că nu afectează fișierele js din afara folderului temei.

Iată fragmentul meu de cod din fișierul functions.php

if (!(is_admin() )) {
    function defer_parsing_of_js ( $url ) {
        if ( FALSE === strpos( $url, '.js' ) ) return $url;
        if ( strpos( $url, 'jquery.js' ) ) return $url;
        // returnează "$url' defer ";
        return "$url' defer onload='";
    }
    add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 );
}

Cum pot elimina acea eroare și amâna analiza elementelor menționate mai sus?

Vishwa

376

personalizare dezvoltare teme jquery include

Toate răspunsurile la întrebare

vikrant zilpe 478 · Accepted Answer · 2018-12-28T07:51:13Z

Ce sunt atributele Async și Defer?

Iată ce fac atributele async și defer:

Atributul Async: Atributul async încarcă scriptul în mod asincron. Cu alte cuvinte, asigură că scriptul se încarcă în paralel cu restul conținutului paginii, după care este executat.

Atributul Defer: Atributul defer amână încărcarea scriptului. Asigură că scriptul este executat doar după ce toate conținuturile paginii s-au încărcat complet.

Ambele atribute sunt bine suportate în toate browserele moderne, inclusiv Firefox, Chrome și Internet Explorer. Internet Explorer a adăugat suport pentru aceste atribute începând cu IE10.

Un exemplu de tag script cu atributele async și defer este următorul:

<script src='http://sitename.com/js/scripts.js' async='async' type='text/javascript'> 
</script>
<script src='http://sitename.com/js/scripts.js' defer='defer' type='text/javascript'> 
</script>

Funcție pentru a Adăuga Atributele 'Async/Defer' la Scripturile Blocante În acest articol, vom analiza trei metode diferite pentru a adăuga aceste atribute la scripturile JavaScript blocante. Aceste metode sunt următoarele:

Metoda 1: Adăugarea defer/async la toate scripturile fără excepție. Metoda 2: Adăugarea defer/async la toate scripturile cu excepția câtorva. Metoda 3: Adăugarea defer/async doar la scripturile selectate. (Cea mai flexibilă metodă, deoarece vă permite să adăugați async la unele scripturi și defer la altele.) Puteți utiliza orice metodă care se potrivește nevoilor dumneavoastră.

Metoda 1: Adăugarea Async sau Defer la Toate Scripturile

Dacă doriți să adăugați atributul async sau defer la toate scripturile fără excepție, puteți utiliza următorul cod.

Deschideți fișierul functions.php al temei dumneavoastră și adăugați acest cod la finalul fișierului.

/*funcție pentru a adăuga async la toate scripturile*/
    function js_async_attr($tag){

# Adaugă async la toate scripturile rămase
    return str_replace( ' src', ' async="async" src', $tag );
    }
    add_filter( 'script_loader_tag', 'js_async_attr', 10 );

pentru informații suplimentare vă rugăm să verificați linkul https://orbitingweb.com/blog/add-defer-async-attributes-to-scripts-in-wordpress/