Como facer que WordPress cargue JavaScript para acelerar a representación da páxina?

WordPressCarga perezosa de JavaScript para acelerar os métodos de renderización das páxinas.

Que é a propiedade Defer de JavaScript?

Probablemente todos se atoparon con esta situación:

Hai N scripts na cabeza, e cando se cargan os scripts, a representación da páxina está bloqueada, que normalmente está en branco.

Por suposto, podemos evitar isto poñendo o script no código fonte no pé de páxina.

Non obstante, algúns entornos de desenvolvemento complexos poden facer que esta tarefa sinxela sexa particularmente complexa.

Neste punto podemos usar a propiedade Defer, que é unha propiedade relativamente rara en JavaScript.

Quizais nunca o uses, pero despois de ler esta introdución, seguro que non o deixarás.

A súa función principal é permitir que o script se analice despois de cargar toda a páxina, en lugar de analizalo durante a carga, o que proporciona velocidade de carga completa da páxina para os scripts que só conteñen JavaScript activado por eventos.

Si, se a etiqueta de guión ten un atributo diferir, executarase despois de analizar a páxina HTML aínda que estea colocada na cabeceira, o que é semellante a poñer o guión na parte inferior da páxina.

Por suposto, o uso do atraso tamén é limitado, normalmente preste atención a 2 puntos:

1) Non chame ao comando document.write nun bloque de script de tipo diferido;

• Porque document.write producirá un efecto de saída directo.

2) Non use variables ou funcións globais nos scripts Defer, incluídos os scripts de execución inmediata.

Engade o atributo Defer aos scripts usados ​​en WordPress

En WordPress, como podemos engadir automaticamente o atributo Defer aos scripts utilizados por WordPress?

Podemos engadir o seguinte código ao ficheiro functions.php do tema actual ▼

add_filter( 'clean_url', 'wpcwl_defer_script',11,1);
function wpcwl_defer_script( $url ){
if(strpos($url, '.js') === false){
return $url;
}

return "$url' defer='defer";
};

• O código anterior só funciona, segundoCódigo JavaScript introducido por WordPressserá efectivo.

注意 事项

A xestión da vista previa en directo pode mostrarse en branco:

Se usas o código anterior, cando abres a xestión da vista previa en tempo real (Aparencia → Personalizar), pode aparecer en branco, polo que úsao segundo corresponda.

Cando sexa necesario xestionar a vista previa en tempo real, comenta o código anterior e elimina o código comentado despois de completar a personalización.

Exemplo de código de comentario PHP:

/*

这里是代码 

*/